20 voices, one recurring need
People wanted direction, practical readiness and access to mentors.
Product strategy / Research / Interaction design
HeiVeloA more personal
way forward.
Turning a form-led career platform into a companion that understands intent and suggests a useful next step.
Explore the design decisions ↘HeiVelo / Current product
Personalised content. A consistent structure.Personalisation within limits
Reusable widgets replaced costly, open-ended conversational navigation.
5 new users, working app
Clear card headings emerged as the key dashboard refinement.
01 / The assignment
From completing forms
to finding direction.
Skillablers already helped people create profiles, find jobs and access courses. Version 2.0 needed to understand what brought them there and guide what happened next.
I began by understanding the existing product and its features. Much of the experience relied on separate pages and text fields, leaving users to navigate the platform and decide what mattered.
My remit grew across competitive analysis, user research, information architecture, conversational flows, personas, wireframes, a design system and product naming. User feedback, stakeholder reviews and heuristic evaluation by fellow designers shaped the iterations.
The design question
How can we help someone find their next step when they do not yet know what that step should be?
02 / Discovery
The missing piece
was guidance.
Understand the landscape
I reviewed specialist career platforms alongside Naukri, Indeed and LinkedIn, comparing how people discover jobs, build profiles, prepare for interviews, learn and connect. This informed the opportunity to connect career needs through an ongoing understanding of the individual.
Listen across career stages
A survey followed by one-to-one interviews explored requirements across 20 people. Sessions took approximately 30 minutes and were conducted remotely and in person. Two of the six working professionals were also mentors.
20
research participants
| Working professionals | 6 |
|---|---|
| Recently graduated, employed | 3 |
| Recently graduated, unemployed | 4 |
| Current students | 3 |
| Final-year students | 4 |
Unclear career direction
Participants lacked visibility into available roles and career paths.
Someone to explain the next step.
They wanted mentors who could explain current industry expectations and how to prepare.
Learning did not always translate to work.
Participants described a gap between college learning and practical workplace requirements.
Design principle
Comfort creates clarity.
People may arrive uncertain or unable to articulate what they need. First help them feel understood, then progressively guide them towards a direction.
03 / Synthesis & structure
Organise the system.
Simplify the entry.
I synthesised feature cards from the research, then used collaborative open card sorting with the product team and one participant from each career-stage group. The structure was substantially reorganised and simplified.
Understand the person
Career stage, immediate goal and support needs.
Organise the possibilities
Profile · Jobs · Upskill · Class · Mentorship
Reveal a relevant start
Suggest a category and let the user choose.
Explore the card-sorting evidenceRole grouping and individual architecture+
An early grouping of capabilities across Individuals, Institutes, Industry and Mentors.
Open full image ↗Profile, Jobs, Upskill, Class and Mentorship organise related activities.
Open full image ↗One ecosystem, different needs
The wider architecture accounts for Individuals, Institutions, Industries, Community and Mentors, with different responsibilities and shared capabilities. Research-informed personas helped represent differences in career stage, confidence and support needs.
The structure supports the experience
Users do not need to understand the entire ecosystem to begin. Their intent provides an entry point; the underlying architecture determines which relevant journey can follow.
Explore the ecosystem and conversation flowOriginal architecture and intent-classification boards+
Role and career-stage distinctions inform the product architecture.
Open full image ↗An early question flow for understanding intent and circumstances.
Open full image ↗04 / Product identity
A name that could
move with the product.
Feedback suggested that “Skillablers” was difficult to understand, pronounce and remember. I proposed retaining the company name while giving the product its own identity.
HeiVelo
Hei — a warm greeting
Velo — velocity and forward momentum
The naming direction expresses a welcoming companion that helps people move forward. A shared design system supported consistency as the product evolved.
05 / Design evolution
The vision evolved.
The personal intent stayed.
Exploration 01
A simple starting question.
The first wireframes paired an open prompt with direct shortcuts. Jobs and interview preparation remained explicit destinations as the interaction model developed.
Suggested actions, typing and voice explored different ways to express a need.
Open full image ↗View the supporting wireframesJob discovery and the interview hub+
Recommendations, job details, practice and applying appear in one connected view.
Open full image ↗Upcoming interviews, preparation and past feedback are brought together.
Open full image ↗Exploration 02
A companion for the day ahead.
User feedback, stakeholder input and peer heuristic evaluation informed a richer dashboard: suggested learning, internships, quizzes, progress and prominent chat, voice and Explore access.
Daily guidance and progression sit alongside conversational access. This is an earlier design, not the current application.
Open full image ↗The pivotal trade-off
Personalise the content.
Make the structure reusable.
Continuous conversation to navigate the application would create substantial AI token costs. Dynamically generating widgets around each person’s requests also exceeded the delivery constraints. We retained personalisation through relevant recommendations inside predefined components.
| Original ambition | Current approach |
|---|---|
| Conversation throughout navigation | Direct, visible actions with intent-led onboarding |
| Widgets generated for individual needs | Reusable widget templates with personalised content |
| Guided daily progression | Relevant jobs, courses, mentors and upcoming activities |
This was a decision to manage anticipated cost and technical complexity. Cost savings were not measured.
Current design
Recognisable options. Relevant content.
The dashboard keeps the same visual language while making each opportunity explicit. The trade-off is that users choose more of their next steps themselves; personalised content helps them make that choice.
What survived the trade-off
Relevant jobs. Useful learning. Access to mentors.
Personalisation moved inside consistent cards. Explicit headings, added after testing, help people recognise each option.
See the current dashboard ↑05A / Design system
A shared language.
A calmer experience.
The design system translates the companion idea into repeatable choices: restrained surfaces, clear actions, supportive language and visible progress.
I defined principles, colour roles, typography, component states and accessibility guidance to keep the experience consistent as different journeys developed.
Comfort before clarityNever overwhelmGuide, don’t instructProgress over perfectionHuman over “smart”
HeiVelo / Interface foundationsRefined portfolio presentation
A little clarity.
A step forward.
A step forward.
A quiet hierarchy, with room to breathe.
Section heading25
Card heading20
Body & supporting text16
Labels & metadata14
Display 45 · larger body text in this refined presentation.Base
Elevated
Interactive
Accent
Depth for structure. Cyan and blue for action.
BaseElevatedInteractive
Light and dark surface families✓ Success! Error△ Warningi Information
Meaning is paired with a label or symbol.
ContinueExploreUnavailable
Your career goal
Explore product design
Labels remain visible as people enter information.Profile progressStep 2 of 4
Illustrative component specimens
One useful next step
Build on what you know.
Keep content readable on a stable surface.
View courseVisible focus treatmentSubtle depth supports hierarchy; longer text needs a solid backing.
Make accessibility a design rule.
Visible focus, persistent input labels, helpful error messages and text alternatives belong in the component definition.
Clarify the contrast targets.
Normal text needs at least 4.5:1 contrast, including secondary text. Large text can use 3:1. Inactive controls are exempt under this criterion; keeping them readable remains a design preference.
W3C contrast guidance ↗Specimens have been reorganised and refined for the portfolio; they are not a claim of audited product accessibility. The original working board is retained below.
View the original design-system boardPrinciples, visual foundations and working guidelines+
Source design-system documentation supplied for the case study. The refined presentation above clarifies contrast guidance and increases body-text size.
Open full image ↗06 / Onboarding & user control
Understand intent.
Let the person decide.
Ask why they came
Start with the person’s intent, before asking them to navigate the product’s categories.
Suggest a path
Recommend a category while allowing the person to choose the one that fits.
Build understanding
Offer resume upload or guided profile entry, gathering details progressively.
Review and confirm
Let users correct extracted information before continuing.
View the complete onboarding sequence +
Original sequence supplied for the case study. The overview shows progression; small screen copy has limited legibility in this export.
Open full image ↗Automation needs a correction step.
The review screen lets users edit or remove extracted details, add missing information, manage contact visibility and confirm their profile.
This reduces repeated data entry while keeping users in control of how they are represented. It also gives them an opportunity to correct the information that will inform recommendations.
Users review personal details, education, experience, skills and supporting information before confirming.
Open full image ↗07 / Validation
A small label.
A meaningful correction.
5
new users
3 students
2 working professionals
Working application
Onboarding → profile → next action
Participants found the application easy to navigate and felt the options they needed were readily available.
They completed onboarding, built their profiles and explored the dashboard to decide what to do next.
I expected the cards to explain themselves.
Users asked for headings to make each card’s purpose clear. I added explicit labels to the current dashboard—an adjustment to my assumption that the content alone would make the categories obvious.
Results are qualitative. There are no comparative completion-time or success-rate metrics, and the added headings have not been separately validated.
08 / Where the product stands
A working foundation.
A launch ahead.
Working application
The current onboarding, profile and dashboard journeys were tested with five new users.
NIT Calicut
A limited pilot has been conducted. It is separate from the five-person usability study.
Under enhancement
The team continues to refine the product ahead of its full launch.
November 2026
Full launch is planned for the end of November. Launch-scale outcomes are not yet available.
What this work taught me
The companion experience depends on understanding the person—and making the next action clear.
The project required me to carry research through architecture, interaction design, product identity and feasibility decisions. When the delivery model changed, the goal remained: help people find relevant support with less uncertainty.