Internal preview · pick a winner

Nel404 Labs — Demo Bake-off

Three visual directions for the umbrella site. Same content, same case studies, same services. Different attitude. Click a card to view the full demo, or scroll for notes.

Demo A

Studio dark

Premium dev-tool aesthetic. Gradient mesh, glass nav, scroll progress, Inter + JetBrains Mono. Reads "they probably charge well."

darkgradientglasstech-forward

n4-demo-a.devcp1.nel404.co.za

Demo B

Editorial light

Magazine-grade. Fraunces serif headlines, deep red accent, drop caps, full-bleed photography. Reads "considered, slow, expensive."

lightserifeditorialcraft

n4-demo-b.devcp1.nel404.co.za

Demo C

Workshop terminal

Indie hacker, monospace-heavy, terminal prompts as section headers, ASCII dividers, electric green accent, typing-effect hero. Reads "this person ships."

monoterminalindiewitty

n4-demo-c.devcp1.nel404.co.za

Demo D

Dark workshop + editorial logo

Crossover. Demo C's terminal structure on near-black. Logo 1 (serif N + red 4 + dot) in nav. Trimmed case-study copy applied, no process oversharing.

darkmonologo-1trimmed-copy

n4-demo-d.devcp1.nel404.co.za

Demo E · LATEST

Hyperframes cyan + scroll-rail

Demo D structure on the Hyperframes palette. Cyan #8FE8FF + deep navy #07111e + comet scroll-rail. Logo retinted: cyan 4, orange dot. Owner-loved blue.

cyanhyperframesscroll-raillogo-retinted

n4-demo-e.devcp1.nel404.co.za

How to review

Open each demo in a new tab. Click around — every page works (services, work index, 4 case studies, about, contact).
Same content in all three. Compare attitude, not detail.
Mobile: open on phone too — terminal demo gets the most pressure on small screens.
Pick a winner OR mix (e.g. "B's typography on A's palette"). I will iterate.

What's not in any demo yet

Real screenshots — placeholders only. Will swap when we have them.
Testimonials — placeholders.
Final logo lock — each demo has a different mark for now.
Formspree form ID (currently PLACEHOLDER) — owner swaps.
Custom domain — these run on dev subdomains. Cutover to nel404labs.co.za happens when CIPC + Cloudflare propagation are done.

Docs & assets

Logo gallery — 6 designs incl. the editorial keeper, full-size SVG downloads.
Review & rewrites — case study trim, work-tab restructure, crossover-demo spec.
Original site plan — sitemap, case study list, copy drafts.
Build brief: /root/nel404labs-brief.md on .96.