▼ // PRODUCT DESIGN
Google Developer Groups: Vancouver
Google Developer Groups: Vancouver
A community and event website for people interested in tech.



PROJECT CONTEXT
PROJECT CONTEXT
I always assumed Twitch's Stream Schedule was lacking…
I worked with a team of UX Designers, developers, and stakeholders to design a new website for GDG: Vancouver's website.
Client
Client
Google Developer Groups:
Vancouver
Google Developer Groups:
Vancouver
Team & Role
Team & Role
3 UX Designers
2 Developers
3 UX Designers
2 Developers
Timeline
Timeline
March 24' (2 Weeks)
March 24' (2 Weeks)
▼ ABOUT THE PRODUCT ▼
Welcome to…
Google Developer Groups: Vancouver
Google Developer Groups: Vancouver
Showcasing events and building a community for people who love tech.
Rise through the Ranks
Rise through the Ranks
Tangible results to help you across shooters.
Tangible results to help you across shooters.


▼ // PROBLEM DEFINING //
The old website didn't leave a good impression…
The old website didn't leave a good impression…
Accessibility, readability and spacing problems left a lot to be desired. My team was brought onboard by stakeholders to create a new website from scratch.
MY TASKS
Here's what we did
Here's what we did
Conceptualize the website.
Conceptualize the website.
Create a styling guide.
Create a styling guide.
Design a new responsive website.
Design a new responsive website.
Handoff the design to be developed.
Handoff the design to be developed.

▼ // PROBLEM EXPLORATION // PHASE 02
Building a Better Schedule
Building a Better Schedule
I conducted remote interviews with six users who previously used the stream schedule.
Goals of Research
How users navigate to the stream schedule.
How users navigate to the stream schedule.
What are the major frustrations when using the schedule.
What are the major frustrations when using the schedule.
Identify the user needs and wants for a stream schedule.
Identify the user needs and wants for a stream schedule.



Interview Screensharing Purpose
Interview Screensharing Purpose
Screensharing allowed for in-depth user pain point identification and analysis.
Screensharing allowed for in-depth user pain point identification and analysis.
INTERVIEWEE PAINPOINTS
INTERVIEWEE PAINPOINTS
I uncovered the three most common frustrations that users face.
I uncovered the three most common frustrations that users face.
Poor Findability
Users must navigate through several screens and links before arriving to the stream schedule page.
Poor Findability
Users must navigate through several screens and links before arriving to the stream schedule page.
Poor Findability
Users must navigate through several screens and links before arriving to the stream schedule page.
Poor Findability
Users must navigate through several screens and links before arriving to the stream schedule page.
Failure to Meet User Needs
A schedule for one channel only fails to meet the demands of the interviewees. They NEED to be able to see their Followed Channels list at once.
Failure to Meet User Needs
A schedule for one channel only fails to meet the demands of the interviewees. They NEED to be able to see their Followed Channels list at once.
Failure to Meet User Needs
A schedule for one channel only fails to meet the demands of the interviewees. They NEED to be able to see their Followed Channels list at once.
Failure to Meet User Needs
A schedule for one channel only fails to meet the demands of the interviewees. They NEED to be able to see their Followed Channels list at once.
Filtering Uneccessary Data
Frustration stems from uneccessary data such as "Views" and "View Count" as users must filter this information out when reading the timetable.
Filtering Uneccessary Data
Frustration stems from uneccessary data such as "Views" and "View Count" as users must filter this information out when reading the timetable.
Filtering Uneccessary Data
Frustration stems from uneccessary data such as "Views" and "View Count" as users must filter this information out when reading the timetable.
Filtering Uneccessary Data
Frustration stems from uneccessary data such as "Views" and "View Count" as users must filter this information out when reading the timetable.

▼ // RESEARCH // PHASE 01
Research H1.5
Research H1.5
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate












Research H2
Research H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Header H2
Header H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate



Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Header H2
Header H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Header H3
Header H3
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Research H2
Research H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
For Quotes or Summaries
Header H2
Header H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Header H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Header + List H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Cons - H3
Poor findability.
Poor findability.
Features one channel only.
Features one channel only.
Misaligned mental model of a timetable.
Misaligned mental model of a timetable.
Cluttered with information not related to a stream schedule.
Cluttered with information not related to a stream schedule.
Pros- H3
Poor findability.
Poor findability.
Features one channel only.
Features one channel only.
Misaligned mental model of a timetable.
Misaligned mental model of a timetable.
Cluttered with information not related to a stream schedule.
Cluttered with information not related to a stream schedule.
Cons - H3
Poor findability.
Poor findability.
Features one channel only.
Features one channel only.
Misaligned mental model of a timetable.
Misaligned mental model of a timetable.
Cluttered with information not related to a stream schedule.
Cluttered with information not related to a stream schedule.
Pros- H3
Poor findability.
Poor findability.
Features one channel only.
Features one channel only.
Misaligned mental model of a timetable.
Misaligned mental model of a timetable.
Cluttered with information not related to a stream schedule.
Cluttered with information not related to a stream schedule.
List H3
This is an example text.
This is an example text.
This is an example text.
This is an example text.
This is an example text.
This is an example text.
This is an example text.
This is an example text.
Research H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate
Research H2
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate

FIA
WORKS
Thank you for visiting!
Let's work together!
© 2024 Fia - Inspired by JRPG Video Games
This portfolio was designed and built by Fia.
FIA
WORKS
Thank you for visiting!
Let's work together!
© 2024 Fia - Inspired by JRPG Video Games
This portfolio was designed and built by Fia.
FIA
WORKS
Thank you for visiting!
Let's work together!
© 2024 Fia - Inspired by JRPG Video Games
This portfolio was designed and built by Fia.
FIA
WORKS
Thank you for visiting!
Let's work together!
© 2024 Fia - Inspired by JRPG Video Games
This portfolio was designed and built by Fia.