Mastering Editorial Motion, Swiss Grids Meet WebGL Geometry
Corentin Bernadou’s portfolio is a masterclass in editorial web design and technical craft. It marries Swiss-inspired grids with subtle WebGL geometry, creating depth without clutter. The site balances experimental 3D visuals and clear 2D typography with rare elegance. Micro-interactions like the navigation mask and interactive rulers give the interface personality and utility. The case study walks through concept, design, and implementation with disciplined clarity. Developers will appreciate the vanilla JavaScript approach, modular SCSS, and Three.js plus GSAP pipeline. Its restrained palette and typographic rigor make every element read with purposeful clarity across every viewport. Subtle motion ties it all together beautifully.
Branders and creatives will find gold in the process notes, sketches, and motion rationale. The author explains trade offs, iteration cycles, and practical tooling decisions in approachable detail. Examples include grid rules implementation, PJAX routing, and the cursor driven navigation mask. Videos and code snippets make the techniques easy to visualize and reproduce. This case study is both inspiration and a technical guide, useful for senior designers and hands on developers. Dive in to learn how precision and playfulness can elevate a portfolio, and to gather ideas for your next redesign. Open it for replicable patterns and confident execution today.
Source: tympanus.net
