UI/UX
App Design
iOS

WOW Camera

Duration
Jan 2022
Role
UI/UX Designer
Responsibility
End-to-end UI/UX design
Company
PhotoGrid (JOYME Inc.)
01 Objective

"WOW Camera" was originally one of the features of PhotoGrid, but it was drawn out as a brand new app. The goal is to reduce the PhotoGrid app’s size and to break into the market of selfie and beauty camera apps.

02  Role & Deliverables

In this project, I worked closely with a product manager and an iOS developer. I was responsible for the end-to-end UX and UI design.

03  Challenge

In the project, we had to rebrand the app and redesign the interface and interactions. In the meantime, we also needed to deal with many prioritizations to make sure we can deliver MVP on time within three weeks.

04  Outcome & Impact

We didn’t advertise the app after its launch. However, we reached an average of 30 daily new installs and 150 daily active users.

Background

PhotoGrid is a collage maker app to create stunning images for social media, like Instagram posts and stories, Facebook posts and covers, YouTube thumbnails, and Pinterest collections.

However, PhotoGrid’s app size was getting bigger because we had lots of features and redundant codes increased in the app. The goal is to reduce the PhotoGrid app’s size and to break into the market of selfie and beauty camera apps.

Challenge

In the project, we had to rebrand the app and redesign the interface and interactions.In the meantime, we also needed to deal with many prioritizations to make sure we can deliver MVP on time within three weeks.

Product Positioning

With so many beauty cam competitors, we needed to create certain characteristics for the WOW camera that aim at creating associations.

1. First of all, I listed the most popular selfie apps and analyzed their brand image and product characteristics. Most of the apps have their charm. Some are located in the second quadrant (which is between cold and mature), while others are located in the fourth quadrant (which is between both dynamic and adorable).

Most selfie apps are designed with pastels to evoke feelings of springtime, femininity, and freshness.  Since the beauty camera apps are female-targeted products, pastel colors are a good fit for marketing themed on beauty camera apps. Therefore, I used pastels in the app design.

Beauty camera apps

2. Secondly, I decided to make this product look adorable and dynamic, but I didn’t want it to be too cute because it may create a barrier to retaining the flexibility of design. If the brand tone couldn’t work out in a short time, we can rapidly react to failure and change the brand tone and UI style. That’s why we need to keep the clean user interface and create components to maintain flexibility.

Brand positioning

The following are the screenshots from different beauty cam.

After observing so many competitors, I came up with a color plan and the final visual artifact.

Proposal

Wow Camera is a beauty and selfie camera app. It helps you snap sweet selfies, face filters, and makeup. Various live camera filters are in this app including dog, cat filters, rabbit filters, and hundreds of trendy photo filters. It’s easy to use and handy.

User Flows

Taking Photos
UI Flow of video recording
UI Flow of applying filters

Findings

Default aspect Ratio 9:16

The filter panel of Butter Cam and B612 have been filled with the background color. In this case, the aspect ratio will be affected due to the height of the panel, and it’s no longer the perfect ratio of 3:4 or 9:16. However, the most preferred aspect ratio is 9:16 which is the Instagram Story size. If the users take selfies by applying effects in Butter Cam and B612 beauty camera apps, they need to resize their photos to meet the IG Story size.

Therefore, we want to solve the problem and help users save time from resizing their perfect selfies in other apps. We make sure our camera’s default aspect ratio is full screen in portrait mode (9:16 aspect ratio).

Aspect Ratio

Using the frosted glass effect on the filter panel

When we tried Butter Cam and B612, we found that the height of the panel limits the aspect ratio of the photo (3:4), although the colored background helps better showcase the filters.We thought there was a solution to the problem and that is thinking about, “How can we remain the same aspect ratio while the filter panel is collapsed?”, and “How to browse the effects effortlessly through design and how can we remain the same aspect ratio whole time?”.

Therefore, we tried the frosted glass effect and made it our solution. It may not be the best solution, but it eventually helps:

  1. Users can browse the filters and AR effects effortlessly
  2. Keep the original aspect ratio of the camera (9:16)
  3. Indicate the aspect ratio would stay the same and the height of the panel wouldn’t affect the aspect ratio of the camera

Outcome

Measuring Success
  • App Downloads
  • DAU

We didn’t advertise the app after its launch. However, we reached an average of 30 daily new installs and 150 daily active users.

Learnings

It was my first experience designing a feminine product, and I was glad that I had the opportunity to design from a female aspect knowing what girls want when taking selfies. Throughout the design process, I worked closely with the iOS engineer and tried many selfie camera apps as we could. Hoping to make the interactions go smoothly, I made a few prototypes and found references to enhance the design-to-development handoff and reduce knowledge gaps between parties by communicating often.

The Team

Product Manager  |  Nana Fu
UIUX Design  |  Wen Lin
iOS Engineer  |  Wayne Shiau
Design Director  |  Jesse Chou

No items found.