Zellerfeld
흰 대리석으로 만들어진 조각가의 작업실—받침대의 견고한 표면, 코발트빛 한 줄기, 바닥에서 천장까지 이어지는 소문자들의 속삭임
젤러펠드는 마치 하얀 대리석 위에 디지털 조각가들의 작품이 전시된 갤러리 같은 느낌을 줍니다. 3D 프린팅 신발을 판매하는 이 마켓플레이스에서는 단색 표면, 풍부한 여백, 그리고 크고 소문자로 된 서체가 각 제품을 마치 박물관 전시품처럼 돋보이게 합니다. 인터페이스는 극도로 절제되어 있습니다. 무채색 바탕에 강렬한 코발트 색상(#000aff) 하나만이 중요한 순간, 즉 아이콘, 활성화된 "쇼핑" 메뉴, 그리고 현재 슬라이드 상태를 표시하는 데 사용됩니다. 카드는 순백색이 아닌 따뜻한 진주빛 회색 배경 위에 떠 있는 듯한 느낌을 주어, 그리드에 촉각적인 석고 모형 같은 느낌을 더합니다. 서체는 자간이 좁은 맞춤형 산세리프체(Roobert) 하나만 사용되며, Space Mono는 가격, 제품 목록, 그리고 기술 메타데이터에만 사용됩니다. 결과적으로 제품 페이지는 소매점 결제 페이지라기보다는 디자인 전문 웹사이트처럼 느껴집니다. 제품을 판매하는 것이 아니라 사진을 보여주는 공간이기 때문입니다.
페이지는 전체 너비를 차지하며 1440px 너비의 콘텐츠 스트립을 포함합니다. 주요 요소는 플로팅 UI 오버레이가 있는 전체 화면 사진 배너입니다. 제품 섹션은 4열 그리드를 사용하며 태블릿에서는 2열, 모바일 기기에서는 1열로 축소됩니다. 섹션 구성은 다음과 같습니다: 상세 제품 설명 → 에디터 평점 그리드 → 신제품 그리드 → 언론 담당자 연락처 정보 패널. 각 제품 섹션은 스트립 중앙에 콘텐츠를 배치하고 섹션 간에 80px의 세로 간격을 사용합니다. 내비게이션은 한 줄로 고정된 상단 바와 그 위에 얇은 광고 스트립으로 구성됩니다. 제품 카드는 엄격한 그리드에 맞춰 정렬됩니다. 이미지 영역은 항상 신발 실루엣 중앙에 배치되며 카드 내에서 상하로 40px의 여백이 있습니다. 메타데이터 클러스터는 40x40 크기의 브랜드 로고와 함께 왼쪽 하단 모서리에 고정됩니다.
제품 사진은 시각적으로 가장 중요한 요소입니다. 각 신발은 순백색 또는 석고 표면 위에 3/4 각도로 촬영되어 배경, 모델, 기타 요소 없이 카드 전체를 채웁니다. 핵심 요소는 발과 신발을 모래나 콘크리트 위에 놓고 크롭한 라이프스타일 사진입니다. 항상 실제 사람의 크기로 촬영되었으며, 스튜디오에서 완벽하게 보정한 사진은 아닙니다. "주제(피사체)가 핵심 요소"라는 원칙이 적용되어, 메인 편집 요소에서도 신발이 프레임의 보이는 영역 40%를 차지합니다. 장식적인 그래픽 요소, 추상적인 패턴, 일러스트레이션은 사용되지 않습니다. 아이콘은 검은색 윤곽선으로만 표현되며, 채워지거나 색칠되지 않습니다.
팔레트
상표
- Electric Cobalt
#000aff— 새로운 아이콘, 활성 탐색 모음, 현재 슬라이드 표시기, 활성화 순간 등 시스템에서 유일한 색채 단서는 장식이 아닌 활성화 요소로 인식되도록 절제하여 사용됩니다.
중립적
- Pale Iris
#e5e7ff— 배지에 새로운 색상 채우기, 부드러운 하이라이트, 그리고 라벨링 옵션에 은은한 코발트 색조를 더해 단색 팔레트를 해치지 않으면서도 색감을 살짝 가미했습니다. - Ink Black
#111111— 본문 텍스트, 기본 테두리, 아이콘 윤곽선, 얇은 구분선 - 제목, 목록 및 링크에 사용되는 주요 구조적 색상입니다. - Pure White
#ffffff— 색상은 중립적인 형태, 아이콘 텍스트, 그리고 눈에 띄지 않는 UI 피드백에 사용하여 은은하게 표현해야 합니다. 행동 유도 버튼의 주요 색상으로 색상을 사용하는 것은 피해야 합니다. - Plaster
#ecedee— 제품 카드 및 탐색 모음 배경을 위한 보조 표면으로, 캔버스 위로 매끄럽게 솟아오른 영역입니다. - Slate
#a1a4aa— 카드 프레임의 색조, 버튼의 채색, 그리고 테두리의 색상은 회색 계열로, 카드의 가장자리를 어둡게 하지 않으면서 강조하는 효과를 줍니다. - Fog
#d7d7d7— 밝은 카드 프레임, 구분선, 비활성 표면의 색조 처리.
타이포그래피
13픽셀에서 128픽셀로 · 7단계
- Roobert — 대사: Inter · 요점 400, 500, 600, 700 · 브랜드의 주요 폰트는 본문부터 헤드라인까지 모든 곳에 사용됩니다. 줄 간격은 모든 크기에서 동일하여 로고의 소문자가 밀도 있고 입체적인 형태를 띠도록 합니다. 폰트 두께는 맥락에 따라 달라지는데, 본문 및 UI에는 400, 강조된 제목에는 500, 제품명에는 600, 큰 제목에는 700을 사용합니다.
- Space Mono — 대사: JetBrains Mono · 요점 400, 600 · 기술 메타데이터(가격(€189.00), 상위 10위 순위의 수치, 티커 기호 및 매장 이름)는 페이지가 홍보성 텍스트가 아닌 기술 사양으로 인식되어야 하는 부분에 추가됩니다.
- Arial — 대사: Inter · 요점 400 · Arial - 추출된 데이터에서 발견되었지만 AI가 설명하지 못했습니다.
간격과 형태
| 목적 | 의미 |
|---|---|
| 밀도 | 평균 |
| 기본 단계 | 16px |
| 버튼 반경 | 10px |
| 카드 반경 | 10px |
| 그림자 | 최소한의 |
| 구간 사이 | 80px |
| 페이지 너비 | 1440px |
AI가 Zellerfeld 스타일로 웹사이트를 구축하고 내용을 채워줍니다.
- 제품 및 게시물을 링크를 통해 Instagram, TikTok, Facebook 에 올려주세요.
- 이전 사이트의 콘텐츠를 전송하세요. 주소만 지정하면 됩니다.
- 최신 디자인과 최고의 엔진인 React ( Next.js)를 기반으로 서버 렌더링 및 SEO 최적화 기능을 기본 제공합니다.
- 검색 결과 최적화 및 신경망 기반 추천 기능을 완벽하게 자동화했습니다.
비슷한 스타일
- Airbnb — 산호색 책갈피 하나가 놓인 조용한 흰색 갤러리 벽
- Apple (España) — 흰색 갤러리 디스플레이 케이스
- Silencio — 하얀 방 안에는 떠다니는 유물들이 놓여 있다. 따뜻한 색감의 종이로 만들어진 전시 공간은 각각의 요소들이 음영 배경 위에 자리 잡고 있으며, 이러한 침묵은 의도적인 디자인 요소이다.
- Oakâme — 따스한 돌로 지어진 햇살 가득한 프로방스풍 작업장
- Nike — 흑백으로 표현된 스포츠 업적 갤러리 – 흰 벽, 예술 작품으로서의 제품, 배경에 녹아든 크롬 소재
- Arc — 한밤중의 물 위로 펼쳐진 산업적인 흰색 갤러리
- Rivian — 갤러리 콘크리트 벽 위에 세워진 전기 모놀리스. 리비안은 각각의 차량을 광활한 흰색 공간을 배경으로 한 조각품처럼 전시하며, 건축적 요소처럼 보이는 거대한 타이포그래피와 무광택 표면에 비치는 햇빛처럼 단조로운 분위기를 깨뜨리는 따뜻한 노란색 한 줄을 더했다.
- Analogue — 검은색 갤러리 진열장 – 상품들이 허공에 떠 있는 듯하다
- ddna — 가공하지 않은 린넨 소재의 따뜻한 박물관 전시 케이스
- UY Studio — 수도원의 석조 복도는 콘크리트 벽으로 둘러싸인 조용한 공간으로, 흰색 받침대 위에 향수병들이 놓여 있고, 400와트 램프 하나와 따뜻한 회색 전구 네 개가 그 공간을 밝히고 있다.
- Basic.Space — 흰색 대리석으로 꾸며진 큐레이터 갤러리
- COS — 흰 벽으로 꾸며진 트렌디한 갤러리