All work
Studio · Legal · 2026 Brand · Web · 2026

HALL & ROARK.

Concept identity and site for a fictional solo trial attorney in Kansas City. Complex commercial litigation. Fixed-fee where possible.

01 Brief

Imagined client: a solo trial attorney with 15 years in commercial litigation, recently broken off from a mid-size firm. Selling against the boilerplate "skyscraper photo + scales of justice" sites every other firm ships. The brief is to make the website feel like reading a closing argument — confident, direct, no padding — and to convert the kind of client who read two paragraphs and realizes they're talking to a real human, not a brand.

02 Approach

Stripped everything decorative. Stark typography hierarchy doing the work no image was going to do. A process timeline rendered as a semantic ordered list with date stamps. A lead-capture form that asks two questions instead of twelve. No hero image — the headline is the hero. Oxford-blue and oxblood on bone. The whole site reads like the inside of a serious-press hardcover, not a brochure.

03 Outcome

Professional skeleton at maximum restraint. Proves Nucifera's house aesthetic *can* dial down — that brutalist doesn't always mean black backgrounds and screaming type. Sometimes it means knowing what to leave out. Loads in 600ms; readable on a courthouse hallway 4G connection; Lighthouse 100.

02 — The system

Aesthetic system.

fig. ii · palette + type
A Palette
Oxford
#0F1F3A
primary
Bone
#E8E2D5
paper
Oxblood
#5A1A1F
accent
Brass
#B89968
secondary
Parchment
#D6CDB8
neutral
B Typography
Display
Tiempos 400
Body
Söhne 400
Accent
Tiempos 400 italic
C References
  • Princeton Architectural Press book interiors
  • 1990s trial-magazine covers
  • Cooper Black, used sparingly
  • Old courtroom transcripts
  • Legal-pad yellow as a forbidden color
04 — Under the hood

Technical notes.

fig. iv
  • 01 No hero image. The headline is the hero. Saves ~600KB on first paint.
  • 02 Process timeline is a semantic <ol> with numbered list-style and CSS counters — no DIVs pretending to be steps.
  • 03 Lead form posts to a SvelteKit action with two fields: "What's the situation?" and "How can we reach you?" — that's it.
  • 04 No third-party scripts. No analytics. No chat widget. The entire page is HTML, CSS, and one form.
  • 05 Print stylesheet ships by default — attorneys actually print things.
Web build on the professional skeleton. · Disciplines: brand · web.
05 — Keep looking

More work.

fig. v