Lauren Sian

Zendaya: The App

Zendaya is an actress, singer, social activist, and fashion icon who is gaining massive followers on Snapchat and Instagram. This app gives her fans the ultimate all-in-one Zendaya digital experience.

Objective

Create a digital experience for the client that features editorial content, video content, e-commerce, radio player, and livestream.

Platforms

iOS, web

Company

Whalerock Industries

Launch

November 2016

iphone
iphone screen content

Design

After meeting with Zendaya and getting to know her tastes and likes, the design team created a moodboard that strongly represented Zendaya’s visual identity through images, color palette, and textures. She loves black and white colors mixed in with gold and silver metallics and expressive hand drawn elements.

These distinctive characteristics are carefully considered when crafting the color palette, selecting fonts, and hand drawing icons.

Color Palette

#000000

#000000

#c4ab6a

#c4ab6a

#ffffff

#ffffff

black texture

black texture

gold texture

gold texture

silver texture

silver texture

Credit: Kim Hogan

Credit: Kim Hogan

Typography

main image

Logo Mark

The process of selecting the letter ‘Z’ to represent the app’s icon started with the fact that Zendaya is a very unique and memorable name and most of her friends call her ‘Z’. She gave the direction to have three diagonal lines to suggest the letter Z.

I’ve explored multiple ways to illustrate the letter Z that was simple, iconic, and most importantly recognizable.

Web & App Design

The layout of the site stemmed from Zendaya’s personal taste to have symmetry. She preferred a layout that had balance as well as opportunities to showcase large images. One of the main issues to tackle was the editorial programming for video formats. We knew Zendaya loves using Snapchat, so I specifically implemented a vertical orientation for video publishables as well as horizontal for flat content or horizontal videos. To break up the redundancy of the grid, a shopping component is implemented in key spots to guide the user to the e-commerce section of the site.

MacBook
Mac Book Pro
iphone
iphone screen content
iphone
iphone screen content
iphone
iphone screen content

UI/UX

The system of icons I created were based off Zendaya’s style of handwritten and suggestive marks that felt fun, youthful, but still communicates the function.

Main Navigation Icons

UI Icons

Collaboration: Kelsey Chow

E-commerce shop flow

Working directly with the UX designer, these screens were designed based off wireframes that were tested with positive feedback. This flow shows a streamlined checkout experience for unsubscribed and subscribed users all the way through purchase confirmation.

E-commerce shop in video flow

This flow shows the ability to shop while watching video content on the app. Users have the opportunity to see specific products that are featured in the video and add them to their cart. Vertical and horizontal orientations were designed to create an optimal experience for the user.

Animation

These animations that I created were based on ideas that brought life to icons and dynamic layouts.

Spinner

ACTIVE PLAY BUTTON FOR RADIO

Homepage Prototype

This prototype was presented as a first round concept to Zendaya. I teamed up with the UX designer to explore a homepage that felt dynamic, layered, and asymmetrical. We aimed to have a parallax feature to help bring life to each publishable as they independently land in place at different times as the user scrolls down the page. Using AfterEffects to put this idea into motion, it helped the client visualize an actual working prototype of her site.