Menu

AI Tutor

AI-powered tutor enhancing Lululemon onboarding with interactive modules, situational quizzes, and feedback to build sales associates' product expertise.

Type of Project:

Type of Project:

Sponsored Informatics Capstone project by Lululemon Athletica

Sponsored Informatics Capstone project by Lululemon Athletica

Role:

Role:

UX/UI Designer and Researcher

UX/UI Designer and Researcher

Team:

Team:

2 UI/UX Designer, 1 Data scientists, 1 Front-End/Back-End Developer, and 1 Project Manager

2 UI/UX Designer, 1 Data scientists, 1 Front-End/Back-End Developer, and 1 Project Manager

Date

Date

10/30/2024 - Present

10/30/2024 - Present

I served as a UI/UX Designer responsible for designing the mobile user interface, from low-fidelity to high-fidelity prototypes, managing quantitative research, and conducting user testing.

Lululemon AI Tutor is a mobile platform to improve onboarding and learning progress for Lululemon Educators. It aims to personalized learning through modules that breaks down specific product information and training materials, ensure educators can master vast range of product information.

100%

Improved Learning Module Engagement

Improved Learning Module Engagement

100%

Increased in Store Product Knowledge Retention

Problem Context

With lululemon's rapid expansion, now encompassing over 665 stores globally, leading to a diverse and extensive of products, educators face the challenge of effectively absorbing and retaining detailed product knowledge. The traditional, varied training approaches struggle to meet the individual learning needs and preferences of each educator, which is crucial for delivering the personalized customer experiences that lululemon values.

How Might We Statement

How might lululemon Educators achieve increased retention of product knowledge so that they can provide more educated and personalized recommendations to guests?

Proposed Solution

The AI Tutor is designed for Lululemon associates, providing personalized learning modules that simplify complex product information. This solution goes beyond basic training by offering real-time support through an AI chatbot quiz, enabling associates to enhance their product knowledge by getting answers and guidance on specific queries, ensuring they can provide accurate recommendations to customers.

The African Esophageal Cancer Consortium (AfrECC) website is designed to provide a deeper understanding of esophageal cancer, offer accessible resources for early detection and treatment, and encourage donations to support AfrECC's missions. The website serves as an educational hub, connecting patients with vital healthcare resources, offering information about risk factors and preventive measures, and highlighting AfrECC's mission to improve cancer care and palliative support in Africa.

Qualitative and Quantitative Interviews

Research Purpose
To understand the current customer service training experience, identify the most helpful aspects, and explore desired changes. Additionally, to gather insights on the application of training information, feedback preferences, and the integration of AI into the onboarding process, specifically for developing an AI-powered chatbot.

7 Respondents
A survey was conducted with 7 individuals to evaluate their customer service training experience, focusing on helpful aspects and areas for improvement.

6 Interviewees
Interviews were held with 6 individuals to understand how training information is utilized in their work, their feedback preferences, and their thoughts on incorporating AI into the onboarding process.

Survey and Interview insights

Insights gained from user surveys and interviews helped define the scope and design of the AI Tutor:

  • Preference for Interactive Learning: Participants favor hands-on training over video content, indicating that they might find interactive modules more engaging and easier to remember

  • Desire for Instant Support: Many expressed enthusiasm for an AI chatbot, highlighting its potential for providing immediate answers to their questions

  • Need for Personalized Training: Users want training that adapts to their individual needs, making the learning experience more engaging

  • High Comfort with Technology: The majority of participants are comfortable using technology in their training, suggesting a readiness to adopt digital tools like the AI Tutor

Market Research Insights

AI can enhance training systems by providing personalized and updated content and feedback

  • Quizlet's Q-Chat: Enhances study efficiency through adaptive learning

  • Microsoft’s AI Tutor: Tailors lessons with a focus on privacy

  • Walmart’s "Ask Sam": Streamlines information retrieval for associates

Guiding Our Development: Insights inspire the creation of an AI Tutor for lululemon, leveraging generative AI to improve training efficiency, enhance store retention, and drive increased revenue.

Brainstorming

Brainstorming

Current Training System

Current Training System

  • 🔄 Employees struggle to retain training content unless it's frequently used

  • 🔄 Employees struggle to retain training content unless it's frequently used

  • 😐 Training feels less engaging without personalized features

  • 😐 Training feels less engaging without personalized features

  • 🤖🚫 Limited AI integration in onboarding and training

  • 🤖🚫 Limited AI integration in onboarding and training

  • ⏳ Training system is slow to provide quick answers

  • ⏳ Training system is slow to provide quick answers

Our New Training System

Our New Training System

  • 📊 Our Learning Progress Page tracks module completion and time spent, helping you stay on top of key content

  • 📊 Our Learning Progress Page tracks module completion and time spent, helping you stay on top of key content

  • 📑 Our Lesson Plan Page customizes content based on employee product knowledge for a personalized experience

  • 📑 Our Lesson Plan Page customizes content based on employee product knowledge for a personalized experience

  • 🤖 Our AI Chatbot serves as a virtual assistant, answering product questions

  • 🤖 Our AI Chatbot serves as a virtual assistant, answering product questions

  • 🧠 Our AI Scenario Quiz reinforces knowledge and prompts Educators to recommend and explain products, making learning faster and more interactive

  • 🧠 Our AI Scenario Quiz reinforces knowledge and prompts Educators to recommend and explain products, making learning faster and more interactive

User Research

By analyzing data from user surveys and interviews, our team identified two main user groups for the AI Tutor: newly hired Educators starting their careers as sales associates and experienced Store Managers overseeing team performance. These personas served as data-driven representations of our audience, guiding the design to address their unique needs and challenges.

Wireframes

At this stage, after brainstorming features based on user research, we envision an onboarding app that follows the Lululemon mobile app user interface.

We will need employee login pages and a home page for users to get started. This will be followed by a profile page, an AI-driven scenario quiz and results page, an AI chatbot page, and a lesson plan page.

From wireframes to a low-fidelity prototype

To prepare for our first round of usability testing, our team created a low-fidelity prototype of AI Tutor. The goal of this testing was to gather feedback on how users interact with the functionality and user experience of the mobile prototype. We aimed to identify areas of confusion, missing features, and opportunities for improvement based on user feedback and expectations.

Low-fidelity Usability Testing

Our team conducted a total of 4 low-fidelity usability tests with 2 Lululemon Educators, 1 Project Manager, 1 team member from Store Support Centre (SSC).

Although feedback was gathered from various pages of the AI Tutor app, the "Modules", "Progress", and "Scenario Quiz" pages received specific input that we focused on addressing in the next design iteration.

Users were confused about module content and how to locate specific modules

Users were confused about module content and how to locate specific modules

  • Our updated design includes concise descriptions, pictures, and videos for each module. Users can now search and filter modules with the new search button

  • Our updated design includes concise descriptions, pictures, and videos for each module. Users can now search and filter modules with the new search button

Users were unsure if the statistics on the Learning Progress Page reflected module progress or quiz/scenario results. The Learning Progress Overview needed clearer identification

Users were unsure if the statistics on the Learning Progress Page reflected module progress or quiz/scenario results. The Learning Progress Overview needed clearer identification

  • Our updated design shows each module's completion stats, helping users track progress, along with a summary of completed and remaining modules

  • I also added mini module quizzes for random check-ins, addressing the store manager's request to reinforce conceptual understanding

  • Our updated design shows each module's completion stats, helping users track progress, along with a summary of completed and remaining modules

  • I also added mini module quizzes for random check-ins, addressing the store manager's request to reinforce conceptual understanding

High-fidelity Usability Testing

After low-fidelity testing, we made several adjustments to the wireframes and consulted our development team to determine the feasibility of those features.

We chose to use AI for generating scenario questions post-module to provide personalized learning experiences that adapt to users' progress and knowledge gaps, enhancing interactivity and effectiveness.

We combined the lesson plan and modules pages due to their repetitive content and opted for a bottom navigation bar, as side bars typically obscure content. We finalized 10 high-fidelity wireframes, which include:

We conducted four user tests with the same participants from the low-fidelity testing phase and gathered feedback on potential areas for improvement.

What they like:

What they like:

  • Landing page: Displays all key information at a glance

  • User interface: Simple and intuitive

  • Style guide: Consistent with Lululemon’s branding

  • Learning progress page: Allows users to view and track progress effectively

What we are missing

What we are missing

  • AI Chatbot and AI Scenario Quiz: Clearly distinguish the AI Chatbot from the AI Scenario Quiz, emphasizing their unique functionalities

  • Modules Page: Incorporate more pictures and videos to make the modules page visually engaging and informative

  • Quiz Results Page: Ensure that quiz results only suggest revisiting the current module, avoiding unnecessary repetition of modules

  • AI Scenario Quiz: Identify and address reasons why educators answer incorrectly

  • Feature Highlights: Highlight each feature of the app, making their purposes and benefits stand out

  • Community Emphasis: Emphasize community aspects, aligning with Lululemon's ethos and brand values

Continuing to Iterate to the Final Designs

After receiving valuable input from low-fi and high-fi usability testing sessions, we made adjustments to better meet the needs and preferences of our users

Pre-landing pages

Users were unsure where to start and how to navigate the different features of the app, so I added pre-landing pages to guide them through the features and provide clear direction on where to start with the modules

Before

Before

After

After

Inside each module page: Added more images and videos

Educators noted that the module page was too text-heavy and suggested including more images and videos. Therefore, I added more pictures relevant to the module content and a video

Before

Before

After

After

Kudos page: Introduced a Kudos system to strengthen the Lululemon community

Educators mentioned that Lululemon's work culture is very community-oriented, so I added a Kudos system page where educators can give kudos to each other after completing a module

Educators can use this search feature to look up specific educators and check their achievements.

Educators can give kudos to other educators by using these emojis to react

Distinguishing AI Chatbot from AI Scenario Quiz

Educators confused the AI Chatbot with the AI Scenario Quiz, thinking they were identical. To clarify, I added a floating chatbot icon on most app pages, similar to other commercial platforms. The AI Scenario Quiz, however, is only accessible after completing each module, as indicated at the bottom of Module 3

Before

Before

After

After

AI Scenario Quiz is only accessible to educators after they have completed a module and is located within each module page

AI Scenario Quiz: Improvements and Enhancements

Educators were unclear about what determines passing or failing the AI Scenario Quiz and wanted to know their mistakes. To address this, I included specific feedback on topics to revisit within that module. Based on feedback, the AI Scenario Quiz results now only recommend revisiting the current module, not others

Before

Before

After

After

Reflection

What I learned

Throughout this project, I have dedicated significant effort and gained valuable insights, notably by leading as the sole UI/UX designer. I was in charge of user testing and finalizing the prototypes based on feedback from users and team members.

User feedback is crucial for user-centric design: It's important to gather feedback from the main users, in this case, the Educators who will actually use the product. Understanding what they like about the current features and designing additional features based on their feedback is essential for creating an effective and engaging app.

Working cohesively with the development and data science teams: Collaborating closely with these teams throughout the project is vital as they provide feedback on the feasibility of implementing features within our tight timeline and offer suggestions for adjustments to make the development process smoother