The (live) App Store challenge part 1
Building an app in one week and blogging about it in-real-time: Idea and design.
This is the second iteration of my App Store challenge. If you would like to know what all the fuzz is about, I suggest reading this article first.
In this post I’ll be going through my idea in detail, letting you all know how I organize my thoughts and the steps I take when I first start a project. I’ll also guide you through the design (UI/UX), and tell you about some specific choices I’ve made in that regard.
The idea
Like all my apps, the idea comes from a personal need. Through the years I’ve been checking the websites of a few select sources I follow (about six or so) every day. However this takes a lot of time, and seems unnecessary when they only update their headline every five hours. So I went on the App Store searching for a simple app that would let me add my sources, and then give me their top news in a short aggregated list, where I could click on whatever I wanted to read more about.
At the core, this is what my app will do. However, I have thought of a ton more ideas that will make this app even more usable. Some of them include an Apple Watch extension, Notification Center Widget, digest notifications (whenever my sources have something new), ability to save for later (like a reading list), a discover section (suggestions based on your current sources), and the possibility to subscribe to certain topics. And that’s just the start of it.
However, due to the nature of this project (and how I usually work), I’ll focus on creating an MVP (minimum viable product) right now, and add features in future updates. The MVP will consist of the core experience of this app, namely seeing the top news from sources you follow.
Problems
Already before I’ve started work on the app, I’ve found a few problems. The biggest one being the ability to add whatever news source the user want. For this to be possible, there needs to be some sort of API that lets me give them a URL and then return the latest top news from that website. Because all websites are built differently, something like this doesn’t exist (to my knowledge at least, let me know on Twitter).
I also thought about using RSS, but this would sadly cause more issues than it solves. First of all, not all websites provide an RSS feed. Secondly, an RSS feed consists of the latest news (not the top news). My app is not a list of the latest news from a source, but rather the top headline from multiple sources. Many websites (such as the NYT) provide multiple RSS feeds, one of them is actually sorted by their headlines. However, very few others does this, and it’d be impossible to find out which RSS feed from a website I need only given it’s name or URL.
I actually built a web app back in the days, which lets the user give any URL and then it automatically checks for and adds the appropriate RSS feed from that website into one aggregated list along with the RSS feeds from four other sources. However, this is not what my current app is about, so RSS is out the window.
The solution is to include a list of sources the user can choose from. I will create a web based script that will go into the the given website when requested, and pull the headline news. Having hard coded a list of options limits the app greatly, especially since I don’t know even 1% of all news sources out there and it’d take forever to add them all. What I’m planning to do to solve that, is to have the list dynamically loaded from a server where I can keep adding new sources without updating the app. I will also include a feature in the app where the user can request a certain source if it’s not already there. The requests will be added to a database and sorted by the most requested, and depending on what I’m doing at the moment I will be able to add it to the app within five minutes. This way the app will continue to grow with the help of the users, without requiring too much effort from me. It’s a win-win situation.
Design
When I originally thought of this, I imagined a really simple app using the most basic of Apple’s design guidelines. I didn’t want any fancy graphics or animations obstructing the news, and I didn’t want any large images taking the attention away from the headline. Seeing how well this work for an app called Overboard by an acquaintance of mine Austin Valleskey, I settled on doing something similar.
It will consist of a simple table with multiple cells, each containing the headline for one app and the title of the source.
Swiping right will let you save it for later, and swiping left will let you delete and refresh.
There will be a button in the top right corner of the navigation bar letting you add more sources, which will bring up a new view.
The header space will just contain a title for now, but is reserved for the segmented control which will let the user choose between his feed and the discover section (might be replaced by a tab bar at some point).
The left button in the navigation bar will also be absent for now, but might be used for a settings menu later (could also be replaced by a tab bar).
The add menu will be an entire project in itself. It will let the users see a full list of all available sources, sort them based on category and language, and even search using a name or URL. There will also be an option to request that the missing source be added to the list, anonymously.
As you can see from the mockup, it’ll all be very simple. The content is in focus, and simplicity is the key to that. I don’t see a reason for creating a detailed and realistic screen in Sketch, so I’ll leave it with this.
Next steps
Now that I have an idea figured out, know how to implement it, and what it’ll look like there’s only one thing left to do: start. I’ll keep planning tonight, set up the server and web script (using Parse), and maybe start implementing the layout in Xcode. Then tomorrow I’ll start developing the app itself, and hopefully finish very soon. If I finish early I might look into implementing a few more features. Once submitted I have about 9 days to create an app icon, screenshots, description, and do the ASO.
Oh, and one more thing. I’ve decided to call the app Newsloop. You know, to stay in the loop.
If you liked this post and are exited about this project, please follow me on Twitter for the latest updates and hit that recommend button below. If you have any suggestions, leave a comment, send a tweet my way, or hit me up on Facebook. Thanks for reading!
Edit: The second part of the challenge is now available here! The third part is finally out here ☺Head over here for the fourth part! The fifth post can be read here, and the app can be downloaded here! The sixth post is finally live here!
