CSD_Masthead.jpg

C L I E N T

YouTube Services

R O L E

UX/UI Design

Visual Design

Strategy

T E A M

Creative Director / James Phillips

Developer / Oliver Dooley

T Y P E F A C E

W E B S I T E

YouTube Sans

Roboto

Services Directory Refresh

O B J E C T I V E 

A UX/UI refresh to the former YouTube Creator Services Directory website with the goal of a more streamlined user experience

A P P R O A C H

A refresh keeping the purpose of the site in mind- Creators looking for service providers or Partners like music labels and media agencies looking to offer their services. Revisiting the users and their needs, the functionality of the current directory stayed the same but their experience is now more intuitive, the design is more flexible and the content is more reliable. The design adheres to YouTube's latest web standards.

Goal_CSD.png

A U D I E N C E    P R O F I L E 

Users.png

CONSIDERATIONS

Considerations_CSD.png

D E S I G N    P R I N C I P L E S 

Screen Shot 2021-05-07 at 8.10.05 PM.png

S I T E     A R C H I T E C T U R E

Site architecture_CSD.png
Macbook air.png
services dropdown.png
CSD_mobile_directory.gif
Samsung Galaxy S8 Arctic Silver.png

D E S I G N   S Y S T E M   +    L I B R A R Y 

Design system.gif

USER FLOW 1

Goal: Creator  finds potential partners by applying the Services, Locations and Languages filters

User Flow_Creator_CSD.png

UX/UI  CHANGES

Filters | Services

Old

Very concise list of service filters

Tooltips to give

users more information about the service 

New

services_new.png
old services filter.gif

Filters | Locations

Old location.png

Old

Separate search field

Option to search by Region and Country

New

location_new.png

Filters | Languages

old language.png

Old

Separate search field

New

languages_new.png

Checkboxes to facilitate multiple selections

Languages listed in alphabetical order for an efficient search

Profile cards

old AA.png

Old

Larger titles in YouTube Sans 

Logos masked within a rectangle instead of a circle

Improved leading

CTA Buttons in blue

New

profile card_new.png

Profile page

Old

ss profile old

Subdued previous and next arrows

Easy navigation

Profile introduction with a basic bio

Overall, cleaner and more flexible layout with sections that can be moved around easily

Prominent sections using subtle dividers and titles in YouTube Sans

New

Reordered sections for a more sequential user flow

Better placement of footer on the page

Ability to change profile language

profile_new.png

USER FLOW 2

Goal: Partner signs in to create or edit profile

User Flow_Partner_CSD.png

UX/UI CHANGES

Macbook air.png

Partner application page

Improved form design

Tooltips to help new partners better understand the category

Page layout that mimics the Profile page

Expanded/Active view

Collapsed/Inactive view

04. Partner application_inactive_collapsed.jpg
04a. Partner application_active_expanded.jpg

Limited dropdown options to reduce page length. Scrollbar to view all

Restructured page following the sections from the Profile page

UX / VISUAL DESIGNER