​Enchancing internal design process
Side projects to improve design operations in Shopee
Solutions
1. Usability Testing Guidebook and Templates
2. Common Pattern Library and more
Introduction
In addition to fulfilling daily design requests, I undertook side projects aimed at enhancing the internal design process within the company. Here are two examples showcasing my contributions to the improvement of design operations.
1. Promoting usability testing
Noticing the low rate of usability testing within the design team at Shopee, I took the opportunity to initiate this project that aimed to encourage and facilitate designers in conducting testing more easily.
I invited two more designers to join me. Together, we began by identifying the painpoints faced by designers, brainstorming potential solutions, and working collaboratively to create the following deliverables:
Usability Testing Guidebook
Created to support junior designers and project managers, our Usability Testing Guidebook offers clear guidance on conducting reliable tests. It covers the essentials of WHAT, WHY, and HOW, and includes practical tips based on my past experience to conduct tests within the company's context, eg. how to recruit and arrange meetings with internal users.
Screenshots of the Usability Testing Guidebook
Templates
Recognizing that designers often struggle with time constraints for user testing, we created easy-to-use templates to expedite the process. It includes test plan template, communication message template, faciliator note template, note taking sheet and result presentation template.
Screenshots of Test Plan Template / Note Taking Sheet / Result Presentation Template
Future Plan
The next step is to get feedback from designers and improve our tools. We are planning to make these tools available to all designers and work with HR to organize workshops for educating other teams about usability testing.
I believe this project will benefit not only designers, but also elevate the UX maturity of our company and educate other teams on the importance of a good design process.
2. The Common Pattern Project
Shopee has many internal portals, and we often find ourselves recreating common patterns and pages such as table and form. Unfortunately, we don't have a shared library for UI/UX, frontend/backend code, or APIs.
Therefore, the design and development team initiated the Common Pattern Project. The goal is to improve efficiency and consistency for both design and code across all internal portals in the company.
My Role
I'm in charge of the Common Pattern documentation website. My responsibilities include designing the website, writing guidelines, participating in project planning, joining weekly discussions about each common pattern, and designing the page building tool.
Solutions
These four impactful deliverables enable the product team to work efficiently and produce high-quality output.
1. Common Pattern Library
Pattern library with live demo design guideline, and development use case.
2. Page Building Tool
Anyone can easily create table and form page in this tool, using the pre-built pattern library. The result page can be exported as code instantly.
3. Figma UI Kit
Designers can directly utilize adjustable components from the UI kit, improving design consistency and efficiency.
4. Developer Tools
Integrated dev tools like standard BE API and shared monitor solution.
Impact
Over 10 internal portals are now using Common Pattern to build. More and more teams have started adopting our library. It decreases the development time for new features by at least 30%.