Skip to content
Career & process

Portfolio pieces that get you hired

Hiring designers and developers do not want to see everything you made — they want to see you make one decision well. The motion-spec case study that interviews better than any other format, and how to build one.

Intermediate2 min read (computed · recorded 10)updated 2026-09-10portfoliocareercase studymotion

What a hiring designer actually screens for

A portfolio review is a search for evidence of three things: taste (do the decisions hold together), judgement (are the decisions justified by constraints), and resilience (are the failures documented). Screenshots prove taste weakly — anyone can polish a still. What interviews best is the *spec*: a document that shows a problem, the considered options, the chosen solution and the trade-off, because a spec is a decision made visible, and hiring is a search for good decision-makers.

the-winning-format.md
MOTION-SPEC CASE STUDY (2 pages, 6 minutes of reading)

1. The moment     one screen, one interaction, named
2. The problem    the default felt wrong — and why
                 ('the modal appeared but nothing said where
                  it came from')
3. The options    2-3 real alternatives with their trade-offs
4. The spec       timing table + easing curves + reduced
                 motion branch — buildable by a developer
5. The evidence   before/after or a run log; what users said

Why the motion spec wins

A motion spec compresses more signal per page than any other format. It proves you can name a feeling as parameters (durations, curves, ranges — the language of implementation). It proves you thought in systems (a reduced-motion branch is a system thought; a pretty hover is not). And it gives an interviewer something concrete to talk about: 'why 300ms and not 200?' is a question every good spec answers in advance, and the interview becomes a conversation about your decisions instead of small talk about your tools.

  • One deep piece beats ten shallow ones: a hiring manager would rather read one spec that shows a full decision than a grid of case studies that each stop at the screenshot.
  • Show the failure frame: the version that did not work, with the note on why it did not — resilience is the trait portfolios lie about most and evidence proves best.
  • Ship the code: a link to a runnable page or repo beats an embedded video — the reviewer who can open devtools is the reviewer who can hire you.
  • Write for the skim: headings carry the argument; a reviewer spends ninety seconds on the first pass, and the spec should survive that ninety seconds intact.

Words this guide uses that the glossary defines: Run log

Practise the lesson

Theory sticks when you ship it. These original Motif assets put this guide's lesson to work — open one and copy it into your own page.