Portfolio Development

Your First UX Portfolio: Start with evidence, not polish

Build a credible case for the work you want next—even when your strongest projects come from school, self-initiated practice, volunteer work, or an adjacent role.

Nikki Kipple
Nikki Kipple
14 min readUpdated Sep 2026

The short read

  1. Begin with one case

    One complete, relevant project is a better starting point than waiting for an arbitrary project count.

  2. Make proof honest

    Show what informed each decision, name your contribution, and label what is still a hypothesis.

  3. Publish a useful shell

    Help someone understand who you are, choose a project, and contact you without overbuilding the site.

Editorial collage showing rough research notes becoming selected design evidence and a clear portfolio page

Start with the work you want next

Your first portfolio is not supposed to prove that you have already done every kind of UX work. Its job is to help the right reader see a credible connection between the work you have and the work you want to do next.

Collect a small set of role descriptions that genuinely interest you. Look for repeated expectations—not every phrase in every job post. Then translate those expectations into evidence a project could show.

Translate role language into evidence

Research and synthesis
Show the question you investigated, who or what informed the work, the pattern you found, and the decision it changed.
Interaction design
Show the task, important states, alternatives you considered, and why the final flow supports the user.
Visual or UI craft
Show hierarchy, typography, components, responsive behavior, and the details that make the interface coherent.
Collaboration
Name the team, your contribution, useful disagreement, and how new evidence or constraints changed the direction.
Product thinking
Connect the design decision to a user need, product goal, constraint, and an honest signal of what happened next.

Build the minimum portfolio that makes a case

Do not wait until you have a magical number of projects. Begin with one complete case study and a simple shell around it. Add another project when it proves something meaningfully different.

Common starting point

Three unfinished projects

Each project repeats the same process labels, skips the important decisions, and relies on polished mockups to carry the story.

Stronger first version

One complete, honest case

The reader can understand the context, your contribution, what informed the work, what changed, and what you would investigate next.

A useful first release

  • A homepage that names your direction and introduces the work without a generic slogan.
  • One complete case study that supports its claims with visible evidence.
  • A concise About or resume path that gives the work relevant context.
  • A clear, working way to contact you.
  • A reliable mobile and desktop experience with no dead ends or placeholder content.

Choose projects you can talk about honestly

Professional client work is not the only source of evidence. The strongest beginner project is the one that lets you explain the problem, your contribution, your decisions, and what informed them without filling the gaps with invented certainty.

Course project
Name the brief, timeline, collaboration, and what was actually tested or reviewed.
Keep the useful constraints instead of presenting the project as an unconstrained client engagement.
Self-initiated project
Choose a real problem you can investigate and label the work as exploratory or conceptual.
A thoughtful hypothesis is useful evidence; a fictional success metric is not.
Volunteer or community work
Agree on scope, permission, and how the organization can participate before treating it as a portfolio project.
Work from another discipline
Use the parts that demonstrate transferable research, facilitation, systems, content, service, or visual-design judgment.
Redesign of an existing product
Investigate a narrow, observable problem and avoid claiming access to internal goals, data, or user behavior you do not have.

If you have several possible projects, the broader Design Portfolio Guide can help you decide what each project needs to prove.

Write the first case study around decisions

A case study is not a scrapbook of every method you used. It is a guided argument: this was the situation, this is what I contributed, this evidence mattered, and these decisions shaped the result.

  1. 1
    Give the project in one screen
    Name the problem or opportunity, audience, your role, project context, current outcome, and one representative visual.
  2. 2
    Establish the constraints
    Explain the team, timeline, platform, content, access, production, research, or business conditions that affected the work.
  3. 3
    Choose two or three consequential decisions
    Show where the work could have gone another way, what evidence or constraint mattered, and why you chose this direction.
  4. 4
    Place evidence beside the claim
    Use research, iteration, interface states, critique, production details, or results where they help the reader understand the decision.
  5. 5
    Name the result and its limits
    Separate what shipped, what was measured, what was observed, what was approved, and what is still a hypothesis.
  6. 6
    End with a specific reflection
    Say what you would preserve, change, or investigate next—and why.

Use the free Design Case Study Builder to turn project notes into a decision-and-evidence outline before polishing the page. The case study structure guide goes deeper on the finished narrative.

Design the shell around the work

The portfolio shell is the homepage, work selection, navigation, About or resume context, and contact path around your individual case studies. Its job is to help a reader understand you and choose where to go next.

Homepage
State the kind of work or role, introduce the strongest project clearly, and make the next action visible.
Project selection
Use a title, short context, and representative image that help the reader predict what each project will show.
Navigation
Keep the main routes stable and make it easy to return from a project to the work selection.
About and resume
Connect your background to the work and direction. A portrait is optional, not proof of professionalism.
Contact
Give the reader one reliable path to reach you and enough context for the conversation you welcome.

Explore portfolio layout patterns for structure, but keep the choice connected to your work instead of copying the surface of someone else's portfolio.

Use an adaptable eight-week plan

Eight weeks is a planning frame, not a guarantee that everyone becomes job-ready on the same date. Compress it when the material is ready; repeat a week when the evidence needs more work.

  1. 1
    Map the role and evidence
    Choose a direction, collect a few relevant job descriptions, and list the proof a strong candidate would need.
  2. 2
    Inventory and choose
    Review existing work and select the project with the strongest relevant evidence and clearest personal contribution.
  3. 3
    Write the case-study skeleton
    Draft context, role, constraints, key decisions, evidence, outcome, and reflection before styling the page.
  4. 4
    Build the evidence layer
    Select, crop, caption, and sequence only the visuals that help explain the project argument.
  5. 5
    Build the portfolio shell
    Create the homepage, work selection, About or resume context, navigation, and contact path.
  6. 6
    Test with real readers
    Ask three people what role they think you want, what they remember, what feels convincing, and where they become unsure.
  7. 7
    Revise the experience
    Fix the largest comprehension problem, then check mobile, keyboard use, contrast, media, performance, and links.
  8. 8
    Publish and tailor
    Launch the smallest credible version and make a role-specific pass before sending it with an application or introduction.

Treat accessibility and performance as part of the work

A portfolio is itself a designed experience. It does not need to be technically elaborate, but it should let people reach, understand, and inspect the work across common devices and ways of navigating.

  • Use a logical heading structure and descriptive page titles.
  • Make navigation and interactive controls work with a keyboard and show a visible focus state.
  • Write useful alternative text for images that carry meaning, and mark decorative images appropriately.
  • Check text and interface contrast using the actual foreground and background colors.
  • Provide controls or alternatives for motion and video; do not hide essential evidence inside autoplay.
  • Size and compress images responsibly, avoid layout shifts, and test the live page rather than assuming a builder handles performance.
  • Check every project, resume, social, and contact link on mobile and desktop.

Use AI to clarify, not manufacture experience

AI can help you sort notes, find repeated ideas, shorten a project overview, question a vague claim, or create a list of gaps to check. You still have to decide what is true, relevant, and yours.

Do not outsource this

Inventing a complete story

The portfolio gains fictional research, participants, metrics, quotes, constraints, or outcomes that make the work sound more complete than it was.

Use AI for this

Finding what needs your judgment

The tool organizes your real notes, flags an unsupported claim, asks for missing context, or helps you compare ways to explain a decision.

Publish before the portfolio feels finished

A portfolio becomes useful when someone else can read it. Publish a credible first version, learn where readers become uncertain, and improve the largest problem before adding more pages.

Before you share the link

  • The homepage makes your direction understandable without requiring a case-study read.
  • Every project clearly names its context and your contribution.
  • The first case study can be scanned and then read more deeply.
  • Claims and visuals support each other, and any limits are named.
  • Placeholder copy, template projects, broken links, and inaccessible controls are gone.
  • The contact path works and the resume is current.
  • The site has been tested on a phone, a larger screen, and with a keyboard.

The portfolio checklist can help with the final pass. Use it as a prompt to inspect the site, not as a substitute for feedback from someone encountering the work for the first time.

Sources and further reading

The Nielsen Norman Group's User Experience Careers report includes survey and interview evidence about what UX hiring managers look for, including thought process, communication, method choices, collaboration, and the connection between work and outcomes. It also makes clear that expectations vary by role and organization.

Jared Spool's 2025 UIE talk, What Goes Into an Ideal UX Portfolio?, frames the portfolio as a designed part of the hiring process, not a universal template.

Use the W3C's current Web Content Accessibility Guidelines 2.2 for specific accessibility criteria and web.dev's Web Vitals guidance for current performance measures.

QuestionsAnswers

Questions, answered.

A few practical details before you keep going

Share this resource

Nikki Kipple

Written by

Nikki Kipple

Product Designer & Design Instructor

Designer, educator, founder of The Crit. I've spent years teaching interaction design and reviewing hundreds of student portfolios. Good feedback shouldn't require being enrolled in my class — so I built a tool that gives it to everyone. Connect on LinkedIn →

Want to know how your portfolio reads?

Share the homepage and the role you want. Your free First Read starts with the captured homepage and visible navigation. The $9 Full Crit expands to the portfolio shell—home, work index, navigation, and verifiable About, resume, and contact pages—plus one revision check. Individual case studies stay separate so each can get the depth it needs.

Review my portfolio →