K08 — Components

Built to put the work first.

Every component in PROOF, composed from K07 elements and used unchanged by the demo pages. Switch presets in the sidebar to watch them remix.

01

Navigation

Minimal header with availability and the primary CTA, full-screen mobile menu, sticky contact access and a footer that never hides contact details.

Header
sticky · 5 links max · CTA always visible
Mobile menu
390 · full screen · focus trapped
Mara Lind
Booking from Nov 2026
Start a project
hello@maralind.studio · +49 40 1234 5678
Sticky contact access
mobile · appears after hero
Start a project
✉
☎
Footer
CTA band · email · phone · social · newsletter · legal
02

Hero variants

Five heroes, one formula: positioning in eight words or fewer, one line of proof, primary + secondary CTA, availability. A/B-ready: swap the variant, keep the copy.

1 · Positioning statement
D01 · Editorial
Booked until mid-November
1 → 340 stores for Hofmark*

Identity design for independent food brands.

Selected clients · shown with permission
Hofmark
Kornfeld
Salzwiese
2 · Full-bleed showreel
D07 · pause control

Hold the light.

Reel · 1:52
3 · Contact sheet
D12 · Raw

Ship it.

01A
A
02A
B
03A
C
04A
D
05A
E
06A
F
4 · Editorial cover
Journal, magazines
Cover image · 4:5
Issue 07 · Autumn 2026

The quiet pack.

Why restraint sells on crowded shelves.

Read the story →
5 · Portrait and intro
D06 · About
Portrait in studio · 4:5

I design for food brands.

Hamburg, independent since 2019.

03

Work index

Contact sheet, list with hover preview, gallery and masonry share one dataset and one filter bar. NDA work appears as a card with request access.

List with hover preview
preview trails pointer
09A
Hofmark Dairy
2025
08A
Kornfeld Bakery
2025
07A
Salzwiese Sea Salt
2024
06A
Brühl Coffee
2024
Masonry
mixed ratios · CSS columns
Hofmark · 4:5
Kornfeld · 3:2
Salzwiese · 1:1
Brühl · 3:2
Altes Land · 4:5
NDA card
request access → password page
No. 03A · 2026
Under NDA
Organic baby food · Identity
Request access →
Filters
discipline · industry · year
Discipline
All Identity Packaging Web
Industry
All Dairy Bakery Coffee
Year
All 2025 2024
04

Case-study modules

Intro with metadata, challenge, role and credits, process with proof rounds, before/after, sequences, full-bleed moments, pull quote, results with baseline, stamped testimonial, next project and a contextual CTA.

Intro + metadata
Client · Role · Year · Scope
No. 09A · Case study
Hofmark Dairy: from farm shop to national shelves.
HofmarkIdentity, packaging202514 weeks
Process with proof rounds
v1 → v3 → Final
v1
v2
v3
Final
Final
Client picked v3
Result with baseline
n · what · baseline · period · source
340
Stores stocking Hofmark
Baseline: 1 store · Period: 18 months
Source: client sales data · illustrative
Testimonial with stamp
name · role · company
Approved
“The buyer approved the listing in the first meeting.”
Johanna Hofmann
Co-founder, Hofmark · illustrative
Pull quote
one per case
People trust a farm that doesn’t shout.
Mara Lind
Contextual CTA
ends every case study
Want results like this?
Start a project →
05

Business

Packages with price anchors and inclusions, day rate, process, FAQ, availability calendar, logo wall, awards and press, testimonial wall and CTA band.

Brand Sprint
Direction in two weeks.
From €4.5k
2 weeks
  • Workshop
  • Logo direction
  • Starter kit
Start with this
Day rate
agencies
For agencies & studios
Day rate
€850
Min. 3 days
Process steps
numbered · with timing
  1. 01Wk 1
    Listen
    Call and workshop.
  2. 02Wk 2–5
    Test
    Shelf test.
  3. 03Wk 6–8
    Build
    System and files.
FAQ accordion
details/summary · keyboard native
Who owns the work?

You do, once paid.

How many revisions?

Two rounds per phase.

Availability calendar
booked vs open weeks · honest
W41
W43
W45
W47
W49
W51
W01
W03
Booked
On hold
Open
Logo wall
with permission only
Selected clients · shown with permission
Hofmark
Kornfeld
Salzwiese
Brühl
Altes Land
Awards & press
with year
2025
TDC Certificate
Hofmark
2024
Page Magazine
Profile
Awards and press are illustrative.
Testimonial wall
3–6 quotes · all attributed
“Better questions than any agency.”
Johanna H., Hofmark
“On time, on budget.”
Deniz A., Kornfeld
“The buyer said yes on the spot.”
Tim R., Salzwiese
“Our regulars noticed.”
Ella B., Brühl
06

Personal

Portrait, story, principles, tools, speaking, “Now” and the CV block. See D06 for the full composition.

Portrait
natural, in context · 4:5
Mara at her desk · 4:5
“Now” section
dated · 4 lines
Updated Sep 2026
Designing a cheese range
Teaching at HAW
Booked until mid-Nov
Tools
chips
Figma Glyphs Webflow Pencil
Speaking
date · event · asset
Typo BerlinNov 2026
Food Brand SummitMar 2026
CV block
download · rate · availability
CV & credentials
11 yrs · day rate from €850
Download CV ↓
07

Content

Journal cards and article layout, newsletter with sample issue, link-in-bio block.

Newsletter signup
double opt-in · sample issue
08

Commerce & licensing

Product card, product detail with selectors, cart drawer, checkout summary with VAT and download consent, license tiers and image licensing request. Live in D09.

Product card
ratio · price · rating
Kiosk No. 1
Kiosk No. 1
€38
A3 riso · edition of 50
Variant selectors
size · paper · frame
Size
A4 A3 A2
Paper
Munken Fedrigoni
Frame
None Oak Black
Checkout summary
VAT shown · consent for downloads
Kiosk No. 1, A3€38
Grain Brush Set, personal€14
ShippingFree
incl. VAT€8.30
Total€52
License tiers
personal · commercial · exclusive
Personal
€14
Own art
Exclusive
Quote
Buyout
09

Proofing

Client gallery with selection, counter and limit, comments per image, compare, approval round, final downloads, deadline and pinned annotations for design proofs. Live in D08.

Selection grid + counter
Choose 20 of 64
Choose 20 of 646 / 20
Comment per image
inline · saved
Can we warm this up a bit?
Compare view
two frames side by side
04A
09A
Approval + downloads
round · sizes · deadline
Approved
⏱ Closes 30 Oct · 35 days left
Web Print RAW
Pinned annotations
design proofs
1 2
10

Media

Lightbox with keyboard navigation, captions and camera metadata; showreel player with chapters, captions and pause; filmstrip.

Lightbox
← → Esc · focus trapped
Showreel player
chapters · CC · sound off by default
Poster frame · muted
❚❚ Pause
Sound off
Intro
Rooftops
Night Shift
Credits
0:14 / 1:52 · CC
Filmstrip
scroll-snap · drag · keyboard
No. 01A
No. 02A
No. 03A
No. 04A
No. 05A
No. 06A
No. 07A
No. 08A
11

Overlays & forms

Brief builder (D05), booking calendar, password gate (U04), modal, drawer, toast and cookie consent (U07).

Modal
focus trap · Esc · returns focus
Drawer
cart · filters · right edge
Your cart
Kiosk No. 1 · €38
Password gate
NDA · proofing
Private gallery
Password
Open
Cookie consent
Accept all = Reject all weight