top of page




Project Nature

Client project for XLANG Lab of HKU NLP Group

My Role

UI/UX designer: Ideation, Visual Identity, User Interface, User Testing, User Experience, Prototyping, Delivery




The XLang Agents project is a groundbreaking initiative focused on advancing Executable Language Grounding (XLang) technology, enabling natural language instructions to be converted into executable actions within various real-world environments. Our mission is to refine these agents' interfaces, ensuring that users effortlessly communicate and accomplish tasks via natural language interactions. We'll showcase how our UX design improvements simplify complex actions, prioritize user preferences, and create a satisfying, intuitive experience.

Project Objectives

  1. Streamline User Interaction: Develop XLang Agents for effortless, user-friendly interactions in natural language, simplifying complex digital tasks.

  1. Prioritize User-Centric Design: Center on user needs and preferences to craft satisfying experiences with XLang Agents.

  1. Enhance User Feedback: Build effective feedback systems for ongoing agent improvement, ensuring adaptability and responsiveness.



XLang Agents is an advanced language model-powered assistant designed to seamlessly interpret natural language instructions, enabling users to interact with digital environments and perform complex tasks with ease.

Frame 119.png


design process dyson.png


User Research



We conducted 8 interviews to discover problems that the current chatbots have and understand users’ expectations of chatbots.


User Task

We’ve asked them to use the chatbot to help them when buying a vacuum cleaner and asked the questions below about their experiences.


Research Method

We collected the interview data and organised them through affinity mapping and discovered three major pain points.

Research questions
- How was your experience with the Dyson chatbot?
- What is working well in the current chatbot?
- What is not working well in the current chatbot?
- What are the scenarios when you need a chatbot to help?
- What is your expectations when using a chatbot?
- How do you trust the chatbot?
- What makes you build more trust when using a chatbot?

Screenshot 2022-09-22 at 11.51.31.png
Screenshot 2022-09-22 at 11.52.31.png
Screenshot 2022-09-22 at 12.51.37.png

Screenshots from Zoom interviews and affinity maps

Summerize Pain Points


"I felt like going through a list of prompts

instead of making a conversation."


"The chatbot didn't understand my question and I had to repeat it again to a human advisor."


"I don't mind talking to a chatbot if I can get what I want whenever I can."

- The current chatbot makes users click through a series of prompts instead of having a genuine conversation to build trust.
- Users feel the chatbot did not understand their requests.
- Users find the answers provided by the chatbot are not helpful.

- System defaults to connect you to a human advisor
- Conversation context lost when reaching a human advisor
- Human advisor response time is slow and only offered in office hours

- Users believe that most of their issues can be resolved by well-designed bots.
- Users want easier access to self-serve solutions for customer service around the clock.

- Discover

Competitive Audit

We analyzed 5 chatbots in e-commerce to learn from what others did well and what warrants improvement.



Features & Services

- With the chatbot, the users can browse products, find products within price range, get personalized recommendations

Use of Natural Language Processing

- The chatbot collects customer feedback, provide quick response and uses the user input to improve the services with AI application
- The chatbot can recognize picture and predict based on past data using AI technologies.

Character & Tone

- Gender neutral character
- Friendly and humanized tone
- Users know they’re talking to a chatbot in the first place

Design Progress

Defined Design Vision

How might we deliver an engaging chatbot experience for potential buyers so that they can easily find products that suits their needs and place the order with ease?

- Define


We explored directions and variations, and learned from what others did well + what warrants improvement. We then nailed down the concept direction and defined solution.


We created the storyboard based on the purchase flow with the chatbot.

Screenshot 2022-08-11 at 11.26.33 AM.png

User Flow

We created the ideal flow of how a user should go through the purchase flow with the chatbot.

user flow.png

Design Progress

Defined Solution

Natural Language Understanding

it utilizes Natural Language Understanding so that it can interact with users rather than providing static script

24 hour customer service
it provides 24 hour customer services to meet users’ needs all round the clock


API connecting to other systems
with the APIs connecting to other systems, users can make an order, reserve for repair and register products with the chatbot so they can get relevant and reliable services.

Sentiment Analysis

it uses sentiment analysis to identify users’ feelings to build rapport, show empathy, and develop a stronger relationship with users.

- Develop


Usability Testing


2 rounds of testing
4 participants per round

Research Methods


A/B testing
Rating of overall trust
Short interview

Data Collection


Screen recording on Zoom & Microsoft Teams


We made wireframes and prototypes to receive feedback and iterate. We refined design details to achieve the vision and goals with 3 major improvements:

Highlight & adjust privacy options

“Better to provide privacy-related options ahead or highlight those options”

“I can’t close the ‘cookies settings’ on the top”

Frame 113.png
Frame 112.png

Highlight the live agent option

“I wasn’t able to get in touch with a human throughout the experience”

‘Help me choose’ instead of ‘Make a purchase’

“I think 80% of customers won’t purchase a product using a chatbot”

“‘Make a purchase’ makes me feel uneasy, because it feels like they want me to input credit card and payment info in the chat”

Frame 111.png

Chatbot Character Design

The chatbot character, “Jamie”, is inspired by Sir James Dyson, an inventor, entrepreneur and Founder of Dyson with the following qualities:



Gender neutral


_104248930_dyson.hairdryer 1.png

Sir James Dyson

Group 113 1.png
- Deliver


Final Design

Make real conversation

  • It utilizes Natural Language Understanding

  • It interacts with users rather than providing static script

  • It provides transparency: users know they’re talking to a chatbot in the first place

- Solution

Provide reliable services

  • It provides the APIs connecting to other systems
    help users make an order, reserve for repair and register products

  • It offers recommendations based on users’ needs

Develop relationship and trust

  • It uses sentiment analysis to identify users’ feelings

  • It collects feedback from users to better understand preferences

  • It provides an option to close the chatbot or connect to human advisor


Figma Prototype


Next Steps

Implementing voice access and accessibility

Due to time limit, we have not implemented voice access and accessibility in the design. We will iterate with accessibility concerns in the future to help all users enjoy the service.

- Application to other industries
Our proposed design improvements are applicable to other industries that utilize AI chatbots such as the financial and health care industries where data privacy measures are arguably even more critical and people are being asked to trust these technologies with more sensitive information. Currently many banks are challenging their customers to make the choice between increased convenience and peace of mind when it comes to using AI chatbots. Banking chatbots would especially benefit from our data rights solutions to create a better sense of trust between users and their platform and brand


Role as a facilitator

It was the first time I acted as a facilitator in an UX project. I stepped out of my comfort zone and helped the team improve efficiency and cooperation.

- Cooperate across timezones
Due to pandemics, we need to cooperate across two timezones and learned how to manage the project and engage every member using different tools and communication skills.

Lesson Learned

- Measurement

It’s important to define the problem statement to provide a clear description of the user’s needs that should be addressed and help us measure success.

- Communication

As a designer, one of the major responsibility is to communicate with other people, whether it is articulating design decisions with stakeholders or understanding users’ needs. The better you can communicate the design, the better the design will come out.



mentormmunity focus.png

Mentorship Management Tool

forhome strip.png


bottom of page