Designing an internal CSM desktop application that manages support tickets for a Web3 dApp to streamline workflows.
ROLE
Lead UX Designer
TIME
2 months
DELIVERABLES
Internal Desktop Application
ABOUT STACK SUPPORT
Stack Support is a CSM software designed to provide organization and ticketing support for a cryptocurrency trading protocol and is used by internal customer service representatives. Connected with a Telegram bot, the desktop app allows Agents (or CS reps) to manage ticket requests submitted by customers with ease while allowing support for a live chat.
PREFACE
As a sole designer at Bitus Labs, I was tasked to design a communication channel software that provides ticketing support for one of our clients, MappedSwap. MappedSwap is a decentralized application that allows users to cross-margin trade using cryptocurrency. With new users onboarding MappedSwap each day, Agents (or CS reps) are having difficulty managing the influx of incoming ticket requests submitted by users. The goal of this project to build an internal application that tackles this issue.
ISSUE AT HAND
Currently, Agents are relying on a Telegram chat to handle support tickets. This means they have to manage all requests within a chat thread, which not only risks exposing sensitive information but also makes it challenging to work efficiently, especially when juggling multiple tickets at once.
Imagine yourself as one of these Agents. Your entire workflow revolves around Telegram, and you constantly have to keep track of which message corresponds to which ticket. If another agent needs to take over your tickets, they'll have to sift through the chat history, reading through everything again just to catch up on what's been done and what still needs attention. This setup not only complicates ticket management for Agents but also adds hurdles for Agents supporting one another.
Recognizing these issues, our team at Bitus Labs has decided to address them by implementing an internal ticketing software. Rather than opting for a pre-existing solution like Zendesk, we've chosen to develop our own system. This approach not only reduces overhead costs but also allows for customization tailored to better suit the needs of our agents.
To ensure privacy and organization, the challenge is to design an internal ticketing system that protects users information while allowing Agents to communicate efficiently with users.
The high-level goals were to:
Create an internal dashboard for Agents to accept incoming ticket requests
Allow internal management to track tickets and progress of Agents
Take into account what type of support and organization make sense for Agent
USER INTERVIEWS
In the majority of cases, user interviews are crucial to better understand the user experience behind a product. It helps designers identify pain points that are not clear from a project brief. With limited resources allocated for this project, I was able to recruit 3 people for this activity.
The interview sample consisted of both men and women between the ages of 22-30, who were current Agents managing tickets on Telegram. It was helpful to interview direct users to gain insights on their behavior and habits when handling a ticket.
The interviews took approximately 20 mins each and included topics surrounding their typical work flow. The following questions were asked:
What is your typical flow like when you receive a ticket?
Currently in your process, what are some blockers that slows down your tasks?
What type of tickets requests do you normally receive?
Are you able to handle all tickets? If not, how are tickets escalated to receive a managers attention?
What are some things that work well for you in your current process?
How many tickets do you handle in a typical day?
Through conducting interviews, I was able to gather the following insights:
All participants struggle with keeping track of tickets due to the nature of their current process flow
On average, each participant receives about 10-15 tickets per day
Participants receive referral issues for the most part with account tickets being the next requested ticket
Roughly 20% of tickets are escalated to a manager attention
COMPETITOR ANALYSIS
In addition to our user interviews, I conducted a competitor analysis to identify existing solutions offered by other companies. This process provided valuable insights for Stack Support, enabling me to prioritize the essential features for our initial MVP and establish a solid foundation.
Based on our competitive analysis, I found that Live Chat Support and Shared Inboxes are must-have features for this application. To uphold customer support satisfaction, users need to be able to receive support in real-time, eliminating any potential response delays that may prevent users from trading. In addition, Shared Inboxes help Agents support one another by creating transparency to ensure there’s no oversight in tech support.
Ideation
USER FLOW
The primary objective of the Stack Support flow is to effectively manage tickets, which involves actions such as opening, escalating, closing, or reopening them as required. To ensure thoroughness, I've deconstructed the process into individual steps, ensuring that we cover all necessary actions for proper ticket handling.
WIREFRAMES
Next, we moved on to bringing our ideas to fruition. I created low-fidelity wireframes to provide a visual representation of our dashboards and assess how effectively we're addressing our challenges. Following the principle of "if it ain't broke, don't fix it," I drew inspiration from Discord's layout to establish the foundational design for Stack Support's dashboard.
STYLE GUIDE & UI DESIGN
In order to transform the wireframes into a complete user interface, I drafted a style guide consisting of branding and component interactions for our development team. This style guide was then used to enhance our low-fidelity wireframes and turn them into high-fidelity wireframes.
PROTOTYPING
Once we had our core design, it was time to begin prototyping. Prototyping helped us work out all the details of each action to create a seamless and efficient process. We encountered a few issues related to escalation and how a manager would take over a ticket if needed but ultimately resolved it by adding roles to each account. A manager would have oversight on all Agents' work and are able to take over if needed.
For the best experience, please view the prototype on desktop or use the link below:
VALIDATION
Once the full user interface and prototyping was complete, I’ve sat down with a Customer Support Manager and Tech Lead to review my design. The goal of this meeting is to confirm that all criteria for MVP 1 was met and all functionality of the app was feasible. I also wanted to validate my design decisions to ensure each task was efficient and easy to complete. This meeting was met with great success as the designs and workflow was easy to understand. Given the green light, I moved onto provided annotated designs and prepared for handoff with the Engineering team.
CONCLUSION
Given the time constraint and lack of resources available, I felt that this project was met with great success for our first MVP. I was able to design an application that meets all the requirements asked for without many blockers. The biggest obstacle was the language barrier between Agents and myself since English was not their primary language. Other than that, the rest of the project was smooth sailing. For our second MVP, we will be focusing on implementing a Create Jira Ticket feature as well as Advance analytics reporting.
