Tabi: User Journey Map Study
A human-centered design research project aimed at enhancing user journey mapping through innovative tools and methodologies. The study involved conducting interviews, co-design sessions, and usability testing to understand user needs and improve the design process. Leveraging AI-powered tools, the project explored how conversational AI and data synthesis could assist designers in creating more dynamic and effective user journey maps, with applications in speculative and exploratory design. My role as a design and research assistant included assisting research activities, analyzing insights, and contributing to the design, development, and evaluation of the prototype.
The Paper is currently under review
Kimberly Do, Nan Aye Mote Mote, Yunyi Park, Xin Li, Derek Curry. 2024. Tabi: A Speculative Design and Stakeholder-Centered User-Journey Mapping Tool. CSCW '25. [Under Review]
Design Features
Main Canvas
Tabi’s user interface draws inspiration from platforms like Miro and FigJam, featuring an infinitely expanding canvas with fixed-position toolbars (edit, panel menu, and zoom control) and visual guides like a dotted grid and horizontal dividers. Unlike conventional table-based user journey maps, Tabi uses a grid of individual cell cards, promoting flexibility, attention to inter-card interactions, and exploration of alternate flows.
User Journey Cards
Tabi features two card types: row header cards and cell cards. Row header cards, with yellow accents, form the first column and display category titles (e.g., phases, actions, emotions). Cell cards make up the rest of the map, allowing users to input titles and text for better reference and holistic viewing when zoomed out.
Clicking a card activates editing mode, revealing action buttons along the frame for quick access to features. Cell cards also include a circular “delete” button and half-circle “add” buttons on the sides, enabling seamless addition of new cards.
Alternate Flows
When considering a user journey, designers often grappled with representing multiple user flows. This strategy enabled them to contrast and compare between user flows' pain points or to explore new product opportunities. Tabi allows users to incorporate and visualize multiple user flows within a single row, such that the visibility of the user flows can be enabled or disabled. When clicking a card, a user may click on a hovering button in order to enable the alternate flow feature and thereby begin the creation of a corresponding, alternate user flow.
Participant Data Panel
The Participant Data Panel allows designers to upload and reference user research, such as interview transcripts or notes, while creating user journey maps. This feature supports efficient information retrieval, enabling designers to seamlessly incorporate user data into the mapping process.
Persona Panel
The Persona Panel allows designers to reference personas—hypothetical users with details like age, occupation, and attitudes—while creating user journey maps. This feature helps designers focus their maps on specific user profiles, streamlining the design process.
Information Panel
The Information Panel helps designers identify key insights in user journey maps by encouraging reflection on content and gaps in prior research. Designers input card content and a prompt, and Tabi generates questions to guide consideration of unique or critical aspects of the user journey.
Speculative Design Features
The Speculative Panel supports user journey exploration with two features: Peak and Imagine.
Peak: Uses AI to generate past and future sequences based on a selected cell, inspired by the speculative design cone. Users can navigate through immediate or distant sequences using arrow buttons or refine speculations with keywords. A timeline indicator visualizes the journey’s progression.
Imagine: Inspired by tarot card decks, this feature offers prompts for speculation. Users select a card from themed decks—Equity and Access, Usage, or Scale and Disruption—to generate contextual prompts, enhancing insights derived from the Information Panel.
Stakeholder KPI Dashboard
The Stakeholder KPI Dashboard helps product and engineering managers translate user journey insights into actionable roadmaps. It automatically categorizes user-entered comments based on company KPIs, allowing stakeholders to view comments aligned with specific KPIs and contextualize the design insights for product development.
Back to Top