PureStructure is built for architecture practices who want a site that looks drawn rather than assembled.
The concept is the drafting table. An ink-dark canvas with a hairline measurement grid behind the hero. Dimension lines with tick ends. Monospace annotations for location, year and typology. One blueprint-cyan accent, used only where it earns attention. Every radius is 2px: precision, not softness.
The hero is a sequence, not a static banner. The grid fades in and drifts on a slow mirrored loop. The headline assembles line by line out of a blur on spring physics. A dimension line draws itself in beneath it. The photograph scales open inside a masked aperture, then drifts on parallax as you scroll. On mobile it simplifies rather than shrinks: loop, parallax and character animation all switch off.
Eleven pages are built and connected: Home, Studio, Services, a filterable project archive, CMS project detail, Journal, CMS article, Contact, Privacy, Imprint and a custom 404.
Six CMS collections come fully populated, with realistic written content instead of lorem ipsum. Project detail pages carry a metadata rail for location, year, area, client and status, plus a gallery and a next-project link.
Motion earns its place: staggered scroll reveals, a sticky process section, hover gesture variants that zoom the image and flip the arrow as one, a client marquee, digit-by-digit stat reveals, and a contact form with real pending, success and error states. Reduced motion is respected at the root.
Everything is editable: three breakpoints with desktop as master, seven reusable components, eleven colour tokens, nineteen text styles, one shared nav and footer template with a mobile drawer that closes on tap, and named layers throughout. No custom code, 100% native Framer.
PureStructure is built for architecture practices who want a site that looks drawn rather than assembled.
The concept is the drafting table. An ink-dark canvas with a hairline measurement grid behind the hero. Dimension lines with tick ends. Monospace annotations for location, year and typology. One blueprint-cyan accent, used only where it earns attention. Every radius is 2px: precision, not softness.
The hero is a sequence, not a static banner. The grid fades in and drifts on a slow mirrored loop. The headline assembles line by line out of a blur on spring physics. A dimension line draws itself in beneath it. The photograph scales open inside a masked aperture, then drifts on parallax as you scroll. On mobile it simplifies rather than shrinks: loop, parallax and character animation all switch off.
Eleven pages are built and connected: Home, Studio, Services, a filterable project archive, CMS project detail, Journal, CMS article, Contact, Privacy, Imprint and a custom 404.
Six CMS collections come fully populated, with realistic written content instead of lorem ipsum. Project detail pages carry a metadata rail for location, year, area, client and status, plus a gallery and a next-project link.
Motion earns its place: staggered scroll reveals, a sticky process section, hover gesture variants that zoom the image and flip the arrow as one, a client marquee, digit-by-digit stat reveals, and a contact form with real pending, success and error states. Reduced motion is respected at the root.
Everything is editable: three breakpoints with desktop as master, seven reusable components, eleven colour tokens, nineteen text styles, one shared nav and footer template with a mobile drawer that closes on tap, and named layers throughout. No custom code, 100% native Framer.
Noel Dario Andres
