--- title: "Portfolio website examples" description: "What makes a designer portfolio work: layouts, case study formats, what hiring managers look for, where to find great examples, and how to keep them." source: https://savepad.app/blog/portfolio-website-examples --- [Blog](https://savepad.app/blog) · 16 December 2024 # Portfolio website examples What makes a designer portfolio work: layouts, case study formats, what hiring managers look for, where to find great examples, and how to keep them. *Saved designer portfolio sites in a Savepad folder* **TLDR** - Hiring managers spend minutes, not hours. Lead with your best two projects and make each one a story: problem, your role, what you did, what changed. - Three to six case studies beat twenty thumbnails. - Good places to find examples: Bestfolios, Godly, Awwwards, and Dribbble. Save the ones you like with a note on why. ## What hiring managers look for Talk to anyone who hires designers and you hear the same things: - **How you think**, not just what it looked like. The process and the trade-offs. - **Your role.** “Lead designer, with one PM and three engineers” tells them a lot. - **The result.** A number if you have it (“signups up 18%”), a quote if you don’t. - **Taste.** Which the portfolio site itself proves or disproves in two seconds. ## Layouts that work **The big list.** Project names as large type, hover to preview. Fast to scan, and it puts the work first. **The grid of covers.** Strong cover image per project, click for the case study. The classic, and it works if your covers are good. **The one-pager.** Everything on one long page: intro, three projects, contact. Great for early-career designers. **The playful one.** An interactive, weird, very personal site. Brilliant if you’re applying to a studio that values that, risky for a corporate role. ## Case study format The structure most good ones follow: 1. **One-line summary** and your role. 2. **The problem**, with context. 3. **The process:** research, sketches, the dead ends. 4. **The solution**, with real screens. 5. **The result**, and what you’d do differently. Keep the text short and the images big. Nobody reads 3,000 words on a portfolio. ## Where to find examples - **[Bestfolios](https://www.bestfolios.com)** collects designer portfolios and case studies. - **[Godly](https://godly.website)** is great web design in general, portfolios included. - **[Awwwards](https://www.awwwards.com)** for the experimental end. - **[Dribbble](https://dribbble.com)** for visual work, less for case studies. More in [design inspiration websites](https://savepad.app/blog/design-inspiration-websites). *A mock portfolio with project names in large type* 0563 · big list layout *A mock portfolio with a grid of project covers* 0660 · grid of covers *A mock one-page designer portfolio* 0757 · one-pager Portfolio layouts kept in a swipe file: a big list, a grid of covers, and a one-pager. ## Keep the ones you like Portfolios get redesigned every time someone changes jobs, so the version you loved disappears. Savepad holds on to each one as it looked, with its colours and fonts pulled out, which are often the best part of a portfolio. Search by colour to find “that portfolio with the orange”. The [design swipe file](https://savepad.app/blog/design-swipe-file) post has the full setup, and [Savepad for designers](https://savepad.app/for/designers) shows the rest. ## FAQ ### What should a design portfolio include? Three to six strong case studies, each with the problem, your role, the process, and the result. Plus a short about section and an easy way to contact you. ### Where can I find portfolio inspiration? Bestfolios, Awwwards, Godly, and Dribbble all collect portfolios. The best ones often come from following designers whose work you like. ### How many projects should be in a portfolio? Fewer than you think. Three to six well-explained projects beat twenty thumbnails, because hiring managers want to see how you think. [Join the waitlist](https://savepad.app/#waitlist) ## Read these next - [How designers keep a swipe file without it becoming a Pinterest board: A design swipe file that stays useful: save whole pages, keep the fonts and colours, sort by what you'll need, and find things by colour and text.](https://savepad.app/blog/design-swipe-file) - [How to use Pinterest secret boards as a swipe file: How to make a secret board on Pinterest, use sections to sort a swipe file, cut down the AI pins in your feed, and know when Pinterest stops being the right place.](https://savepad.app/blog/pinterest-secret-board-swipe-file) - [Hero section examples: Hero section patterns that work, from product-first heroes to one-line promises, with real dev tool and SaaS homepages and the mistakes that cause bounces.](https://savepad.app/blog/hero-section-examples)