YUJIA ZHAO Interaction Design

Problem Space

Many people use RSS readers to view subscribed blogs. If you just want to get a sense of the posts, this kind of reader is adequate. However, often you want to understand the context of a post. What were the previous posts? What did others say about it? What if you want to write a comment? You must leave the reader and enter the actual blog, forum or other RSS sources. You may navigate from there, but now you‘re disconnected from the reader. The reader may lose track of what you‘ve seen and what you‘ve read, or so it seems. The design challenge was to provide users with seamless experience between reader and content, to not lose context, to let the reader better keep track of users’ viewing, and to adapt the reader into the iPhone environment.

Finding the Core

The problem space evoked many important questions to answer: what does the ‘context’ actually mean? What is ‘seamless experience’? What context do we need to provide in the RSS reader? Previous posts? Comments? Background music? Do we have to provide it in the reader?

We discussed our own RSS reading experience and what seamless experience means, as well as generated many concepts along the way. We agreed upon that we need to enhance and facilitate actual reading experience in the actual websites by making the Reader an “ambient” tool, rather than taking users away from the actual posts in real web context. But our design should also support the use of RSS reader as a traditional feeds centralization place.

Concept Development

We developed personas to help with concept generation. We continued to generate a wide range of concepts that address the core, from which the final concept evolved and emerged through discussion and critique. We developed this concept into our initial design, built paper prototype, and conducted usability testing. We iterated and developed our final design based on the user feedback, and made wireframes and mockups for the final design.

The final design UReader is a side-bar plug-in of web browser. There are category tabs on the left to organize feeds. Within each category, accordion structure is used to open and close different feeds sources. Each feed is shown as a title and a brief digest. Clicking each title or digest will bring users to the actual post. In the actual site, there are in-situ hints to keep track of reading while not distracting users. If UReader is maximized, it will occupy the browser and work as a traditional RSS reader where only content is centralized and shown without context. This gives users the flexibility of use. click here for click-through prototype.

Adaptation to iPhone

iPhone platform is a different environment with its own constraints, advantages, and characteristics. In order to adapt the UReader as an integrated part of iPhone environment, we need to take advantages of what iPhone plartform provides, work within constraints, and make the visual and interaction style of the UReader consistent with iPhone platform. The key aspects of iPhone environment we identified were limited screen space, touch screen with gesture-based interaction, and unique Internet browsing experience. We generated sketches that modify and adapt the Reader into iPhone environment. We changed accordion organization into cascade menu flow just like common iPhone application menu, and changed “in-situ” hint into blue dots according to the typical visual style of iPhone application. We developed wireframes and high fidelity mockups.