top of page
CSD_Masthead.jpg

C L I E N T

YouTube Services

R O L E

UX/UI Design

Visual Design

T E A M

Creative Director / James Phillips

Developer / Oliver Dooley

W E B S I T E

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 using its Search functionality.

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

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

Site architecture_CSD.png

CONSIDERATIONS

Considerations_CSD.png

EARLY ITERATIONS

Color coded filters + chips

Card layout

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
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
Macbook air.png

UX/UI CHANGES

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

VISUAL / PRODUCT DESIGNER

bottom of page