Meet the legacy system
Thai Run had an internal system dedicated to managing the events they host. The functionalities of the system include a wide range of operations: creation and editing of events and promotions, and the ability to view and manage event registrations, among other features.
Issues with the legacy system
Navigational challenges
The non-hierarchical layout of the sitemap posed challenges for users. For example, having ‘user action history’ accessible on the same level as the ‘users’ menu instead of nested beneath it led to confusion. Users had a hard time locating the specific features or data they were searching for.
Frictions during onboarding
Numerous jargons were used in the system, posing challenges for both new company joiners and event organizers in grasping these terms. The resulting misunderstandings often led to errors, requiring assistance from a few individuals who were proficient in using the system.
Identify stakeholders and their pain points
Operation team (internal)
– “Only [name] and [name] are able to create or edit events proficiently, thus bearing the work loads. This results in an occasional bottleneck.” said one of the team members.
– The team has 3 main tasks: (1) create and edit events, (2) track trends of all the events, (3) resolve issues/requests accordingly
– Completed tasks based on urgency. Some tasks were forgotten and left incomplete.
– Regularly exported data, created charts in Excel, and sent them to related parties. This process was unnecessarily repetitive and time consuming.
Event organizers (external)
– “Typically, I log in to review the overview of my events. Other tasks seem too complicated to me, although it would be nice to manage product stocks myself.” said one of ThaiRun customers.
– Required to complete several Google forms, phone calls, and meetings to set up an event.
– Found the system too complicated to use. They opted to seek assistance from Thai Run staffs, resorting to phone calls for task completion.
How might we empower individuals
to accomplish tasks independently
and in a time-efficient manner?
Proposed Solutions
Reorganize information architecture
Simplify IA for easy navigation. Highlight frequently used info/features upfront; nest rarely accessed event settings within the main settings.
Show all pending tasks on the home page
Unresolved requests, including money withdrawals, event approvals, registration cancellations, and more, will be displayed on the first page, ordered by the priority set by the internal team.
Integrate common data views directly into the system
I collected the specific data views users wanted, eliminating the need for exporting and processing data in third-party applications. So, we can directly visualize this data within the system.
Utilize Figma variables and styles to develop design system
I created a design system and tokens to build consistency and recognizable brand identity.
Final Product
Project Reflections
Circumstances and requirements can change over time
When I first tested out the legacy system, I was baffled by the countless registration statuses that I had to raise the question whether they were necessary or not. Surprisingly, even the internal team was unsure of the design’s origins. It was only after consulting one of the longest-serving employees that we learned these statuses originated from a time when QR Promptpay and mobile banking weren’t prevalent, and users paid through physical banks or ATMs and uploaded the slips to the system. Indeed, some of these statuses became obsolete since users complete the checkout process swiftly.
Design token improvement
This project was the first time I get my hands on Figma variables. As it scales, I noticed opportunities for design system improvement, such as setting text styles based on breakpoints rather than just sizes.
