Oddcommon

www.oddcommon.com

a digital-experience studio that builds its homepage like one of its products, a fixed, gridded "operating system" screen on an off-white grain canvas, where an iridescent 3D ODC logo, a big Roobert headline, a single yellow block and live Mux video tiles sit inside hairline-ruled frames and move with spring physics.

Creative Studio Digital Experience Studio strong

Design tokens

ink

black

blue

yellow

grey

paper

white

display: Roobert
body: Roobert
mono: none
label: GT Flexa

Do / Don't

Reference it for

Treating a homepage as a fixed, gridded interface rather than a long scroll, hairline-ruled panels as the layout system.
Spring-physics motion via linear() easing, weighted, physical movement that reads as "crafted software".
A constant film-grain overlay as a cheap, distinctive texture over flat colour.
Extreme colour discipline: near-black + one link-blue + one yellow, nothing else.
Live video tiles (Mux) as the work showcase, embedded in the grid.

Do not copy

The iridescent glass ODC monogram is the brand; borrow the idea of a 3D/material logo, not the mark.
Roobert and GT Flexa are licensed; map to a similar grotesque + variable display.
A fixed single-screen interface only works with this much craft and a small amount of content; for a content-heavy client it fights the brief.

Signature moves

fixed gridded operating-system homepage

the homepage is a fixed, gridded interface (an operating-system screen) on an off-white grain canvas, with hairline-ruled panels holding a headline, a single yellow block and live Mux video tiles rather than a long scroll.

spring-physics linear() motion + grain overlay

motion uses linear() spring easings (a slow ~0.6s and a fast ~0.7s curve) for weighted, physical movement that reads as crafted software, over a constant film-grain overlay as cheap distinctive texture.

extreme colour discipline

near-black plus one link-blue (#0000ee) plus one yellow and nothing else, with live video tiles supplying motion.

Related references

Mccarthy Building Companies

flagship

Other

A 100+ year, employee-owned national commercial builder that projects quiet authority at scale - full-bleed video and aerial photography of real megaprojects, oversized condensed type ("SUPERIOR RESULTS", "WE CAN BUILD IT"), a single bold red accent, and clip-path scroll reveals that feel cinematic but never showy.

Supersolid

niche

Creative Studio

The reference for Sydney creative-agency portfolios - near-black canvas, single-headline hero with a tiny "Scroll to explore" indicator, then a tile-grid case study reel and a chromatic-aberration ROIdeas display moment.

Abhishek Jha

niche

Design Portfolio

Indian designer personal portfolio - 4-font system (DM Sans + thunder + editorial + playground), 17-step scale up to 288px, dark plum + pink palette, 9-keyframe marquee/cloud motion.

Alejandro Mejias

niche

Design Portfolio

A Melbourne solo UX designer's Framer-built portfolio in a brutalist bracket-wrapped monospace voice - black-on-white chrome punctuated by a single neon-yellow accent, dotted-grid hero, and full-bleed yellow about page.