Tricia Pang (Co-founder, senior product manager)
Edison Ko (Lead Designer)
Karan Gill (Customer Service Manager)
Hazel Yiip (Product Manager- Intern)
Eduardo Celi (Web Developer-Intern)
8 weeks, summer 2022
In the summer of 2022, I found my first job as a UX Designer at AssistList, a charitable organization that empowers the community to buy, sell, and donate medical health equipment. I worked with an amazing group of interns across diverse disciplines and learned from two experienced mentors (Tricia and Edison). During my summer internship at Assistlist, I redesigned the FAQ and the Contact Us page of the Assistlist website. I started with research and sketches to high-fi mockups and prototypes. I worked closely with this project's product managers, customer service managers, and engineers.
Reduce the number of questions asked via the Contact Us form, especially when documentation already published on the FAQ
1. On the Contact Us Form, in place of the contact fields, the user is prompted to first select a topic from drop-down
2. Based on the topic, display some sub-questions
3. If you still can’t find what is needed, reach us through live chat
4. Only display the contact form if unable to find an answer to their questions
Before v After- FAQ
Before v After- Contact Us
I actively collaborated with the customer service manager to investigate the pain points and frustrations of our users while navigating through our current Contact Us and FAQ pages.
I discovered through access to customer service emails that users are repetitively asking questions that are already answered in the FAQ.
Using Hotjar, a website heatmap, and recording tool, I learned that users also have trouble navigating through the FAQ due to abundant categories and folded accordions.
I looked at some competitors' FAQs pages and Contact Us forms to find inspiration.
My takeaways for FAQ pages include:
1. Top 5 Questions or Popular Questions is a useful category to place at the top
2. Include a survey at the bottom (e.g., Was this answer helpful?) to help gather user feedback
3. Having a search bar can help to find the answer quickly where there are too many FAQs
My takeaways for Contact Forms include:
1. Link to the FAQ page so users can browse through the list of existing questions answered
2. Separate information and form into two areas and leave some spaces in between.
3. Labels for the input fields should be clear to inform users of mandatory and optional fields
After discussing with the customer service manager, I reorganized the IA with our users (buyers, sellers, and visitors) in mind. Then I designed 3 versions of the initial mockup.
Common questions from our:
Buyers- How do I connect with the seller when there is an issue with the product?
Sellers- How do I list an item?
Site visitor/ first-time user: How do I sign up?
V1. Sort by Categories
Providing broad categories for users to navigate the FAQs
V2. List FAQ with Horizontal Menu
Providing the FAQs in a long list and having a menu at the top to anchor to specific categories
V3. Sticky Menu on the Side
Providing a long list of FAQs and a sticky menu at the side for quick navigation
I actively consulted with the engineers as well as my design manager and product manager to finalize the design of the FAQ and Contact Us page.
Final Prototype- FAQ
1. Chose v3 that has the simplest design for users to have a clear view of the FAQs
2. Implemented a search bar to help users to enter keywords to find their question
3. Inserted a link to the Contact Us form at the end of the page if the user didn't find their answer
Final Prototype- Contact Us
1. Linked the FAQ for users to find answered questions
2. Centered all content and made text left-aligned for legibility
3. Added asterisk to mandatory input fields
1. Survey to gather insights on the effectiveness of the answer
2. Media content to better explain the answer
I'm very honored to work on a large-scale revamp project from the very beginning. I was able to complete the design thanks to all the support and trust from all of my teammates at AssistList. I learned to collaborate with other designers, product managers, customer support staff, and engineers. I took advantage of user research findings by past designers and contact us emails to deeply understand our users. I also challenged myself to think outside the box when iterating with the initial mockup aside from the references I searched from other websites. I had the opportunity to present my designs to different teams to gain feedback and practice my delivery skills. The FAQ and Contact Us page were not implemented at the end of my internship. However, I am now a permanent designer at AssitList as a volunteer like most of my other colleagues. Therefore, I will have the opportunity to continue to enhance the designs and conduct user tests for this project in the future.