Lyft Pink Branding & Visual Language

OVERVIEW

Lyft's new multi-modal membership program which has an elevated Lyft experience with preferred pricing and many other benefits to enable riders to unlock all their city has to offer.

I led the design of the brand identity and visual language for the in-product experience. I also provided art direction for how Lyft Pink comes to life in our marketing communication channels.

ROLE

Strategy

Identity

Brand XP

Product Design

Art Direction

061919_Zac_Lyft_14_0519-1

Lyft Pink

With any new big initiative within a company, comes some serious challenges. My team and I were setting out to create an identity that could potentially become a core experience for a large portion of our users. Think of Amazon Prime as compared to the Amazon master brand. We needed to establish brand hierarchy and figure out how this membership program would fit within the business—was it a sub-brand or not?

Early on in the process, we were already starting an identity project without a name which is pretty difficult, what's even more challenging is working on an identity for three months without a name. But eventually, after months of research, tons of meetings, and approval from the founders, we finally landed on a name.

Naming
NAMING, APPROACH, AND PRINCIPLES

We went with a more branded name as it allowed us to lean into our existing identity, avoid the "pricing product" territory, and got us out of the economic tit-for-tat we’d been in with the competition.

Considering that the Lyft brand is known for being bold, tenacious, and having a sense of humor — it made sense to create an identity with similar principles in mind. Listed below are the principles our team created to help drive the work for our new membership program.

01

Valuable and rewarding

It pays to be a member, we find opportunities to save and pass those savings along to our members to create value in the program.

02

Extend the Lyft brand

An extension, not a deviation, from the Lyft core brand identity. Maintains the trust, friendliness and humanity of the core brand.

03

Elevated, not exclusive

Membership confers status, but it’s open to everyone.  It has social capital and the branded product experience itself has the “over the shoulder” effect.

04

Unlocks the city

Membership unlocks frictionless city living, giving our riders a flexible and cost-effective way to get around. Whether by car, bike, scooter or public transit — they have the dependability and confidence to explore and enjoy their city.

05

Rooted in community

When riders become members, they are buying into the Lyft family and the community as a whole. Both the brand and product experience should reflect this sense of community.

Concept & Exploration

I identified three main areas of focus that would become the backbone for our visual directions and early explorations for the Lyft Pink identity.

Over the course of the three-month naming process, we worked through early explorations and developed a variety of name-agnostic artifacts using placeholder names like Lyft Club, Lyft Membership, and Lyft Squad.

City
CITIES
People
PEOPLE
Movement
MOVEMENT
artboard_multiple
Nº1: 📸 Snapshot view of the iterations I went through during the branding process.

I soon began to reference the diverse set of benefits within our program as a primary source of inspiration to tell the story of how our membership program is made for you regardless of how you get around your city.

Orb_648
Nº2: 🔮 Early concept called The Orb, a membership program that revolves around you.
LyftClub
Nº3: 🚅 A concept called "The Journey", featuring the placeholder name Lyft Club.
ClubAwaits
Nº4: 🕺 A fun little pun for Lyft Club, building on "The Journey" direction.
Iterations-1

Logo System

Considering the fact that Lyft only has a logotype, I was very hesitant to introduce any sort of mark or icon which may confuse users and potentially have them associate that mark with the master brand rather than the membership program.

LyftPink

Color Palette

With a name like Lyft Pink, it's assumed that the identity incorporates the color pink in some aspect or another. This is where our bold sense of humor came to life, considering that a good portion of our interface is pink or purple, it didn't make sense for us to also use pink in the identity. This allowed us the flexibility to diverge from the brand without diluting it.

GoldenPath-2
Nº5: 💛 The Golden Path, an example of what our normal interface color palette looks like.

We needed to create an in-app experience that looked and felt special, elevated, and differentiated from the core Lyft experience. When others expected us to zig, we zagged – which soon coined the term below.

Every color except for pink

CONCEPTUAL THINKING

Doubling down on this concept, I developed a very vibrant visual language that was based on the following: people constantly moving throughout their city, the many modes of transportation people take, and the variety of benefits that users can leverage based on their needs.

This notion of movement and color was really interesting and so it became an integral source of inspiration for the brand system.

Full Spectrum Gradient (Marketing & Brand Moments)

Full_Spectrum
Sunset 50: #FF4E28
Yellow 50: #FFCA13
Citron 70: #9AC800
Teal 40: #00B0B9
Indigo 60: #665AFF
Rose 70: #A00093

Session-Based Subgradients (In-Product)

Rectangle-Copy-23
Rose 70: #A00093
Sunset 50: #FF4E28
Yellow 50: #FFCA13
Rectangle-Copy-24
Rose 70: #A00093
Indigo 60: #665AFF
Teal 40: #00B0B9
Rectangle-Copy-25
Indigo 40: #665AFF
Teal 40: #00B0B9
Citron 70: #9AC800
Rectangle-Copy-26
Rose 70: #A00093
Indigo 60: #665AFF
Teal 40: #00B0B9
Rectangle-Copy-27
Sunset 50: #FF4E28
Yellow 50: #FFCA13
Citron 70: #9AC800
Rectangle-Copy-109
Rose 70: #A00093
Indigo 60: #665AFF
Teal 40: #00B0B9
ACCESSIBLE SESSION-BASED GRADIENTS

I worked closely with Evan Maeda on our Design Systems team to refine a color palette for the gradient that met all our accessibility guidelines. This enabled me to have a good base of colors to start with as I began defining the framework for how we used color within our product experiences, which I called "Session-Based Gradients" which are defined below.

Any marketing-related content or brand moments would use the full spectrum color palette/gradient. Then within the product experience, I defined a set of six animated subgradients that were randomly generated on each new session (each time a person opens the app) for the user.

ANIMATED FULL SPECTRUM
full-spectrum
ANIMATED SUBGRADIENTS
1
2
3
5
6

Further reinforcing this idea of every color except for pink, the vast array of city-dwellers, and the many ways they navigate their cities.

Typography

Since this was a program that lived within the Lyft app, we leveraged our existing brand typeface, Lyft Pro. This allowed us to maintain a strong level of consistency across all of our customer touchpoints.

LyftPro-1
Nº6: 🔠 Lyft's brand typeface, Lyft Pro Bold.
LyftProRegular
Nº7: 🔠 Lyft's brand typeface, Lyft Pro Regular.

In-Product

As I was working on the visual identity, I collaborated with Farhi Tasdelen to first identify the core experience screens and then we had to parallel path the work on the MVP experience.

This made designing the product experience even more challenging as we were not only designing the flow, but also applying copious amounts of visual styles at every stage of the identity review process.

Girls-1

Our goal was to create an elevated experience that had an "over-the-shoulder" effect (visibly different experience). From the signup screens down to rating and paying your driver, I worked through how much we turned up or down the brand volume in specific scenarios.

I also created a prototype that incorporated sound as a component of how we could create awareness and virality by introducing a new ride request sound into the membership experience to make it feel even more special and differentiated.

GoldenPath_02_Dark
Nº8: 📱 Areas of opportunity on the Sales, Celebration, and Home screens including the surprise banner.
Screens
Nº9: 🌈 Early explorations of the Sales page, introducing the benefits of the program.
GoldenPath_01_Dark
Nº10: 📱 Value reinforcement on the Mode Selector, Progress Bar during a ride request, and another value reinforcement on Rate & Pay.

Current Experience

Below you'll find the most up-to-date Lyft Pink experience, I'm currently in the process of revisiting this work and creating documentation for when and where to dial up or down the level of brand in a given experience.

TAKEAWAYS

Innovation and creativity come from the accumulation of ideas across time and disciplines and combining those ideas in creative ways.

High profile projects tend to get designed by committee, so it’s important to diligently protect the creative space for your team particularly in these scenarios; allowing the right amount of feedback at the right time is crucial.

Results available upon request.

PinkScreensLayout

Credits:

Product Design Manager 👉 Ryan Farina

Executive Creative Director 👉 Tim Roan

Product Designer 👉 Fahri Tasdelen

Motion Designer 👉 Bert Paige

Product Marketing 👉 Brittany Branscomb

Product Manager 👉 Mojin Chen

Design Ops 👉 Kyle Caruso
 

Contact

Interested in working together?

© 2020 Jonathan Howell → Don't be a jerk and steal my work.

© 2020 Jonathan Howell