Coursera Rebrand

OVERVIEW

Coursera was nearing its 10th year and we needed a rebrand to reflect our growth and mission to make education accessible to all. Creating a successful brand is truly a group effort that couldn't be achieved without close collaboration, so a massive thank you goes out to the team listed above for their contributions. Below you will find the work I contributed to the project and my design rationales.

OBJECTIVE

Creating an iconic brand identity

Coursera was nearing its 10th year and we needed a rebrand to reflect our growth and mission to make education accessible to all. Creating a successful brand is truly a group effort that couldn't be achieved without close collaboration, so a massive thank you goes out to the team listed above for their contributions. Below you will find the work I contributed to the project and my design rationales.

Bringing it home

The internal Brand and Product teams worked closely with one of the world's top branding agency on the brand strategy and initial design concepts, but ultimately we knew our product, customers and challenges better than anyone so we decided to bring the development of our visual identity in-house.

Knowledge gained

My creative partner and I were tasked with creating a visual identity to express Coursera’s bold vision and impact in the world. We had a new brand strategy, personality, attributes, and tone of voice to work with, and after reviewing 10 previous design concepts with the rebrand team, we had plenty of insights into what we were looking for our new brand to communicate, and what wasn't working.

STRATEGY

Brand attributes and personality

Our brand personality and attributes are the foundation for how we show up in the world, and each design decision maps back to these core qualities.

We are magnetic, drawing people in and amplifying their potential. We uplift learners on their path to progress. We are trusted and seen as a premium destination. We are inventive and committed to democratizing access to education.

EXPLORATION

Concepts

My creative partner and I each presented 2 rounds of concepts which pressure tested our ideas against key touchpoints and tactical considerations. Then we collaborated to refine the best parts of each concept until we reached a direction the entire team was aligned on and felt excited about.

IDENTITY

Color

The new color palette draws from the natural world to create a calm, uplifting, and dynamic experience. Together, our primary brand colors (white, blue, purple, orange, and yellow) form a sunrise, reflecting the endless possibilities before our learners.

I audited our competitors' brand colors to ensure that ours are ownable and distinctive amongst the competitor landscape, and communicate that we are both the premium and accessible choice in the EdTech space.

Color library

I collaborated closely with the Product team to create extended color palettes for use cases like button states, badges, dark mode, and more. We defined usage guidelines that made it easier for designers to know when to use certain colors and which shades passed WCAG accessibility standards. Together, we built a color library that drives efficiency, consistency and scalability.

II.

Typography

When selecting a type family for Coursera I took into account a number of factors. Type is the visual expression of our brand's tone of voice so it needed to feel warm, conversational, informed & confident.

To make learning accessible to all we need to display text in dozens of different languages, so our type family needed to support all of the languages we translate content into.

I also had to consider the added page weight of serving many different fonts, which creates a barrier for learners who live in countries where data usage is expensive.

Another thing that is expensive is licensing fonts for the volume of web and app traffic we receive, so cost had to be a consideration.

And it had to look great. Enter Source Sans Pro.

I chose this sans serif type family for its unfussy, modern appearance. It's round enough to feel friendly without being childish and narrow enough to feel at ease while remaining readable.

Source Sans Pro is open source and free for commercial use, translating to huge cost savings each year. It's also available within Google Suite, so internal documents and presentations could be on brand. Bonus!

This type family supports 582 languages, allowing Coursera to always look like Coursera no matter the alphabet.

Accessibility

Bringing together color & type, I collaborated with the Product team to establish web background and font colors that met WCAG accessibility standards so our web experiences remained accessible to people with disabilities.

III.

Imagery

Our learners are at the center of everything we do. The photography direction we established heroes the learner, demonstrates the impact of learning and authentically represents our global community.

Image library

I identified the different imagery families we would need to fully express our brand story. Product features would show our product in context so a learner can know what to expect when they sign up. Patterns & details focus on the wide variety of subjects taught on Coursera. Learning and Working bring you into the tangible experience of taking a course and applying what you've learned. Portraits and Outcomes show the benefits of learning on Coursera, like increased confidence in interviews or more time to spend with family. I started building out an image library using these image families, which significantly cut down the time spent searching for and reviewing images to use.

Image guidelines

I created imagery guidelines that our production designers, agencies and institutional partners could leverage when selecting, providing or shooting photography for us. The below guidelines apply across imagery families to establish the overall art direction for Coursera's imagery.

IV.

Illustration

Illustration is crucial to brand expression within the learning experience where photography can feel out of place. To offer courses at scale most learners don't have 1:1 interactions with instructors, so our illustration style needed to do a lot of heavy lifting to make the brand feel more human during emotionally-driven points in the learning process like motivating a learner to continue after getting a bad grade.

Note: The above illustrations are stylistic representations done by other artists.

Aligning on a direction

I started by exploring tactile illustration styles that had a human touch and grouped them by drawing medium; pen, marker, paint, pencil and vector. I evaluated each style at 3 different scales; marketing icon, narrative icon and spot illustration. Marketing icons are more functional, representing a simple idea and using the least amount of detail. Narrative icons express a more complex concept but fall somewhere between functional and expressive. Spot illustrations are the most expressive and employ the greatest level of detail.

The team liked the Vector style, which was sophisticated yet approachable, but also were drawn to the more expressive Marker style that created a sense of delight, so I took the best aspects of each to create a unique look for Coursera.

Icon & illustration style

The illustration style I developed works at multiple scales and serves multiple objectives; from graphical representation of ideas, to elevating narratives, to sewing our brand identity throughout the product.

I want our icons and illustrations to feel like a family. I worked with the Product team on the new UI icons and built upon the language established by those symbols. I kept the line icon style of our UI icons and layered on more details, colors, fills, and organic forms.

Moving up the spectrum from functional to expressive, spot illustrations became looser and more imaginative. They maintained the layering of strokes and solids from our icons, but the forms became even more human, organic and approachable than the previous levels, allowing us to support emotive brand narratives.

V.

Graphic device

A graphic device is a kind of shorthand for your brand identity. The Coursera workmark can be reduced to the "C" symbol, becoming a device we can use in a variety of ways to spotlight the learning opportunities and outcomes made possible with Coursera.

C supergraphic

The C supergraphic frames the learner, making them the heroic focal point. This creates the feeling that confidence is radiating out from them and subtly communicates that Coursera is behind them every step of the way.

C window

The C window serves as a lens into the world of Coursera — seeing the incredible progress our learners are making or taking us through the subject matter found on the platform.

C arc

The arc of the C can be used as a pathway between ideas, a representation of progress, or as a point of continuity connecting different layouts.

RESULTS

The new face of Coursera

Coursera’s new brand identity is a reflection of our ongoing commitment to make learning accessible, inclusive, and impactful for all. Each design decision is rooted in our brand strategy and expresses Coursera's personality, purpose and vision. The system as a whole positions Coursera as a premium learning destination where everyone is welcome. Its component parts feel warm, confident and aspirational — drawing people in, and supporting and encouraging them throughout their learning journeys.

New brand identity