Personal Website
Conversational Design Library
Creating a comprehensive, centralized library for conversational components at ServiceNow
Overview
ServiceNow is a leading cloud-computing platform that helps companies to streamline workflows and optimize enterprise operations. As a designer on the Conversational AI team, I deepened my knowledge in conversational products like Virtual Agent, Sidebar, and Agent Chat. These conversational products aim to deliver seamless experiences for agents, employees, and customers.
​
My role was to design a unified conversational library, serving as a single source of truth across multiple business units to ensure consistency and efficiency.
​
​
​
​
​
ROLE & RESPONSIBILITIES
Product Designer
UX Design, User Research
​
Methods and Tools: Figma, Miro, Zoom
​
May 2023 - August 2023
Defining the Problem
Users are not as productive when they must message other designers to locate the latest Figma file, often wasting valuable time sifting through outdated files in search of the most accurate version. This fragmented process not only delays work but also increases the risk of miscommunication and errors. Having a design library dedicated to conversational components eliminates miscommunications, enabling faster access to accurate information and streamlining workflows for maximum efficiency.
This screenshot showcases the old library, where components were scattered and lacked clarity on whether they reflected the latest designs. The library was also incomplete, failing to represent the full scope of ServiceNow's Conversational Products.
Understanding our users
I scheduled meetings with stakeholders to understand their frustrations in finding conversational components and to gather their input on what they hoped to see in the new library. During these meetings, they also expressed a strong desire to see how these components are used within the product. Their feedback was valuable and I wanted to make sure I address it in the new library.
​
Below are some direct quotes from stakeholders to further understand their pain points.
"Whenever a stakeholder asks for the latest updates, it's stressful trying to find the right file to share because I don't want them to see my unfinished or messy work."
​
- Designer A (cannot disclose name)
"It's frustrating when miscommunications happen because we're not all working from the most up-to-date designs. A centralized library would help ensure everyone is on the same page."
​
-Designer B (cannot disclose name)
Transforming insights into Design
After identifying users' pain points and frustrations, I began gathering feedback to uncover opportunities for improving the new library. In meetings with product managers, engineers, and designers, I located the most recent instance of conversational components to test and analyze their behavior. I also discovered that many components were outdated, still using the old brand colors, which emphasized the need for updates to reflect the current design standards. Lastly, I collaborated with designers to identify the most frequently used components, so I can prioritize them in the new library.
​
These pain points served as inspiration for crating thie following HMW statement.
"How might we create a centralized design library that streamlines collaboration, reduces inefficiencies, and ensures consistency across all conversational components?"
Challenges
1. Scattered Components
Conversational components were spread across various Figma files, making it difficult to locate and consolidate​​​
2. Outdated Designs
Many existing components were not aligned with the latest branding guidelines. The screenshot in the bottom right illustrates the correct brand colors.
3. Limited Time and Resources
With no dedicated team for this project, balancing designing a new library with ongoing responsibilities required careful prioritization and time management
Creating the library
After understanding the scope, I created a comprehensive design library that included detail descriptions of each component, practical use cases, and guidelines for usage, making it a reliable resource. I also followed ServiceNow's Design System Guidelines closely to ensure the library aligns with company standards.
​
​
Seeing results
The library was approved for internal and external use, enabling customers to explore conversational components, customize their chatbots, and better understand the system's functionality.
​
After publications, I received so many positive feedback on how it simplified their workflows. Users highlighted how it saved time by providing a centralized resource for all conversational components. Many also shared how it has overall improved their efficiency and collaboration.
2000+
views
900+
uses
40+
saves
Reflection & Key Takeaways
1. Value of clear documentation
Detailed component descriptions and practical use cases made the library intuitive and accessible, improving the overall user experience
​
2. Collaborate and ask for feedback early
It's important to seek feedback early in design stage to ensure alignment and address potential challenges or constraints