Project / 2025
Arken
A website for a modular architecture company, built around project photography and a responsive layout.
- My role
- Design & development
- Tools
- React · TypeScript · Next.js · Tailwind CSS · Motion
- Year
- 2025
About the project
Arken presents modular homes through large photographs and project information. I designed the page structure in Figma, covering the homes, the building process and contact options.
The Next.js implementation uses a responsive grid for the content. Photography leads the presentation, with short fades and position changes as sections enter the viewport.
Design decisions
A responsive project grid
CSS grid changes the arrangement of photos and text at different screen widths. The same content supports the mobile and desktop layouts.
Consistent section transitions
Sections share timing and easing values. A short stagger separates their entrances as the page scrolls.
Giving photographs space
The opening section gives the homes most of the visual space. Responsive image sizes let the browser request smaller files on narrow screens.
From prototype to browser
The Figma prototype guided spacing and interaction during implementation. The site uses static images for the project previews.