Laxis is a an AI startup founded in March 2020. The product is a smart AI meeting assistant to help sales, UX researchers, and marketing experts in business organizations to generate & manage conversation insights effectively.
Team CEO, Dev Team, Product Designer, Marketing Team
My Role Design System, UX/UI Design, User Research, User Testing, Wireframe, Prototype
Tool Figma, Zeplin, Adobe Creative Suite
Timeline October 2020 - Jun 2021
Overview
I joined Laxis as the company's first and only designer, leading the product design process end-to-end from concept to launch. I built the company's initial design system from the ground up, creating reusable components that accelerated development and significantly improved user experience. I designed responsive solutions for web, iPad, and a Chrome extension, enabling successful launches on Zoom, Google Meet, and Product Hunt in 2021. Additionally, I supported marketing materials by designing presentation slides for investor pitches. During my time at Laxis, the team secured two rounds of funding, ultimately raising a $1.5 million seed round by October 2023.
Kick-Off
When I first joined, my initial task was to improve the UI on the main product pages. After auditing the existing product, however, I discovered that the primary issues weren't just visual—the real challenges were the confusing user experience across key features, inconsistent UI components, and inefficiencies in how the development team was building these components. To address these core issues, I proposed creating a design system and improving the overall user experience—an initiative that I presented to the CEO.
Based on a set of user testings and initial product investigation, here are the main problems I fount out:
Unclear features. Users didn’t know how to use the key features to get meeting insights. UI was not friendly to use. The key features didn’t convey clearly the value proposition.
UI Inconsistency. All pages were not visually consistent. The same component was presented differently on different pages, confusing users while interacting with the product.
Low development efficiency. There was no single source for developers to choose from — and neither do designers. There's no standard reference. Everyone referred to each other, which caused a lot of confusion, such as inconsistencies.
I developed the design system style guide based on the company's branding and conducted an audit of repetitive components across different sections and pages. This allowed me to create shared components with consistent visual patterns and interactions, improving both efficiency and coherence. Throughout the process, I drew inspiration from Material UI and Adobe Spectrum design systems to ensure best practices in usability and scalability.
For the Laxis product, tags play a crucial role across all main features. I designed a color template for tags that supports both black and white text while ensuring all color combinations meet accessibility standards.
Problem
Memo template is a key feature that helps users to build groups of key words to categorize their transcripts. There are 3 types of groups: Template, Topic and Keyword. I have tested this feature with 3 users on original website, all of them were confused about how to uses the groups. It was difficult to find what are the differences between the groups and how they were related to each other.
Ideation
In order to understand how each group works and relates to each other, I discussed with CEO and dev team to figure out the logic behind the names(keyword, topic and meeting type), the purpose&functionality of each, and the larger goal of the whole page. Here are the results:
Memo Template page goal
Before beginning the meeting transcription process, users complete this initial step to set up meeting groups, customize categories, and organize transcripts efficiently.
Meeting Type
Meeting Type is the highest-level category, allowing users to organize meeting transcripts based on conversation themes (e.g., Marketing, UX Research, Development).
Topic
Topics are subcategories within a Meeting Type. During transcription, users can highlight sentences and assign them a title as a "Topic." Topics can be reused across different transcripts to maintain consistency.
Keyword
Keywords are the smallest elements within a Topic and are frequently used for transcript analysis. If users want to track the frequency of a specific word in their transcripts, they can add it under the "Keyword" feature within a Topic. In the Insights feature, the system will then calculate occurrences and display sentences containing the keyword for deeper analysis.
Final Design
After defining the hierarchy of Meeting Type, Topic, and Keyword, I designed the design system’s tag patterns, color templates, and component-based labels and frames.
Since Meeting Type is the highest-level category and appears only once in a transcript, I used the brand color to differentiate it. This ensures a strong visual anchor while maintaining a balanced UI, preventing excessive repetition of branding elements that could overwhelm users.
For Topic and Keyword tags, I introduced filled and outlined styles to visually distinguish their hierarchy. This approach enhances clarity by making it easy to differentiate broader topics from more granular keywords at a glance.
This is my redesign of the Memo Template page. I structured the left section (Meeting Types) as a navigation panel that controls the right section, which displays Topics and Keywords dynamically.
In the right section, the system automatically generates distinct colors for Topic tags. Each Topic tag has an associated gallery containing Keyword tags that share the same color, visually reinforcing their relevance and relationship within the hierarchy.
User Testing Result:
After testing, users found out creating elements in Memo template is clear and linear, and the colors on tags made them easier to understand which keywords combination belongs to which topic.
Features Overview
If you are interested in Laxis project, email me and let's chat about cases and details!