Skip to main content

Portfolio Structure

How you organize your portfolio is just as important as the work inside it. A clear structure helps reviewers find what they need quickly and ensures your strongest work gets the attention it deserves. Think of your portfolio's information architecture the same way you would think about any product's navigation.

The Homepage

Your homepage is a project listing page. Its job is to help visitors quickly scan your work and choose which projects to explore. Keep it focused.

Essential homepage elements:

  • Your name and role — Make it immediately clear who you are. "Sarah Chen — Product Designer" is better than a clever tagline that requires interpretation.
  • Project thumbnails — High-quality preview images for each case study. These are the most important visual element on the page.
  • Project titles and brief descriptions — One line per project that hints at the scope: "Redesigning the checkout experience for a fashion e-commerce platform."
  • Navigation — Clear links to your About page and contact information.

What to avoid on the homepage:

  • Long introductory paragraphs that delay access to your work
  • Auto-playing videos or heavy animations that slow load time
  • Carousels or sliders that hide projects behind interaction
  • Filtering systems — with 3-5 projects, filters add complexity without value

Practical tip: Your homepage should require zero clicks to see your project thumbnails. If a visitor has to scroll past a full-screen hero section or click through a splash page, you are adding friction.

Project Pages

Each project page is a self-contained case study. The structure should be consistent across all projects so reviewers can quickly orient themselves.

Recommended project page structure:

  1. Hero section — Project title, one-line description, and a hero image of the final design
  2. Project overview — Role, timeline, team size, tools used. Present this as a quick-scan sidebar or horizontal bar.
  3. The challenge — What problem you were solving and for whom
  4. Your process — Research, exploration, iteration, testing
  5. The solution — Final designs with annotations and explanations
  6. Results — Metrics, outcomes, or qualitative feedback
  7. Reflections — What you learned or would do differently (optional but shows maturity)

Keep the visual style consistent between projects. Use the same heading sizes, image treatments, and spacing. This consistency signals attention to detail.

The About Page

Your about page humanizes you beyond your work. It gives reviewers a sense of your personality, background, and what motivates you.

Include:

  • A professional photo — this builds trust and makes you memorable
  • A brief bio covering your background, focus areas, and what you enjoy about design
  • Your design philosophy or approach in 1-2 sentences
  • Links to your LinkedIn, social profiles, or writing

Keep it concise. Your about page should be scannable in under a minute. Save the detailed career history for your resume or LinkedIn profile.

How Many Projects to Include

The ideal number is 3 to 5 projects. Here is why:

  • Fewer than 3 feels like you lack experience, even if the projects are excellent
  • 3 to 5 gives enough variety to show range while keeping quality high
  • More than 5 dilutes attention and increases the chance that a weaker project undermines your stronger ones

If you have more than 5 strong projects, choose the ones most relevant to the roles you are targeting. You can rotate projects in and out as your career goals change.

Project Ordering

Put your strongest project first. Many reviewers will only look at 1-2 projects before making a judgment, so lead with your best work.

Ordering strategies:

  • Strongest first — Your most impressive case study leads. Best for job applications.
  • Most relevant first — If applying to a specific company, lead with the project most similar to their product.
  • Reverse chronological — Most recent work first. Good for showing growth but risks burying your best project.

Contact Information

Make it easy for people to reach you. Include your email address on every page, either in the navigation or the footer. A contact form is fine as an addition, but never as a replacement for a visible email address. Some reviewers will want to send a quick email without filling out form fields.

Key Takeaways

  • Keep your homepage focused on project thumbnails with zero friction
  • Use a consistent structure across all project pages
  • Include 3-5 of your strongest, most relevant projects
  • Lead with your best or most relevant project
  • Make contact information visible on every page