[Case 02]
50% Increase in Sign-Ups
Design System Documentation Site
50% Increase in Sign-Ups
Empowering teams to scale with a unified source of truth.
[Project Overview]
The Muse Reference Site serves as the centralized hub for our design system, providing patterns, templates, guidelines, and documentation resources. It supports various user archetypes in creating and publishing digital experiences for Cisco.com. I led the end-to-end design as part of Cisco's Global Marketing reimagined initiative to expand the design system and provide an accessible platform for our internal team and vendors.
[Team]
Studio Design Team, Lead Developer, Product Mangers, Accenture UI/ Visual, Business SMEs, Stakeholders.
[Category]
Design System Documentation Site
[My Role]
Lead UX Designer
[Platform]
Responsive Design
[Timeline]
April 2021 - October 2022
[Problem]
A Barrier to Efficiency, Accuracy, and Engagement
The existing hub (image below) didn't align with the current design system that made it a problem for users to conduct their daily work.
[Goal]
Trust the site has up-to-date information.
Access the correct visual assets.
Quickly and efficiently create pages to publish on Cisco.com.
[Frustrations]
Resoruces and documentation are too fragmented.
Specs weren't aligned with current requirements.
The outdated hub lacked guidance on when and how to use components and patterns
[Process]
[01] User Research
Conducted user interviews to understand their pain points and needs.
Synthesized data to define user personas and prioritize MVP features.
Conducted competitive benchmarking to identify best practices for documentation sites.
[01] User Research
Conducted user interviews to understand their pain points and needs.
Synthesized data to define user personas and prioritize MVP features.
Conducted competitive benchmarking to identify best practices for documentation sites.
[02] Insights
Users want visuals and live examples on the site.
Users value prescriptive authoring templates and resources.
Guidelines on how components and patterns function, with clarity on what defines good versus poor implementation.
[02] Insights
Users want visuals and live examples on the site.
Users value prescriptive authoring templates and resources.
Guidelines on how components and patterns function, with clarity on what defines good versus poor implementation.
[03 Design Solution]
Conduct workshops with stakholders to prioritize features and user types.
Focus on creating template and pattern pages so that users can publish faster.
Buy-in a front-end platform that fulfills 90% of MVP requiremnts.
[03 Design Solution]
Conduct workshops with stakholders to prioritize features and user types.
Focus on creating template and pattern pages so that users can publish faster.
Buy-in a front-end platform that fulfills 90% of MVP requiremnts.
[04] Testing & Iteration
Conducted card sorting test to identify information architecture.
Facilitated workshops to define real problems, align on users needs and business goals.
Collected feedback through usability testing to refine terminology and streamline content.
[04] Testing & Iteration
Conducted card sorting test to identify information architecture.
Facilitated workshops to define real problems, align on users needs and business goals.
Collected feedback through usability testing to refine terminology and streamline content.
[Outcome]
93% increase in unique vistiors to the site.
50% increase in user sign-ups.
Created 6 templates and 18 pattern pages on the site for users.
[Key Learnings]
It takes a village
Consistent collaboration across teams ensured advocacy, consistency, and real world usage.
It takes a village
Consistent collaboration across teams ensured advocacy, consistency, and real world usage.
Test often
Iterative testing ensured quality control and that the site resonated with users.
Test often
Iterative testing ensured quality control and that the site resonated with users.
Structure and content strategy matters
Defining information achitecture and content hierarchy helped eliminate redundancies.
Structure and content strategy matters
Defining information achitecture and content hierarchy helped eliminate redundancies.
[Case 02]
50% Increase in Sign-Ups
Design System Documentation Site
50% Increase in Sign-Ups
Empowering teams to scale with a unified source of truth.
[Project Overview]
The Muse Reference Site serves as the centralized hub for our design system, providing patterns, templates, guidelines, and documentation resources. It supports various user archetypes in creating and publishing digital experiences for Cisco.com. I led the end-to-end design as part of Cisco's Global Marketing reimagined initiative to expand the design system and provide an accessible platform for our internal team and vendors.
[Team]
Studio Design Team, Lead Developer, Product Mangers, Accenture UI/ Visual, Business SMEs, Stakeholders.
[Category]
Design System Documentation Site
[My Role]
Lead UX Designer
[Platform]
Responsive Design
[Timeline]
April 2021 - October 2022
[Problem]
A Barrier to Efficiency, Accuracy, and Engagement
The existing hub (image below) didn't align with the current design system that made it a problem for users to conduct their daily work.
[Goal]
Trust the site has up-to-date information.
Access the correct visual assets.
Quickly and efficiently create pages to publish on Cisco.com.
[Frustrations]
Resoruces and documentation are too fragmented.
Specs weren't aligned with current requirements.
The outdated hub lacked guidance on when and how to use components and patterns
[Process]
[01] User Research
Conducted user interviews to understand their pain points and needs.
Synthesized data to define user personas and prioritize MVP features.
Conducted competitive benchmarking to identify best practices for documentation sites.
[02] Insights
Users want visuals and live examples on the site.
Users value prescriptive authoring templates and resources.
Guidelines on how components and patterns function, with clarity on what defines good versus poor implementation.
[03 Design Solution]
Conduct workshops with stakholders to prioritize features and user types.
Focus on creating template and pattern pages so that users can publish faster.
Buy-in a front-end platform that fulfills 90% of MVP requiremnts.
[04] Testing & Iteration
Conducted card sorting test to identify information architecture.
Facilitated workshops to define real problems, align on users needs and business goals.
Collected feedback through usability testing to refine terminology and streamline content.
[Outcome]
93% increase in unique vistiors to the site.
50% increase in user sign-ups.
Created 6 templates and 18 pattern pages on the site for users.
[Key Learnings]
It takes a village
Consistent collaboration across teams ensured advocacy, consistency, and real world usage.
Test often
Iterative testing ensured quality control and that the site resonated with users.
Structure and content strategy matters
Defining information achitecture and content hierarchy helped eliminate redundancies.
[Case 02]
50% Increase in Sign-Ups
Design System Documentation Site
50% Increase in Sign-Ups
Empowering teams to scale with a unified source of truth.
[Project Overview]
The Muse Reference Site serves as the centralized hub for our design system, providing patterns, templates, guidelines, and documentation resources. It supports various user archetypes in creating and publishing digital experiences for Cisco.com. I led the end-to-end design as part of Cisco's Global Marketing reimagined initiative to expand the design system and provide an accessible platform for our internal team and vendors.
[Team]
Studio Design Team, Lead Developer, Product Mangers, Accenture UI/ Visual, Business SMEs, Stakeholders.
[Category]
Design System Documentation Site
[My Role]
Lead UX Designer
[Platform]
Responsive Design
[Timeline]
April 2021 - October 2022
[Problem]
A Barrier to Efficiency, Accuracy, and Engagement
The existing hub (image below) didn't align with the current design system that made it a problem for users to conduct their daily work.
[Goal]
Trust the site has up-to-date information.
Access the correct visual assets.
Quickly and efficiently create pages to publish on Cisco.com.
[Frustrations]
Resoruces and documentation are too fragmented.
Specs weren't aligned with current requirements.
The outdated hub lacked guidance on when and how to use components and patterns
[Process]
[01] User Research
Conducted user interviews to understand their pain points and needs.
Synthesized data to define user personas and prioritize MVP features.
Conducted competitive benchmarking to identify best practices for documentation sites.
[01] User Research
Conducted user interviews to understand their pain points and needs.
Synthesized data to define user personas and prioritize MVP features.
Conducted competitive benchmarking to identify best practices for documentation sites.
[02] Insights
Users want visuals and live examples on the site.
Users value prescriptive authoring templates and resources.
Guidelines on how components and patterns function, with clarity on what defines good versus poor implementation.
[02] Insights
Users want visuals and live examples on the site.
Users value prescriptive authoring templates and resources.
Guidelines on how components and patterns function, with clarity on what defines good versus poor implementation.
[03 Design Solution]
Conduct workshops with stakholders to prioritize features and user types.
Focus on creating template and pattern pages so that users can publish faster.
Buy-in a front-end platform that fulfills 90% of MVP requiremnts.
[03 Design Solution]
Conduct workshops with stakholders to prioritize features and user types.
Focus on creating template and pattern pages so that users can publish faster.
Buy-in a front-end platform that fulfills 90% of MVP requiremnts.
[04] Testing & Iteration
Conducted card sorting test to identify information architecture.
Facilitated workshops to define real problems, align on users needs and business goals.
Collected feedback through usability testing to refine terminology and streamline content.
[04] Testing & Iteration
Conducted card sorting test to identify information architecture.
Facilitated workshops to define real problems, align on users needs and business goals.
Collected feedback through usability testing to refine terminology and streamline content.
[Outcome]
93% increase in unique vistiors to the site.
50% increase in user sign-ups.
Created 6 templates and 18 pattern pages on the site for users.
[Key Learnings]
It takes a village
Consistent collaboration across teams ensured advocacy, consistency, and real world usage.
It takes a village
Consistent collaboration across teams ensured advocacy, consistency, and real world usage.
Test often
Iterative testing ensured quality control and that the site resonated with users.
Test often
Iterative testing ensured quality control and that the site resonated with users.
Structure and content strategy matters
Defining information achitecture and content hierarchy helped eliminate redundancies.
Structure and content strategy matters
Defining information achitecture and content hierarchy helped eliminate redundancies.