Click anywhere to interact with this prototype

Zodiac Camera

iOS

May 2015

Behind the Scene

Team Members

  • 3 Visual/UI/UX Designer
  • 3 iOS Developer, 3 Android Developer
  • 2 Product Manager

My Responsibilities

Design the UI of camera functions on the basis of the colors set by UI Director, including camera shooting interface, photo editing screen and sticker download interface.

Target Users

Young female users aged between 12 and 35.

User Scenario Studies

According to the study, female users like to use camera software with different filters. Apps like Snapchat and Snow that provide interesting filters are very popular with female users.

Premises

At first, the main function of this app was to help female users check horoscopes. But we wanted to transform it into a social networking app. The additional camera function enabled the users to do more things after checking the horoscopes.

Key Features

Based on our studies, we intend to make a game that has the following features:
  • Filter
    Enables users to beautify their photos
  • Sticker
    We’ve designed a variety of stickers which could make the photos more interesting.
  • Easy-to-Use
    Since our app is not a camera app, the camera is designed to be simple and easy-to-use.

User Flow Chart

In order to determine users' actions, I created this user flow chart. User Flow Chart

Problem 1: How to place the camera's functional icons in order to make the operation more comfortable?

  • Solution: Since most users are right-handed, I put the rotate-camera icon and flashlights icon on the right for ease of operation.

Problem 2: How to make users understand that some stickers are new and some are available in limited time?

  • Solution: : I added small labels with different colors on the thumbnails of stickers. So users were able to know which sticker was newly added and which sticker was available in limited time.

Problem 3: What if users want to upload their photos immediately instead of going through the photo editing steps?

  • Solution: Having taken this into account, I added a NEXT button on the top right corner of each page. Users could click the button to post their photos without editing steps. With the NEXT button on the top part away from the photo editing area, users could avoid the misoperation.

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:
    Because there were many similar apps in the App Store, 100% of users had no difficulties using the camera from the beginning.
  • Efficiency:
    95% of users can use all the functions in a very short time.
  • 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:
    60% of users felt the NEXT button is confusing because they don't know what's next. They prefer to change the text NEXT to POST.
  • Satisfaction:
    90% of users believed that the interface is clean, and the interaction is very smooth and friendly. Downloads of this app in App Store increased by 10% after we added camera feature.