Click anywhere to interact with this prototype

Daily News

iOS

Apr 2015

Behind the Scene

Team Members

  • 1 Visual/UI/UX Designer: Me
  • 1 iOS Developer
  • 1 Product Manager

My Responsibilities

Design complete prototypes and logo for Daily News.

Target Users

People who have full time jobs and aged between 22 and 45.

User Scenario Studies

After studying the similar apps (Netease News, Pengpai News, etc.) I found that most apps contained comprehensive information but had a cluttered interface which could not allow users to find their interested news at once. Our target users are people who have full time jobs. They would like to take a quick look at the news on their shuttle buses or during the lunch breaks, so they prefer the news they care about.

Key Features

After group discussion, we decide that Daily News should have the following features:
  • Clear and concise interface:
    Clear and concise interface makes news easier to read.
  • User Customizable Bottom Bar:
    Users can choose the news categories they are interested in and drag them into the bar. After that, users can slide to see onlly the news they are interested in.

Wireframes


Wireframe

Problem 1: How to bring users a clear and fluid reading experience when there are too many news and words on the news feed page?

  • Solution: Use cards to collect the news, which will make the interface structured and clean.
    Before:
    After:

Problem 2: How to make users know the news contents of this page at a glance?

  • Solution: At first, I wanted to display a little content at the end of headlines in each card. However, I found it would increase the size of cards and decrease the number of news on the screen, making users slide the screen more frequently. The first usability test showed that users felt tired to slide screen frequently when they were reading. Moreover, many users said that part of content didn’t help them know the news at all. Hence, I deleted the contents and kept only the deadlines, sources and time. And the test showed that 4 to 5 pieces of news on one screen would optimize the reading experience and greatly reduce the times to slide screen.
    Before:
    After:

Problem 3: How to enable users to comment while they are reading?

I found that most news apps must comment at the bottom of news, whereas, numerous users commented before they finished reading the news.
  • Solution: I put the comment button on the top right corner so that users could post comments at any time, which greatly saved their time.

Usability Tests

We conducted two rounds of usability tests. In each round, we invited 50 participants to use the camera, observe their interactions with the app, and analyze the problems as below.
  • Learnability:
    How easy is it for users to accomplish basic tasks the first time they encounter the design?
  • Efficiency:
    Once users have learned the design, how quickly can they perform tasks?
  • Memorability:
    When users return to this design after a period of not using it, how easily can they reestablish the proficiency?
  • Errors:
    How many errors do users make? How severe are these errors? How easy can they recover from the errors?
  • Satisfaction
    How pleasant is it to use the design?

Feedbacks

  • Learnability:
    90% of users had no difficulties using the camera from the beginning.
  • Efficiency:
    70% of users can use all the functions in a very short time. 30% of users spent a little time to figure out how to customize the bottom bar. However, once they figured out, they liked the feature a lot. 10% of users spend some time to figure how to read the news category that are not in bottom bar.
  • Memorability:
    In the first round of usability tests, we invited 25 users to use the camera. One month later, we invited the same group back. 100% of them know how to use the functions.
  • Errors:
    85% of users barely made mistakes.
  • Satisfaction:
    90% of users believed that the interface is clean, and the interaction is very smooth and friendly. The users said that this app gave them a good reading experience and improved their reading efficiency.