Layer Block
Beyond the First Impression
We craft digital experiences
with structure, clarity, and purpose.
Layer Block
Beyond the First Impression
We craft digital experiences
with structure, clarity, and purpose.
Case Study Spatial Aesthetics Web Direction 2026

GON Design

Natural Break Interior Design

GON Design
GON Design — Aesthetics of Space & Interior Identity
SCROLL
Project Overview

인테리어 스튜디오 고유의 공간감을 디지털 환경으로 전이시키는 데 주력했습니다. 단순한 시공 사례 나열을 넘어, 실제 공간에서 느껴지는 무드와 비례를 웹사이트의 시각적 리듬으로 재해석하여 설계했습니다.

Client
GON Design Studio
Year
2026
Industry
Interior · Spatial Design
Scope of work
/ Brand Visual Identity / Web UX/UI Design / Motion Art Direction / Content Architecture
Timeline
3 weeks
GON Design Showcase
Design Direction

정적인 이미지를 유연한 시각적 전개로 구현

공간의 흐름을 웹 환경에서 구현하기 위해 스크롤에 따른 화면 전개를 정교하게 설계했습니다. 사용자의 탐색 속도에 맞춰 한 호흡씩 전개되는 비주얼 시퀀스를 통해, 인테리어 작품의 디테일과 현장감이 자연스럽게 전달되도록 구축했습니다.

Visual 1
Visual 2
Visual 3
Layout Strategy

브랜드의 물리적 자산을 디지털로 치환

공간의 시공 과정을 담은 드로잉 스케치와 현장의 질감이 살아있는 고해상도 이미지를 전략적으로 선별했습니다. 단순한 결과물 나열이 아닌, 설계 단계의 '선'과 완공 후의 '면'이 교차하는 시각적 구성을 통해 브랜드의 철학이 화면 너머로 전달되도록 배치했습니다.

Sketch
Visual Motifs

스케치에서 완성까지 이어지는 일관성

드로잉 스케치부터 최종 시공 이미지까지 브랜드의 자산을 체계적으로 활용했습니다. 실제 시공 자재의 질감에서 추출한 컬러 팔레트를 적용하여, 온라인에서도 브랜드 특유의 분위기가 일관되게 이어지도록 설계했습니다.

  • Line-based Foundation건축적 스케치 라인 시스템 적용
  • Architectural Module비례와 정렬 중심의 모듈형 레이아웃
  • Material Palette현장의 질감을 반영한 디지털 컬러 구성
“스크롤의 흐름을 따라 공간의 경험을 완성하다.
— Production Note
Detail

Mobile & Tablet Optimization

Seamlessly transitioning the spatial depth into handheld experiences.
Ensuring every pixel maintains the studio's minimalist aesthetic across all resolutions.

Responsive Design

손안에서 경험하는 공간의 깊이

다양한 디바이스 환경에서도 공간의 무드가 깨지지 않도록 반응형 레이아웃을 정교하게 설계했습니다. 모바일 환경에서는 세로형 콘텐츠 흐름에 최적화된 비주얼 배치를 적용하여, 작은 화면에서도 브랜드 고유의 감성과 작품의 디테일을 온전히 경험할 수 있도록 구성했습니다.

Multi-Device Interface
Mobile UI Detail
Visual Continuity

Handheld Depth of Space
Interaction & Experience

사용자의 스크롤 속도에 반응하는 유연한 인터랙션을 적용하여, 손끝에서 느껴지는 공간의 흐름을 완성했습니다.
작은 화면에서도 브랜드 고유의 감성과 작품의 디테일을 온전히 경험할 수 있는 최적의 뷰를 제공합니다.

Interaction Detail
[Production View] 사용자의 스크롤 속도에 반응하여 유연하게 전개되는 화면 구성.
Key Features
  • 01
    Visual Continuity

    오프라인 공간의 무드를 이어가는 시각적 연속성 확보

  • 02
    Dynamic Sequence

    스크롤에 따른 비주얼 시퀀스로 탐색 몰입감 증대

  • 03
    Architectural Grid

    비례와 정렬을 강조한 정보 중심의 화면 구조

  • 04
    Intuitive Interaction

    사용자 행동에 유연하게 반응하는 인터랙션 설계

GON Design Index 1920
[Production View] 브랜드의 정체성을 담아낸 정적인 인터페이스와 동적 모션의 조화.
Conclusion

공간의 본질을 기록하는 디지털 아카이브 완성.