This website, treated as a product
Server-rendered Next.js with a token-based design system, CSS-driven motion and strict security headers. We run our own analyzer on it: 94/100, no high-severity findings.
The problem
A studio site is the one project every visitor inspects closely. It has to show the same discipline as the work it describes.
What we built
React Server Components by default, with client code limited to navigation, the contact form and a handful of interactions. Motion runs in CSS on transform and opacity, and stops under reduced motion.
Decisions, and why
No scroll hijacking
Native scrolling stays native. Reveals use one IntersectionObserver and a CSS transition, and content is visible without JavaScript.
One signal color
Ink carries the primary action; orange marks state and focus only, so it keeps meaning something.
Headers before features
A strict Content Security Policy, HSTS and frame denial ship on every route.
Scope
- Design tokens for type, color, radius and motion
- JSON-LD for organization, website, breadcrumbs and case studies
- Contact form with server-side validation and a honeypot
Inspected with our own tool
$ sb analyze on this website
94/100
- 0
- 33
- 114
- ~120 ms
- Security100
- Imports100
- Environment100
- Performance100
- Architecture99
- Dependencies96
- Complexity64
Between the first run (90) and this one: removed 4 unused dependencies, 15 unused exports and 2 dead files it reported.
- 30 page components longer than Atlas's function-size threshold. Pages are long JSX by nature; we accept this one.
- 2 dependencies only referenced from CSS (tw-animate-css, shadcn). A TypeScript scan cannot see them; they are used.
- 1 file not imported anywhere: the shelved 3D island prototype, kept on purpose and listed in Labs.
Recorded from the real JSON output. What Atlas checks
