Content design system

My journey of creating a content design system from scratch at Hubstream

─────────⊳⋆⊲─────────

Context

I recognized the need to tackle inconsistency and quality issues with UX content and improve user experience. So, I spearheaded the creation of a robust content design system tailored to meet these challenges.

Process

Formation of the team: I brought together a diverse group including Product Managers, UX Designers, and Developers. By blending data analysis with user feedback, I crafted a content design system specifically for our investigative software's needs.

Step 1: Defining scope and outcomes

I conducted initial stakeholder meetings to identify key objectives and define the system's scope, ensuring alignment with business goals and user needs.

Outcomes we aimed for:

Improved user engagement — more interaction and satisfaction.
Consistent content presentation — a unified interface experience.
Streamlined content management — easier updates and maintenance.

Step 2: Auditing existing content

I conducted a thorough audit of all existing content, identifying outdated documents, tone inconsistencies, and accessibility issues. This helped pinpoint areas ripe for improvement.

Number of outdated content assets: 353

Step 3: Developing a UX content strategy

I developed a strategy aligning content with user personas and wove a cohesive narrative through the user journey. I presented it to the stakeholders in a detailed content strategy guide. I incorporated stakeholder inputs to further refine the strategy.

I also set up a content governance model that ensured the content was always in-check. I invited key stakeholders to be members on the board.

If you'd like to know more about the governance model, read the case study on establishing content governance for Hubstream.

Step 4: Creating content models and templates

I developed content models to define the structure and format for standard content types.

Templatizing UX content: I also created templates for common elements like alerts, tooltips, error messages, and help articles.

Step 5: Defining content guidelines

I did some desk-research, consulted with content design experts and brainstormed with the team. I created draft guidelines to maintain quality and uniformity. The guidelines covered aspects such as language, writing style, tone of voice, readability, accessibility, and SEO.

Step 6: Preparing a taxonomy and metadata strategy

I developed and implemented a detailed taxonomy to organize content logically.

Then, I developed metadata strategies for improving the searchability and management of UX content.

Step 7: Integrate with UI/UX design

In close collaboration with UI/UX teams, I ensured content was seamlessly integrated into the design system. With a focus on improving user interaction and visual clarity, I gave inputs related to the typography, colour contrast, information architecture, etc.

Step 8: Implementation with technology

I used Figma and ditto for efficient content management. For help guides, I selected a CMS and automation tools for regular updates.

Step 9: Train and roll-out

I, in collaboration with UX and PM teams, held training sessions to acquaint the team with the new system. My focus was on teaching the best practices and demonstrating the best ways to use the content system and tools effectively.

Step 10: Monitor and optimize

I set up ongoing monitoring to track effectiveness and incorporated regular feedback for continuous improvement.

Impact

The implementation of this content design system has significantly improved the quality and consistency of content across Hubstream, leading to better user satisfaction and operational efficiencies. This initiative has set a new standard for how content is managed and presented in our software.