How to read a studio portfolio

Evaluate a studio portfolio by the problem, the restraint, and whether they built the work. A gallery of screenshots with no decision is decoration.

By
A dim desk with an iMac showing a code editor beside a portfolio page, a second monitor with a mountain wallpaper, and a lit lamp. The pair of screens asks what the work is and whether it was built.
A portfolio page beside the code is the useful pair: the picture, and the proof someone built it. Photograph via Unsplash.

To learn how to evaluate a design portfolio, read for three things: the problem, the restraint, and whether the studio built what it shows. A gallery of screenshots with no decision is decoration. It can be pleasant. It does not tell you how the team will behave with your constraint.

The portfolio is an argument about judgment. Taste is part of it. Taste without a visible choice is a mood.

Read the problem before the pictures

Start with the words, even if the pictures are why you clicked. A useful project entry names the constraint. Who it was for. What was already true and had to survive. What was failing. If those sentences are missing, you are looking at an outcome with the difficulty removed, which makes every outcome look easy.

Ask what kind of problem it was. A heritage brand that needed a modern editorial site is a different problem from a store leaving an old checkout, and different again from a product interface a founder uses all day. If every project is described as "a bold new digital experience," the studio has not let you see the job. You cannot tell whether your job is in the set.

Hanabi's public work is readable this way, without invented results. Down the Cove is an ecommerce restructure, migration, and redesign. Thomas Bewick is an editorial site for a heritage craft brand. Ballarat Box Sports is a community sports brand site. Wabisabi is a calm brand site. Got Next and Leadly are product interfaces. Trade Moai is a trading interface concept. The names tell you the range. The question for each is what was kept, what was changed, and why.

Look for restraint

Hands typing on a laptop at a wooden desk near a window. It accompanies an article about How to read a studio portfolio.

Restraint is the decision to leave something out. A portfolio that shows it will have a quiet page where a louder one was available, a product with fewer screens than the feature list suggested, a grid that repeats one crop instead of a collage of effects.

You can see restraint in what the page refuses. One type pair, used with conviction. Photography with a consistent subject and crop. A homepage that says what the company is and then offers a way to talk to a person. Wabisabi's public character is calm and tactile. That is a point of view only if the rest of the page obeys it. A calm headline over a frantic layout is an unfinished idea.

Ask what you do not see. A dozen type treatments, three illustration styles, a hero that moves for its own sake. Mixing those is how a product starts to look assembled from downloads. A studio that notices this in its own portfolio is more likely to notice it in yours.

Restraint is also a business choice. A one-page site for a company with one offer shows judgment. The same one-page site for a company with hiring, docs, and a product to buy shows avoidance. Read the restraint against the problem, not as a style preference.

Ask whether they built it

Design and production are often split, and portfolios often hide the split. A beautiful frame might be a Figma file someone else had to survive. Ask, for the projects you care about, who designed them and who wrote the code. If the studio builds, the portfolio should be willing to say so in ordinary language.

Building shows up in details a mock alone does not have to solve. The page at a phone width. The focus state. The way type behaves when a headline wraps. A reduced-motion path when the intended motion would be a problem. A content structure an editor can change without breaking the layout. You will not audit all of that from a thumbnail. You can ask which of it was this studio's work.

A concept is allowed. Trade Moai is a trading interface concept, and labeling it as a concept is the honest move. What misleads is a concept presented as a shipped product, or a shipped product presented as if the studio's only role was the screenshot. The credit line matters as much as the crop.

What a gallery without a decision is for

Curved library shelves packed with books, seen from a balcony. It accompanies an article about How to read a studio portfolio.

Screenshot galleries have a place. They show range and craft in a few seconds. Nielsen Norman Group's research on attention is the reason they are not enough on their own. Jakob Nielsen wrote in 2011 that people often leave a web page in 10 to 20 seconds, and that a page must communicate its value inside that window if it wants longer attention. A gallery wins the window and then owes you the argument.

If the argument never arrives, you have learned that the studio can produce a surface. You have not learned how it chooses. For a hire, the choice is the thing you are buying. The surface is the evidence.

When you look at a project, try a small reading order:

  • What was the constraint, in one sentence you could repeat?
  • What did they refuse to add?
  • What is still awkward, and did they admit it?
  • Did they design it, build it, or both?
  • Would this problem's shape rhyme with yours?

Three projects read this way teach you more than thirty thumbnails.

Taste is real, and it is not fit

You are allowed to dislike the work. A portfolio can be skillful and wrong for your buyer. A stark editorial site is a poor sample if you sell a loud seasonal product, unless the thinking underneath transfers. Separate "I would be proud to send this to a customer" from "this team can solve a problem like mine."

Fit also includes the unglamorous pages. A portfolio of only heroes tells you the studio enjoys the first screen. Your project will include an error, a form, a legal line, a way to edit the price. Ask to see one of those, or ask how they are handled when they are absent from the case.

Selected work is the place to practice this reading on Hanabi's own projects. The selected work on the studio site is a short list with the project names in public. Read it for the problem and the restraint, then decide if the range covers the thing you need built.

Hiring comes after that reading, and it asks a wider set of questions than the pictures can answer. How to hire a design and development studio is the next piece, because a portfolio that passes this test still has to be matched with the people who will do the work and with whether you will own the result.

Frequently asked questions

What should you look for first in a studio portfolio?

The problem, stated before the pictures. Who it was for, what had to survive, and what was failing. If every project is described as a bold new experience, you cannot tell whether your job is in the set. Three projects read for the constraint teach more than a long grid of thumbnails.

How do you tell whether the studio built the work?

Ask who designed it and who wrote the production code, for the projects that resemble yours. Building shows up in phone layout, focus, wrapping type, and a way to edit content. A concept is fair when it is labeled as a concept. A concept presented as a shipped product is the misleading case.

Is a strong visual style enough reason to hire?

Style is real, and it is separate from fit. A skillful portfolio can still be the wrong sample for your buyer. Look for one unglamorous page, or ask how errors, forms, and edits are handled when the case study only shows the hero. You are hiring the judgment, with the surface as evidence.

Sources and further reading

  1. How Long Do Users Stay on Web Pages?, Nielsen Norman Group

Written by

Hanabi

Hanabi is a product design and web development studio. The studio writes about clear websites, brand systems, and product interfaces for founders.

Keep reading

All articles