아임웹 구현 시안 — 쇼룸형 (발주 브리프 반영) 무채색 · 국문 세리프 · 순수 HTML/CSS+바닐라 JS · 2026-07-23
아임웹 기본 · 전체화면 섹션 + 헤더 오버레이
16:9 · 시즌 캠페인 · 원본 이미지 삽입 자리
아임웹 기본 · 텍스트
2025 Autumn

가장 얇은 계절과 가장 두꺼운 계절 사이,
오래 걸쳐 둘 한 벌을 위한 옷.

아임웹 기본 · 2단 섹션
짜임 확대
Material Note · 시그니처

천의 짜임을, 옷보다 먼저.

착장 사진과 별개로 소재를 정면에서 확대한 정사각 컷을 고정 자리로 둡니다. 메인·제품 상세·모바일까지 같은 정사각이 반복됩니다.

그리드 기본마우스오버 전환 · 코드
아임웹 기본 · 페이지 링크목록 수동 추가
Collections

시즌은 지나가도,
아카이브로 남습니다.

판매가 끝난 상품을 내려도 컬렉션 지면은 영향받지 않습니다. 행 전체가 링크입니다.

2025 Autumn
Now on sale · 18 pieces
2025 Summer
Archive · 15 pieces
2025 Spring
Archive · 16 pieces
2024 Winter
Archive · 12 pieces
옵션·재고·결제 기본커스텀 필드 없음 → 표 서식
Product

이미지 64%,
소재·핏·케어를 표로.

정면
봉제 디테일
짜임
2025 Autumn

Wool Single Coat

Art. AW25–014
₩389,000
XSSML
장바구니 담기
소재
이탈리아산 울 92% · 캐시미어 8%. 기모 없이 촘촘하게 짠 멜톤.
어깨선을 살짝 내린 릴랙스 실루엣. 한 사이즈 정핏 권장.
모델
173cm · S 착용
관리
드라이클리닝. 습기 없는 곳에 옷걸이 보관.
아임웹 기본 · 텍스트 + 지도
Store & Contact

쇼룸에서 직접
소재를 만져보세요.

쇼룸 사진 또는 지도
주소
쇼룸 주소를 적어주세요
운영
운영 요일과 시간을 적어주세요
문의
이메일 · 전화번호를 적어주세요
방문
예약 방문 여부를 적어주세요
아임웹 기본 위젯
Instagram
아임웹 구현

각 요소를 아임웹에서
무엇으로 만드나.

시안 요소구현방법
국문 세리프 · 자간 · 줄 간격기본환경설정 > SEO > 공통 코드 삽입 — Header에 폰트, Body에 style로 자간·줄간격 고정
화면 전체를 채우는 캠페인기본섹션 높이 전체화면 옵션
메뉴 오버레이 → 스크롤 시 전환기본헤더 기본 옵션
시즌 컬렉션 · 지난 시즌 보관주의시즌마다 페이지 1개. 목록 자동 축적 아님 → 한 줄씩 수동 추가(연 2회라 부담 낮음)
착장 사진 → 상품 이동기본이미지에 상품 주소 링크
제품 상세 소재·핏·모델주의상품별 커스텀 필드 없음 → 상세설명 상단 표 서식 고정 후 값만 교체
관리법·배송 (전 상품 공통)기본쇼핑 > 환경설정 > 상품 상세 하단 공통 (수정 시 전 상품 일괄 반영)
사이즈 선택 · 재고 · 결제기본상품 옵션 기본 기능
인스타그램 최신 게시물기본기본 위젯
목록 마우스오버 시 2번째 사진코드기본 기능 아님 → 공통 코드로 처리(위 상품 목록에서 시연). 제작 범위 포함
정직 고지 ①

시즌 컬렉션 목록은 자동으로 쌓이지 않습니다. 새 시즌은 한 줄씩 직접 추가 — 연 2회 운영이라 부담은 낮습니다.

정직 고지 ②

목록에서 마우스오버로 착장 컷을 보여주는 건 코드가 필요합니다. 견적의 제작 범위에 포함했습니다.

촬영 컷 가이드 · 첫 시즌 기준

이 톤은 사진이 완성도의 대부분을 결정합니다. 아래 다섯 종을 발주처에서 준비해 주시는 것을 전제로 일정을 잡습니다.

16:9
캠페인시즌당 1컷
3:4
룩북 착장12–18컷
4:5
정면·측면·후면각 1컷
3:4
봉제 디테일품목당 1–2컷
1:1
짜임 확대소재당 1컷