Case study design examples
181 case study pages from live websites, each credited to the site it came from.
A case study proves the work. The strong ones open with the result, show the problem in one line, then let big images and short captions carry the process instead of long paragraphs.
Below: the strongest 48, including work from obys.agency, dbydt.space, cyphr.studio and adamperlis.com.
Layered Image Stack Hero
obys.agency
Brutalist Case Study Layout
obys.agency
Scroll steps a camera between projects in a 3D point cloud, with a rolling title swap
dbydt.space
Editorial Case Study Hero
cyphr.studio
Tension Logo Case Layout
cyphr.studio
Walkie Project Case Study Layout
adamperlis.com
Case Study Video with Metadata Sidebar
workingstifffilms.com
Project Detail with Full-Width Video
workingstifffilms.com
Bento-Grid Case Study Layout
willphan.com
Data-Aesthetic Triptych Grid
willphan.com
Split-Pane Case Study with Sidebar
willphan.com
Bordered Masonry Brand Grid
willphan.com
Asymmetrical case study with cinematic background and monospaced credits
bittercreek.studio
Scrolling text that splits a liquid video island in two
emmaportner.com
Split-Screen Case Study Hero
mecollective.vn
Blueprint-Grid Case Study Layout
mecollective.vn
Red Split-Screen with Vertical Type
mecollective.vn
Split-screen case study with interactive image collage
quatriemeetage.studio
Horizontal-Scroll Case Study
otherkind.design
Case study with red axis and brutalist grid
bleibtgleich.dev
Mockup-Integrated Case Study Modules
asiaxp.co
Asymmetrical project gallery with monospaced metadata footer
bureaurouge.com
Case study with image-to-UI scroll transition
reformcollective.com
Split-screen layout with fixed contextual sidebar
stagecrew.studio
Scattered card stack with cursor-follow trail
instagram.com
Filterable tabular list with staggered row transitions
rocketweblabs.com
Portfolio Case Study Page
rorystiff.co.uk
Type Oclock Case Study
rorystiff.co.uk
Split Case Study Page
rorystiff.co.uk
Asymmetric Project Case Study Row
poch.studio
Brutalist Case Study — Utopia
noth.in
Edge-Metadata Project Hero
k95.it
Construction Grid Typography Overlay
k95.it
Sellfinity Case Study Hero
johancesar.com
Troostwijk Case Study Hero
johancesar.com
Asymmetric three-column case study with vertical thumbnail navigation
we-go-again.com
Ultra-Condensed Type Case Study Hero
yutaabe.com
Case Study Hero
verteal.com
Framed Case Study Hero
studiofreight.com
Sticker-Effect Case Study Hero
rachelatwork.com
Prime Intellect Case Study Hero
primeintellect.ai
Bento Grid Case Study Carousel
manufactur.co
Project Case Study Layout
magnetism.fr
LV Project Case Study
magnetism.fr
Finlayson Case Study Carousel
hildenkaira.fi
Swiss-style case study with sidebar TOC
hamzaalabou.com
Hub Case Study Cover
componine.com
Case Study Cover with 3D Mockup
componine.com