Two categories.
Almost every image in the brand belongs to one of two families. Each has its own job, its own lighting brief, its own backgrounds. We don’t blend them and we don’t reach outside them.
Family 01
Product imagery
The hardware itself, rendered as a high-resolution 3D object. Used on landing pages, plan tiles, hardware specs, and onboarding checklists. Always literal — never a flat icon, never a stylised shape.
Family 02
Customer photography
Real merchants in their own venue, hands on the hardware. Used in case studies, the homepage, segment pages, and editorial. Always in situ — never stock photography, never staged in a studio.
Product imagery.
When we show the hardware on its own — terminals, registers, kits — we always render it. The renders are sharp, lit consistently, and honest about what the product actually is. The shape is the message.
Principles
Principle 01
3D, never flat
Every product image is a high-resolution 3D render. No flat icons, no stylised drawings, no pastel cartoon terminals. The proportions are real, the buttons are labelled, the screen runs the actual UI.
Principle 02
One light, one shadow
A single soft top-left key light, a soft floor shadow. No rim lights, no neon glow, no synthetic studio rigs. The render reads like an honest catalogue shot, not a hero film frame.
Principle 03
Quiet backgrounds
Deep neutral charcoal, off-white, or a single pastel brand surface. Backgrounds carry tone, not pattern. No gradients across the spectrum, no abstract geometry, no hardware floating in space.
Gallery
The current approved set. Each render arrives in a dark and a light edit; pick the one that fits the surrounding surface.
Premium POS · Charcoal
The hero hardware shot. Lit top-left, drawn from the customer's perspective. Use against dark surfaces and on the homepage hardware band.
Pro POS · Charcoal
Pro POS, mid-tier. Same lighting brief, framed three-quarter so the stand reads as part of the silhouette.
Premium POS · Kit
The bundle. Use when the surface needs to communicate scope (a plan tile, an order summary) rather than a single device.
A920 Pro · Lemon
The handheld, on a single brand surface. Pastels are allowed when the colour carries the message — never decorative, never gradient.
A920 Pro · Type lockup
When type does the heavy lifting. The hardware sits in front of the message; the message doesn't sit on top of the hardware.
Where the renders come from
Source files live in the brand assets repo under brand/hardware/3d/. Each device ships with three approved framings (front, three-quarter, kit) and two background variants (charcoal, light). Don’t re-render hardware locally — pull from the approved set.
Customer photography.
When we show the product in use, we show it in the merchant’s own venue. The kitchen pass, the salon counter, the florist’s workbench. No studio, no models, no green-screen storefront. The customer is the hero; the hardware is in the background, doing its job.
Principles
Principle 01
Real merchants, real venues
The person in the frame runs the business. The room they're standing in is the room they work in. We license shoots from actual customers and we credit them by name where the surface allows it.
Principle 02
Hands and hardware
The composition leads with hands — placing flowers on a scale, plating a dish, ringing through a transaction — and the terminal sits inside that gesture. The product is part of the work, not the subject of the photo.
Principle 03
Available light
Daylight, ambient venue lighting, on-camera fill at most. No softbox rigs, no flash, no colour grading toward a brand hue. The image keeps the venue's own colour temperature.
Gallery
A sample from the licensed set. Each shoot delivers wide, mid, and tight crops so the same venue can carry a section header, a tile, and a quote portrait.
Hospitality · Kitchen pass
The mid-shot template — two people, the venue's own light, hardware visible on the counter without dominating.
Beauty · Salon counter
The venue-led shot. The hardware sits in its real place of work; the salon's own surfaces and tools fill the rest of the frame.
Retail · Florist
The gesture-led shot. The hand, the bouquet, and the screen are all in frame; the action and the product are inseparable.
Where customer photos come from
Approved customer shoots live in the brand assets repo under brand/photography/, sorted by industry. Every image has a signed release on file. If you need a venue we don’t already have, brief it through the Brand Studio Notion before commissioning — we don’t use stock even as a placeholder.
Treatment.
Both families share the same downstream rules so the page composes cleanly when the two appear next to each other.
- Aspect.4:3 by default, 1:1 for tile crops, 5:4 for hero bands. Don’t crop tighter than the principle composition — the venue or the product needs room.
- Corners. Always
rounded-2xl(16 px) inside the layout. Sharp corners are reserved for full-bleed editorial sections; never mix the two on the same page. - Borders.A 1 px tinted border around every tile so light renders don’t lose their edge against an off-white surface. No drop shadows, no glow, no inset highlights.
- Captions. Use the
.eyebrowutility for the label and a single sentence beneath. Captions describe what the image is, not what to feel about it. - Alt text.Describe the subject and context. For product renders, name the device. For customer photos, name the venue type. Skip the word “image” — the screen reader already knows.
Do and don’t.
The right column is what the lab refuses to ship. Every counter-example here has shown up in a draft at some point.
A high-resolution 3D render on a quiet brand surface. The product reads as itself — proportions, materials, screen, all literal.
A flat illustration of the terminal — even a tasteful one. It softens the product into a cartoon and breaks the trust the renders are built on.
A licensed customer in their own venue, hands on the work. The terminal is part of the gesture, not the subject of the frame.
Stock photography. The grinning headset agent, the gradient backdrop, the no-place office. None of it tells the merchant we mean them.
Asset workflow.
Imagery is a curated set, not a library you contribute to in passing. Three steps to get an image into a Flatpay surface.
- 1Open the Brand Studio Notion and look in Images → Approved set. If what you need is there, copy the file ID from the asset row and pull it from the brand CDN. Don’t re-host or re-export.
- 2If it isn’t there, post a request in
#brand-studiowith the surface, the size, and what the image needs to communicate. The studio will either point at an existing variant or schedule a shoot. Stock and AI imagery are not options. - 3Use
next/imagefor every photo and render. Setwidthandheightto the source dimensions; let Next handlesrcsetand lazy loading. Always pass analtthat names the device or the venue.
Related.
Page history
1 revision- DocumentedDerek Fidler@derekfidler
First documented version. Two-category model — product imagery (3D, never flat) and customer photography (in-situ, never stock) — pulled from the brand Notion.