What is a UX Designer?
A UX (user experience) designer makes digital products such as apps and websites easy, useful and pleasant to use. They study users, map journeys, design layouts and test ideas with real people.
UX designers work in tech companies, agencies, banks, startups and as freelancers. They collaborate closely with product managers, UI designers and developers.
How to use this ux designer roadmap
Follow this UX designer roadmap step by step. Research skills come early because good design starts with understanding users.
Pick one real app you find frustrating and redesign it as you go through the roadmap. It becomes your first portfolio case study.
1Step 1: UX fundamentals
Understand what UX is and the design thinking process.
What is it?
Design thinking is a process for solving problems with users in mind: empathise, define, ideate, prototype and test.
What to learn
Learn the classic usability heuristics. They help you spot problems in any interface.
Example
text
Design thinking
1. Empathise -> talk to users
2. Define -> write the problem statement
3. Ideate -> sketch many ideas
4. Prototype -> build a quick version
5. Test -> watch users try itThe steps repeat: testing often sends you back to define or ideate.
Helpful resource: NN/g: 10 usability heuristics
2Step 2: User research
Learn what users need through interviews and observation.
What is it?
User research collects evidence about real users’ goals, behaviours and pain points.
What to learn
Ask about past behaviour, not future wishes. What people did is more reliable than what they say they will do.
Example
text
Interview guide
1. Tell me about the last time you ordered food online.
2. What was easy? What was annoying?
3. How did you choose the restaurant?
4. What did you do when something went wrong?Open, story-based questions reveal real behaviour.
Helpful resource: NN/g: User interviews
3Step 3: Personas, journeys and problem definition
Turn research into clear tools that guide design.
What is it?
A journey map shows each step a user takes to reach a goal, with their feelings and pain points at each step.
What to learn
A clear problem statement keeps the whole team focused on the right thing.
Example
text
Problem statement
Busy parents need a faster way to reorder
family meals because searching the full menu
every week wastes time.
How might we let parents reorder in one tap?This statement defines the user, the need and the reason.
Helpful resource: NN/g: Journey mapping 101
4Step 4: Information architecture
Organise content so users can find what they need.
What is it?
Information architecture (IA) is how content is grouped, labelled and connected. User flows show the steps to complete a task.
What to learn
Use words your users use, not internal company terms.
Example
text
User flow: reorder a meal
Home -> "Order again" section
-> Select past order
-> Review cart
-> Pay
-> ConfirmationA short, clear flow reduces effort and errors.
Helpful resource: NN/g: IA vs navigation
5Step 5: Wireframing and prototyping
Sketch layouts and build clickable prototypes.
What is it?
Wireframes are simple layouts that show structure without colours or images. Prototypes add clicks so users can try the flow.
What to learn
Start on paper. It is the fastest way to explore many ideas before choosing one.
Example
text
Wireframe: reorder screen
[ Header: "Order again" ]
[ Card: Friday family dinner | Reorder ]
[ Card: Sunday brunch | Reorder ]
[ Link: See full menu ]The layout puts the main action, Reorder, where users see it first.
Helpful resource: Figma Help Center
6Step 6: Usability testing
Watch real users try your design and improve it.
What is it?
Usability testing shows where users get stuck, so you can fix problems before development.
What to learn
Testing with five users usually reveals most of the big usability problems.
Example
text
Task: "Reorder last Friday’s dinner"
Success: 4 of 5 users
Avg time: 22 seconds
Issue: 2 users missed the Reorder button
Fix: make button larger and higher contrastClear numbers and issues make it easy to decide what to change.
Helpful resource: NN/g: Usability testing 101
7Step 7: UI basics and design systems
Learn enough visual design to make your work clear and polished.
What is it?
A design system is a set of reusable styles and components that keep products consistent.
What to learn
Check colour contrast for accessibility. Text must be readable for everyone.
Example
css
:root {
--color-primary: #C75101;
--color-text: #1a1a1a;
--space-2: 8px;
--space-4: 16px;
--radius: 12px;
}Design tokens like these are shared between designers and developers so the product looks the same everywhere.
Helpful resource: W3C: WCAG overview
8Step 8: Portfolio and career
Show your process and land your first UX role.
What is it?
A UX case study tells the story of a project from problem to outcome.
What to learn
Hiring managers want to see your thinking. Show research, decisions and results, not just final screens.
Example
text
Case study structure
1. Problem and goal
2. My role and team
3. Research findings
4. Ideas and iterations
5. Final design
6. Results and lessonsThis structure shows employers how you work.
Helpful resource: Interaction Design Foundation
UX Designer roadmap project ideas
Projects turn what you learn into real skills. Build at least one project from each level below, and put every finished project on GitHub with a clear README.
Heuristic review
Evaluate an app using usability heuristics.
User interviews
Five interviews with an affinity map.
App redesign
Wireframes and prototype for a real app problem.
Usability test report
Test plan, findings and fixes.
Design system
Tokens and components in Figma.
Portfolio case studies
Two full case studies on a portfolio site.
Tips to finish this ux designer roadmap
- Practise every day. Sketch, model or design something small daily. Skill in design comes from repetition.
- Study great work. Look at real projects, magazines and portfolios, and note why they work.
- Build a portfolio early. Even student or concept projects show clients and employers how you think.
- Ask for feedback. Share your work with designers and clients and learn from their comments.
- Master the basics first. The fundamentals in this ux designer roadmap matter more than any single software trend.
Career paths and next steps
After this UX designer roadmap, you can apply for junior UX designer, product designer or UX researcher roles. Later you can become a senior designer, design lead or product manager.
Explore the product manager roadmap or learn to build designs with the frontend developer roadmap.
Related roadmaps
UX Designer Roadmap FAQs
Do UX designers need to code?
Coding is not required, but basic HTML and CSS help you work with developers and design realistic solutions.
What is the difference between UX and UI?
UX focuses on how a product works and feels to use. UI focuses on how it looks: colours, typography and visual elements.
Which tool should UX designers learn?
Figma is the most widely used design and prototyping tool today.
Can I become a UX designer without a degree?
Yes. A strong portfolio with clear case studies matters more than a degree for many employers.