Photography

Art Direction

Photography must reinforce the brand’s core tension: authority earned through experience, not theory. Brett is not posed like a stock-photo consultant. He is photographed like a subject — someone who has been on the other side of every investigation.

Shot Categories

Hero Portraits (Primary)

Used above-the-fold on the home page and speaker kit.

• Lighting: High-contrast. One hard key light, minimal fill. Deep shadows are acceptable.
• Background: Dark, minimal. Brick wall, dark studio, or near-black gradient.
• Expression: Direct eye contact with camera. Neutral to serious — not smiling for the camera.
• Framing: Head and shoulders or three-quarter body. Never full-body in a suit.
• Color treatment: Deep blacks, slightly desaturated. Let the red accent in the UI frame the image.

Speaking Photos (Event)

Used in press appearances, social proof sections.

• Candid on-stage or approaching the podium
• Capture the room if possible — audiences signal authority
• Avoid low-quality cell phone shots from the crowd
• Minimum resolution: 2400px on shortest side

Media / Interview Stills

Used in the press / media section.

• Broadcast-quality preferred (CNN, BBC screencaps with credit)
• Must have associated publication permission for use on site
• Alt text format: Brett Johnson speaking with [Publication], [Year]

Technical Requirements

Property	Requirement
Minimum resolution	2400 × 3000px (portrait)
Format	JPG (delivery), RAW (archival)
Color space	sRGB (web delivery)
Hero image file size	< 400KB after WebP conversion
CDN storage	Cloudflare R2 → served via cdn.brettjohnson.xyz

Image Optimization Pipeline

All hero images are converted to WebP at build time using Next.js <Image>:

import Image from 'next/image';

<Image
  src="/brett-hero.webp"
  alt="Brett Johnson — cybersecurity keynote speaker"
  width={640}
  height={800}
  priority
  quality={85}
  className="object-cover"
/>

• Always provide alt text.
• Set priority on above-the-fold images to prevent LCP regression.
• Use sizes prop on responsive images.

What to Avoid

• Smiling “headshot” poses — too corporate, undermines credibility
• White or bright backgrounds — contradicts the dark brand aesthetic
• Stock-style imagery (handshakes, laptops, binary code overlays)
• Red-eye or flash photography
• Images where Brett is not the clear subject