Transforming Trainual into an AI-Driven Product Experience
Industry
SAAS, LMS
Client
Trainual, Inc
Year
(2026)
Role
UX / Product Design lead
Product design lead
Year
(2026)
Transforming Trainual into an AI-Driven Product Experience
01
Trainual set out to evolve from a structured knowledge platform into an AI-powered product experience. The goal was to embed a fully integrated AI assistant directly into the application, enabling content creation, editing, search, and contextual guidance. We faced several constraints: (1) A compressed timeline driven by competitive market pressure (2) The need to layer AI onto an existing non-AI-native system (3) Ongoing LLM experimentation while defining UX patterns (4) Maintaining user trust while introducing generative capabilities The challenge was not simply adding chat. It was embedding intelligence into established workflows in a way that felt native, scalable, and trustworthy. As Lead Product Designer, I led the UX strategy, defined the interaction architecture, and established the foundational AI system layer. I partnered closely with engineering and product to shape model behavior, define guardrails, and ensure the assistant felt cohesive within the existing ecosystem. I also leveraged AI-assisted design workflows to dramatically accelerate ideation, prototyping, and iteration speed without sacrificing system integrity.
Trainual set out to evolve from a structured knowledge platform into an AI-powered product experience. The goal was to embed a fully integrated AI assistant directly into the application, enabling content creation, editing, search, and contextual guidance. We faced several constraints: (1) A compressed timeline driven by competitive market pressure (2) The need to layer AI onto an existing non-AI-native system (3) Ongoing LLM experimentation while defining UX patterns (4) Maintaining user trust while introducing generative capabilities The challenge was not simply adding chat. It was embedding intelligence into established workflows in a way that felt native, scalable, and trustworthy. As Lead Product Designer, I led the UX strategy, defined the interaction architecture, and established the foundational AI system layer. I partnered closely with engineering and product to shape model behavior, define guardrails, and ensure the assistant felt cohesive within the existing ecosystem. I also leveraged AI-assisted design workflows to dramatically accelerate ideation, prototyping, and iteration speed without sacrificing system integrity.
Trainual set out to evolve from a structured knowledge platform into an AI-powered product experience. The goal was to embed a fully integrated AI assistant directly into the application, enabling content creation, editing, search, and contextual guidance. We faced several constraints: (1) A compressed timeline driven by competitive market pressure (2) The need to layer AI onto an existing non-AI-native system (3) Ongoing LLM experimentation while defining UX patterns (4) Maintaining user trust while introducing generative capabilities The challenge was not simply adding chat. It was embedding intelligence into established workflows in a way that felt native, scalable, and trustworthy. As Lead Product Designer, I led the UX strategy, defined the interaction architecture, and established the foundational AI system layer. I partnered closely with engineering and product to shape model behavior, define guardrails, and ensure the assistant felt cohesive within the existing ecosystem. I also leveraged AI-assisted design workflows to dramatically accelerate ideation, prototyping, and iteration speed without sacrificing system integrity.
Approach
02
I structured the initiative around three principles: (1)Defined interaction models for AI within existing workflows (2) Built a dedicated AI component library and visual language (3) Created modular UI patterns for chat, inline editing, prompt states, and generation states (4) Designed confidence and trust indicators to support adoption
I structured the initiative around three principles: (1)Defined interaction models for AI within existing workflows (2) Built a dedicated AI component library and visual language (3) Created modular UI patterns for chat, inline editing, prompt states, and generation states (4) Designed confidence and trust indicators to support adoption
I structured the initiative around three principles: (1)Defined interaction models for AI within existing workflows (2) Built a dedicated AI component library and visual language (3) Created modular UI patterns for chat, inline editing, prompt states, and generation states (4) Designed confidence and trust indicators to support adoption
Process
Process
03
I began by building a dedicated AI component library and visual language that aligned with our existing design system. This included modular UI patterns for chat, inline editing, generation states, and trust indicators. To accelerate iteration, I leveraged both traditional workflows and AI-assisted tooling, including Figma Make and Replit, and connected the Figma MCP to our component library to maintain design-to-code alignment. We tested multiple LLM configurations, refined system prompts, and adjusted UX flows based on real customer usage. The most complex challenge was embedding AI into legacy workflows without disrupting familiarity. We integrated intelligence into existing surfaces rather than forcing new interaction paradigms.
I began by building a dedicated AI component library and visual language that aligned with our existing design system. This included modular UI patterns for chat, inline editing, generation states, and trust indicators. To accelerate iteration, I leveraged both traditional workflows and AI-assisted tooling, including Figma Make and Replit, and connected the Figma MCP to our component library to maintain design-to-code alignment. We tested multiple LLM configurations, refined system prompts, and adjusted UX flows based on real customer usage. The most complex challenge was embedding AI into legacy workflows without disrupting familiarity. We integrated intelligence into existing surfaces rather than forcing new interaction paradigms.
I began by building a dedicated AI component library and visual language that aligned with our existing design system. This included modular UI patterns for chat, inline editing, generation states, and trust indicators. To accelerate iteration, I leveraged both traditional workflows and AI-assisted tooling, including Figma Make and Replit, and connected the Figma MCP to our component library to maintain design-to-code alignment. We tested multiple LLM configurations, refined system prompts, and adjusted UX flows based on real customer usage. The most complex challenge was embedding AI into legacy workflows without disrupting familiarity. We integrated intelligence into existing surfaces rather than forcing new interaction paradigms.
Results
04
(1) 15 percent conversion rate on AI-assisted content creation (2) Increased ARR tied directly to AI adoption (3) Improved customer retention (4) Record profitability during the AI shift The system now serves as a foundation for proactive AI, including anticipatory suggestions and page-level conversational intelligence.
(1) 15 percent conversion rate on AI-assisted content creation (2) Increased ARR tied directly to AI adoption (3) Improved customer retention (4) Record profitability during the AI shift The system now serves as a foundation for proactive AI, including anticipatory suggestions and page-level conversational intelligence.
(1) 15 percent conversion rate on AI-assisted content creation (2) Increased ARR tied directly to AI adoption (3) Improved customer retention (4) Record profitability during the AI shift The system now serves as a foundation for proactive AI, including anticipatory suggestions and page-level conversational intelligence.