Every Piece of Case-Study Media Needs a Job

In April I rebuilt several Work entries around their actual artifacts: product screens, prototype footage, research documents, and the registered German utility-model publication for the Ski Bike Rack.

The first instinct was to make the pages richer by adding everything available. That produced a more useful lesson: a case study is not improved by the number of assets it contains. It improves when every asset answers a question the prose cannot answer as efficiently.

Evidence before decoration

A useful case-study image should do at least one of four jobs.

1. Show the thing in context. A product screen proves that a described flow exists as an interface rather than only as a feature list.
2. Reveal a decision. Two iterations can make a layout, mechanism, or interaction trade-off visible.
3. Expose the underlying work. A prototype, research poster, or document can show the engineering and validation behind a polished summary.
4. Orient the reader. A restrained hero image can establish which product or phase the next section discusses.

If an image only repeats the heading, it is usually taking space away from the story.

That distinction matters on a portfolio because attractive media can easily overstate maturity. A render is not a manufactured product. A prototype is not a clinical result. A registry publication is not the same thing as an examined patent grant. The caption and surrounding copy need to say what the artifact actually is.

Mixed media needs one layout grammar

The Work pages combine landscape screenshots, portrait app views, videos, logos, and PDFs. Treating all of them as interchangeable rectangles caused the usual problems: cropped interfaces, oversized whitespace, controls escaping their frame, and masonry gaps that made unrelated assets look grouped.

The solution was not one universal aspect ratio. It was a small set of explicit presentations.

• Interface screenshots can use object-contain when every pixel matters.
• Editorial crops can fill a frame when the composition remains honest.
• Portrait screens can be padded into a landscape presentation without cutting off navigation or data.
• Video controls need a stable box that does not scale outside its container.
• Documents should stay documents, with a clear link or embed rather than a screenshot pretending to be the source.

The outer grid can still feel consistent. Consistency comes from spacing, borders, captions, and rhythm—not from forcing every artifact into the same crop.

Captions are part of the evidence

An unexplained screenshot asks the reader to reverse-engineer its relevance. A good caption names the artifact and the reason it is present.

That can be short: “candidate upload flow,” “bench prototype,” or “registered utility-model publication.” The wording should not smuggle in conclusions that the image does not establish.

Alt text has a different job. It should describe the meaningful visible content for someone who cannot see the image, not copy the marketing caption or stuff in every keyword on the page. When a complex chart or document matters, the nearby prose still needs to carry the conclusion.

The story determines the gallery order

I also stopped treating the gallery as an obligatory hero section.

Some pages need an artifact early because the product is hard to picture. Others read better when the problem, responsibility, and decisions come first, with the full gallery at the end as supporting evidence. The Boop page now uses that latter order; the Hir3d and XAMS entries use media to explain specific product flows.

There is no universal portfolio template at the section level. The shared layout provides typography and rhythm, while each case study earns its own sequence.

What I kept

The durable rule is simple: before adding an asset, finish the sentence “this is here to show…”

If the answer is vague, the asset probably belongs in an archive rather than on the page. If the answer contains a claim, the caption and prose must keep that claim within what the artifact can prove.

The current Hir3d case study, Biosensors project, and Ski Bike Rack utility-model page use different media, but they now follow that same evidence-first rule.