UXUI in User Journey Insight

A new product in developer marketing tracking

Krunch, a startup catering to developers, focuses on tracking links and content performance across platforms like Github, Slack, Discord, Hackernews, and Reddit. Despite offering a unique service to developers, the app encounters challenges related to onboarding, waiting times for performance data, and visualizing the developer journey.


1. New User Onboarding

New users face complexity connecting various platforms. Streamlining the onboarding process into five stages, displaying progress, and setting achievable goals will simplify the user experience.

2. Waiting Time of Actual Data

The delay in displaying results on the dashboard can be discouraging. To mitigate this, dummy data is introduced during the wait, providing users with insights and maintaining their engagement. Email notifications alert users when the actual data is ready.

3. Brand New Function Visualization

Introducing the “Developer Journey,” which maps user interactions and behaviors, presents a UI challenge. The design focuses on clearly communicating the user’s path, goals, and linked content using an intuitive collapsible tree diagram.


1. Visualizing Progress and Connected Platforms

Setup status and progress bar on the left

A simplified onboarding process with progress indicators reduces complexity. Creating goals and providing a clear overview of the remaining steps enhances user understanding and expedites the onboarding experience.

2. Tutorial with Dummy Data and Notification System

Tutorial is showing the expected metrics after data crawling is completed
Familiarizing the user of the Developer Journey’s UI before setting up tracking

Introducing dummy data during waiting periods preserves user enthusiasm. Users will be able to interact with the tutorial using dummy data and UI with Krunch is crawling the data. An email notification ensures users are promptly informed when the actual performance data is ready for analysis.

3. Developer Journey UI Design

Tree diagram is used to indicate what audiences have interacted towards the goal

The UI for the Developer Journey employs a collapsible tree diagram to illustrate the interconnectedness of user interactions, goals, and linked content. This design ensures a clear and comprehensible presentation of this novel feature to users.

Avo assistant

The Avo is introduce as the mascot as well as the assistant of Krunch users in teaching them how to use the app, answering Q&A, as well communication and PR person on email and Twitter. Creating a friendly and warm brand personality for a tech product.