Slader brand design system

About

Slader is a free homework help platform offering millions of solutions to textbook problems. While our primary users are high school students, and our current design reflects a teen-friendly aesthetic, we're looking to broaden our reach to include college students. To achieve this, we plan to revamp our site and brand.

Project Description

We dedicated five months to designing and developing a new design system, which we used to create all the components for our website and app. We also established design style guidelines and standards for the Slader brand to ensure consistency across our products and user experiences.

My Role

Product design

Responsibilities

Concept development, Design strategy, UI design, Interaction design

Timeline

2019-2020

Design system

We defined our brand's foundation, built site components directly in code, and developed design guidelines for consistency.

Foundations

I created brand foundations which include guidance on iconography, typography, layout, and structure.

Design components

I designed all the components which we used on web and native app, I also work with developer to build them in code.

Design guidelines

I also work on creating design guidelines to document how and when to use the components and also the rules of design.

Typography

Color palette

Buttons

Navigation

Data entery

Icons

Tables

Lists

Feedback

Back to Product page