UReader
The Constraints
Design an RSS reader that allows one to see the context of the feed in 1 week.
To make it interesting: create an iPhone version of your design as well in 2 days.
The group included: Moe Rafi, Yujia Zhao, and Heiko Maiwand
How I helped to contribute: sketching, secondary research, usability testing, concept generation
Initial Sketches
To begin thinking about this problem, our team of 4 first looked at what RSS readers are out there. We noticed there were many different types of readers out there. Out of all of these, it was extremely hard to find the context of any RSS reader, so this helped to see the design problem was a legitimate problem not being addressed, even in the real world.
It was at this point where we decided to go to the whiteboard to start developing ideas. We were the most familiar with the RSS reader from Google (GoogleReader), so we kept this in the back of our heads as we were sketching. We first thought of trying different ways of transforming the RSS reader, using different metaphors, like a compass or a map, but as we continued to delve deeper into the problem space, we felt that a “dashboard” along the side of the browser would be the most convenient and lending itself best to a good solution.
UReader Web Design
With a “dashboard” idea set to mind, we wanted to harness the power of why we chose to move forward with this type of design: it didn’t interfere with the normal surfing of the user, it lends itself well to many different RSS feeds easily, and it also has an air of familiarity for most users.
The picture below represents our UReader concept. It is a movable dashboard that contains the RSS feeds of a particular user. It shows which entries are new, and also allows the user to organize their entries in a way he/she seems fit. The icons are also intuitive, which allows the user to take less time to get adjusted to the UReader. The UReader also marks up on the screen which entries haven’t been read yet by placing a circle around them, to let the user know immediately which entries are the most recent.
Context is shown in this design in a couple ways. First, the actual RSS is feed is displayed in the web browser itself, so the user can see the original environment the feed is from. In addition, the entries listed in the UReader are displayed in a fashion that lets the user see what entries are in context with other posts, so the user doesn’t even necessarily have to be in a particular RSS feed to find the context of an entry.
UReader iPhone Design
Pictured below is a task flow model of how the UReader would work on the iPhone. It utilizes the same look and feel as traditional iPhone applications to give it a look and feel of authenticity for the iPhone. This design also utilizes the current technologies and ways people use the iPhone to augment its utility.
In the category view, the user can see all the categories they have created within the UReader. In addition, it uses the iPhone badges to show how many new entries there are in each category.
If a category is tapped, all of the specific RSS feeds for that category are brought up. The user can go back using the arrow in the upper-left hand corner, or tap a different category to bring up the feeds that correspond to that category. By tapping the blue arrow on the right, the next screen (below), corresponding to the entries in the selected RSS feed, are shown.
In this screen, all the RSS feeds’ entries for a particular feed are shown. The ones which are new are marked with a blue dot, similar to the iPhone’s native mail application.
Just as the UReader’s web version marked which entries have not been read yet on the web page, the iPhone design also exhibits this behavior. Blue dots represent the entries which have not been read yet. Starred or other important entries will also be marked in the same manner. In this example, the user uses a green dot to keep track of an important entry in this blog.
At any time if the user wants to add a subscription to the RSS feed, all the user has to do is press the ‘+’ button, and this screen is brought up on the iPhone. The user can then hit the “subscribe” button and the UReader now has this feed subscribed.
Team Rationale [opens in new window]