This is Selfie

Mobile Application Redesign

The Project


My Role

Art Director & Visual Designer

Tools

Sketch, Marvel, Keynote

About Selfie

Selfie is an iOS social media application offering video sharing. Similar to Snapchat, however Selfie concentrates on creating video stories that can be shared with the world. Users can watch other videos, comment or favorite them.

The Challenge

The creators of Selfie wanted a visual redesign of the app that would market toward 13-17 year olds. Their goal was to separate the early teens and the 18+ age groups because the main use case that the creators realized that teens use it for is "adult things". Also, Selfie was seeing a problem with user retention. The challenge was to create a visual design that could essentially get kids to feel like kids again by sharing stories that are fun.

The Solution

After a few style explorations, my final design speaks to a material design style that gives a feeling of fun and playfulness. My thought was that if the interface looks fun and playful that the teens would see it as more of a game rather than another outlet for sexting.

Splash & Login

Home & Profile

Interactive Search Bar

Selfie's original search icon sent the user to a different screen, which I thought wasn't a good user experience. My idea was to make the search icon interactive in the home screen filter. Instead of separating the interaction from the content, having the search bar on the same screen keeps the content connected with the interaction.

Video Record Flow

The Process

Starting out the project began with some competetive analysis to see how other social apps were designed. The competitors I looked at were Snapchat, Instagram, and Vine.

Style Tiles

Final Style Tile

After seeing all my style explorations, the owner liked the directions both clean and sleek, but also the fun flat design. In my final style tile and direction, I wanted to combine both styles that would really speak back to his original branding of 'smart, but approachable'.

Typography & Color

I chose a heavy sans serif fonts to make the text look young and fun. The weight of the font gives the text a "gameish" look and feel. Reading about color theory, I chose a desaturated blue hue to keep it gender neutral and allow the content to stand out. In contrast to the yellow and teal, the background also looks purple which can be known for inspiring creativity. The light yellow was intended to uplift and feel cheerful and fun. Teal can portray open communication, which in relation, I thought would inspire the target audience, early teens to feel free to be themselves.

UI Kit

One of the final deliverables was a UI kit handed to the Selfie guys along with 1x, 2x retina, and 3x retinaHD assets and screen designs.

Alternate layouts

I wanted to explore alternate layouts for some of the screens. I designed both a 3 column grid and single box view along with the current row layout. I conduted a quick preference test for the home layout to consider readability and discoverablility. --Test Results--

Another screen I provided alternate layouts for is the title story screen as part of their video share flow. I created two grid color designs to offer the title the users stories more fun.