The Problem to Solve

The goal of Likes.com is to allow users to discover and share personalized photos and gallery-style content on a social platform. One of the big challenges I faced as the lead designer of the Likes app was to differentiate from other competitors in the space while still creating simple yet engaging product.

Whiteboarding the Concept

I worked directly with the CEO and three mobile engineers to figure out the goals, scope, and constraints of the Likes app. Before starting anything, we spent a lot of time discussing the vision for the app. After that, I wireframed a lot on the office whiteboard. This helped me get out ideas in a quick and dirty fashion so we could discuss the design as a team. (Pro tip: use a legal pad or large note pad to trace out nicely proportioned app screens on the whiteboard.)

Wireframing and Prototyping

After whiteboarding and throwing away a bunch of approaches, I moved onto making high fidelity wireframes. At this stage, I was able to get get the entire flow of the app down without worrying what the app styling would need to look like. The engineers were better able to see how the app would be built screen by screen, and we continued to make needed design adjustments.

I had to make a tremendous amount of wireframes to account for all the interactions of the app. I also inluded screens for error states and other edge case dialogs. I sat right next to the engineers while designing, and we talked continuously about what would or wouldn't work from an engineering perspective.

Pixel Perfecting

I moved onto styling the user interface of the app. The main creative direction I was given was that the app should feel cohesive with the design of the desktop site. Beyond that I was given free reign over the app’s look and feel. Using Skala Preview and Flinto, I focused on designing an interface that was clean and allowed the user content to shine through.

Production Design

After all the screens for the app were designed, I prepared all the assets for retina and non-retina screens.

Testing, Testing 1,2,3...

Once the engineers put together the first version of the app, we started testing prototypes with the help of Testflight. We did a lot of testing and iterating to get the app in a place where it was ready to launch to the public.

Continued Iteration

One of the great things about this product is that the team and I continued to iterate very quickly so that we could increase engagement. We analyzed data and user feedback to make add new features and enhancements to the product every week.

Repeating the Process for Android

I repeated a similar design process with the Likes Android app. There were some slight differences in the design, but we tried to keep the feature set and app design consistent accross both platforms.

Final Thoughts

There were definitely challenges with designing this app. There are a lot of moving parts to the Likes product, and it’s difficult for such a small team to work on a social site that spans across so many platforms-- desktop, mobile app, iPhone app, and Android app. Things may not be perfect with this app given the design and engineering constraints we had. However, the numbers just don’t lie. Users are loving the app and returning again and again to discover and share content with each other. It was great to design and to help build this product from the ground up.