✨
Redesigning the Help Center Experience to Support Users in Their Most Crucial Travel Moments.
I led the design process to redesign tiket.com’s Help Center, working closely with a researcher, UX writer, and illustrator.
The project was informed by insights from the previous version of the Help Center. I was responsible for the end-to-end design, from structuring article frameworks to improving content wayfinding and designing the problem-resolution pipeline.
Skills I utilized:
Framework thinking, Craftmanship, Problem forecasting.
📊
Background
Imagine you're traveling and urgently need help with your ticket. You try to resolve the issue on your own, but it’s hard to find clear guidance, so you call customer service.
Unfortunately, you’re not the only one. Like you, many other users try to call at the same time.
What we found:
89.9% of users who visit the Help Center eventually end up contacting Customer Care.
Over 58% of tiket.com users express dissatisfaction with long wait times when trying to reach customer support.
This creates a major bottleneck, with the Customer Care team overwhelmed, even by simple, repetitive inquiries that could have been solved via self-service.
🖌️
Challenges
Based on usability testing and flow analysis of the old Help Center, conducted by our researcher, we uncovered some key issues:
Imagine facing a problem while traveling, only to be met with a confusing, labyrinth-like Help Center. How would you feel? Frustrated. Overwhelmed. Clueless.
Now imagine being on the other side, working in Customer Care, handling thousands of calls from stressed-out users, many of them angry and anxious. It's unsustainable.
No one trusted the Help Center.
They didn’t even bother opening it, because they knew it wouldn’t help.
The Current Design
Finding the Help Center
The Help Center entry point was buried and generic, easily overlooked among other buttons. Users could only access it through their ticket page or the profile section, which limited its visibility and accessibility.
Searching for Help
Once inside, the landing page was unintuitive. Users had to guess which topic matched their issue, often feeling like they were navigating a text-heavy maze with no clear guidance.
Solving the Problem.
Even when users did land on the right article, the content was too long and lacked visual support. There were no step-by-step visuals, only walls of text that overwhelmed users instead of guiding them.
This wasn’t just a UI problem. It was a systemic issue across the entire help journey, from pre-trip concerns to post-travel complaints.
Our mission was clear:
Reduce reliance on Customer Care by rebuilding user confidence in self-service support through a redesigned Help Center experience.
There are three core design challenges face up:
Problem Handling Pipeline
How might we categorize support topics based on urgency and context, so users can get the right solution at the right time?
Solution Wayfinding
How might we help users reach the most relevant answer, and fast, without getting lost in a maze of content?
Articles Design Framework
How might we design help articles that are quick to scan, easy to understand, and visually guide users step by step?
Let's break the code!! 🔢 ⚙️
💪
Design Process
Before jumping into design exploration, I realized we needed to deeply understand user behavior and preferences. Naturally, users expect the same speed and clarity from the Help Center as they would from speaking directly to Customer Care.
Pre-Design
1. Analyzing Existing User Behavior
Using internal analytics tools, we reviewed how users interacted with the current Help Center. We also analyzed what types of help articles users frequently searched for. We identified 15 common issue categories, and from there, narrowed down the top 10 user pain points:
Refund and Reschedule
Current order status
Cancellation and Changes to order
Payment
Profile and Account
General questions
How to order
Hotel check in
Refund policies
How to find ticket
We mapped these issues against the ticket purchase flow and found that most problems occurred after the ticket was booked—during or close to the time of travel.
Key Insights
Users often start their problem-solving journey from their most recent order.
They expect to find help linked directly to their current booking, not from a generic topic list.
If they don’t find a solution there, they fall back into the general Help Center topics, which is less efficient and increases frustration.
For users in extraordinary or time-sensitive situations (e.g., flight delays, hotel cancellations), we also needed to design a dedicated problem-handling pipeline—one that prioritizes urgency and routes them to the appropriate support faster.
Before jumping into wireframes, I conducted a collaborative workshop to understand the struggles of the Customer Care team and brainstorm ideas for a better Help Center experience.
I've included a screenshot from the session (written in Indonesian) as evidence.
The workshop involved cross-functional participants from design, product, research, content, and Customer Care. We split into pairs and brainstormed ideas mapped to the ticket purchase journey
After generating ideas, we voted on the most feasible and impactful solutions, those that aligned with three core principles.
Design Principles
📝 Contextual
Hypothesis: Most user problems occur after a ticket is issued. We can leverage the user’s entry point and context to predict the articles they're looking for.
📝 Detailed
Hypothesis: Articles must be clear, complete, and precise.
Vague answers reduce trust. We aimed for specific, step-by-step content that directly addresses user concerns.
📝 Simple
Hypothesis: Information should be visual and easy to grasp.
That includes both article formatting and navigation design, to avoid overwhelming users in high-stress situations.
Design Exploration
A New Pipeline for Handling Extraordinary Cases.
We understand that human support can't be fully replaced by machines, especially in high-stakes situations. That’s why, for time critical conditions (anything happening within 8 hours of check-in, departure, hotel check-in, or event start), users are able to connect directly with our Customer Care team.
To handle this, we designed a new support pipeline that categorizes users based on urgency detected contextually from their journey to the Help Center.
For non-urgent cases, users are guided through three enhanced Help Center experiences:
Contextual Bottom Sheet → surface relevant topics based on entry point
Help Center Chatbot → guided query path for faster routing
Main Help Center Landing Page → fallback entry for broader exploration
Solution wayfinding
To bring solutions closer to users without requiring them to search from scratch, we designed a mini Help Center overlay called the “Contextual Bottom Sheet.”
This bottom sheet adapts its content based on where the user comes from and what action they’ve taken, offering relevant help articles that match their current situation.
Articles Design
To ensure clarity and simplicity in Help Center content, we created a structured framework to guide writers in designing helpful, consistent, and easy-to-read articles.
We began by auditing existing articles—listing them one by one—and discovered that most fell into five common question types:
“What,” “How,” “Where,” “If cases,” and “Can I...”
From this, we identified a consistent pattern in how user questions were formed, and used that to define the foundation for article structuring.
Inverted Pyramid Framework
We applied the Inverted Pyramid Framework, a well-known principle in journalism, which suggests structuring content from:
The most important information
Supporting details
General background information
This hierarchy helps users quickly scan and absorb what matters most, especially in moments of stress or urgency.
We follow this structure as a guideline to write an articles, with a formed hierarchy:
To turn the framework into action, we shared practical writing rules for article creation:
One main idea per paragraph
Always start with the main idea
Short paragraphs (50–75 characters) with clear, simple sentences
For articles with more than two paragraphs, apply the “lengthy explanation” format (we'll show this below)
In the next section, I’ll explain how we applied this into the 3-level article format—complete with visual hierarchy and examples.
Introducing The New Help Center!
Entry Points
We distributed Help Center entry points strategically across the app, placing them where issues are most likely to occur.
Goal: Bring support closer to users, reducing the steps needed to get help.
Relevant Articles First
We prioritized articles directly related to the user’s current order, so solutions appear faster whenever problems arise. This context-driven approach eliminates unnecessary searching and builds trust in self-service support.
Highlighting Titles for Easy Scanning
We emphasized key words in article titles using bold text. This small but important change helps users quickly spot the most relevant information when scanning through multiple articles.
Articles Framework
This framework ensures that every Help Center article is well-formatted, simple, and helpful. By following these guidelines, writers can create content that effectively supports users, and encourages self-service over direct customer support.
Introduction page
Level 1 - General Guidelinnes
All articles must follow universal writing rules to maintain consistency across the Help Center:
Use clear, question-based titles for better scannability.
Include relevant visuals when needed to support understanding.
Structure content into short, concise paragraphs (50–75 characters per sentence).
Break explanations into logical sections with clear hierarchy.
Level 2 - Article Type Selection
Writers must select the most suitable article type based on the content’s purpose. Articles are categorized into five types:
How Articles: Step-by-step guides explaining a process or action.
Where Articles: Help users locate features or information in the app.
What Articles: Describe features, services, or policies.
If Cases: Explain what happens if a user takes a specific action.
Can Articles: Confirm whether a user can perform a specific action.
Level 3 - Media Formatting Rules
Additional elements (images, GIFs, videos) must follow clear formatting standards to improve clarity and engagement:
Step-by-Step Articles: Number each step, limit to a maximum of 7 steps.
GIFs & Videos: Keep GIFs under 12 seconds, videos between 10–60 seconds, with clear labels or captions.
Explanations: Break into digestible sections, avoiding long blocks of text.
Articles Visualization
Impact and Reflection
🚀 Project Impact
Following the design process, we collaborated with Customer Care representatives to align on the new design and content framework. They fully embraced the approach, rolling out internal training sessions so the content team could adopt and maintain the framework consistently.
Customer trust increased by 13% compared to the previous version, as shown by the higher traffic to Help Center articles.
Reflection
At first glance, this project seemed simple, but don’t trust the cover!
What looked like a straightforward Help Center redesign quickly revealed itself to be a labyrinth of interconnected problems, from broken wayfinding to inconsistent content structures, to a lack of trust in the system itself.
This meant we couldn’t just “tweak the visuals.” We had to rethink every section, rebuild the content strategy, and revamp the entire problem-handling pipeline.
Through countless meetings, design critiques, and collaboration across teams, we transformed full Help Center experience, to help users during their most stressful travel moments.
A huge thank you to the Tiket design team (Sulis, Egi, Yoj, Yudha, Yoel, Zahra), PMs (Dika, Richard), Tech team, and everyone else who made this possible, for the trust, the energy, and the countless problem-solving sessions that made this project a success.