왜 인테리어 홈페이지는 ‘공간’과 ‘전후’에서 출발하는가
인테리어 홈페이지 제작에서 가장 먼저 푸는 문제는 디자인 취향이 아니라 불안입니다. 리모델링을 의뢰하는 사람은 대부분 처음이고, 머릿속 그림이 ‘사진과 다르게 나오면 어쩌나’를 가장 두려워합니다. 그래서 이 페이지는 “이 스튜디오는 결과를 보여준다”를 0.3초에 전하는 것을 1번 목표로 잡았습니다. 멋있는 비주얼 한 장보다, 바뀐 공간을 직접 비교하고 만져보게 하는 것이 먼저입니다.
색: 따뜻한 콘크리트와 월넛, 절제된 포레스트
바탕은 차가운 흰색이 아니라 따뜻한 콘크리트 오프화이트(#f3efe9)입니다. 흔한 인테리어 사이트의 새하얀 배경은 깨끗해 보여도 차갑고, 정작 시공 사진의 우드 톤을 죽입니다. 그래서 종이처럼 미색이 도는 바탕(#fbf9f5)을 카드 표면으로 깔아 사진이 따뜻하게 앉도록 했습니다. 포인트 색은 월넛 우드(#9a6b43)와 깊은 포레스트 그린(#28433a) 둘뿐입니다. 우드는 자재의 질감을, 포레스트는 견적·CTA 버튼에서 ‘결정의 색’으로 절제해 써서, 화면 어디서도 색이 사진을 이기지 않게 했습니다. 군더더기를 비우고 본질을 채운다는 콘셉트 그대로, 색도 비웠습니다.
타이포: 명조의 결, 산세리프의 가독
헤드라인에 고운바탕(명조 계열 세리프)을 쓴 건 우연이 아닙니다. 명조의 부드러운 획은 여백을 살린 공간, 그리고 손으로 다듬은 자재의 결과 정확히 맞습니다 — 두껍고 각진 고딕은 가구 광고처럼 보이고, 명조는 ‘짓는 사람’의 태도를 전합니다. 본문은 Pretendard로 가독성을 확보해, 분위기와 읽기 편함을 동시에 잡았습니다. 자간을 살짝 좁히고 줄바꿈을 어절 단위로 묶어, 한글이 음절 중간에서 끊기지 않게 조판했습니다.
Before/After 슬라이더 — 이 페이지의 심장
인테리어에서 가장 강력한 설득은 ‘말’이 아니라 ‘전후’입니다. 그래서 가운데 손잡이를 좌우로 미는 Before/After 슬라이더를 시그니처 인터랙션으로 넣었습니다. 어두운 몰딩과 낡은 바닥이 오프화이트 벽과 오크 마루로 바뀌는 그 순간을, 방문자가 직접 손가락으로 만들어내게 했습니다. 터치(touch-action: pan-y)와 키보드(range 입력) 모두로 조작되고, prefers-reduced-motion에서는 애니메이션을 끄되 비교 기능은 그대로 둬, 누구에게나 ‘변화’가 전달되도록 접근성을 지켰습니다. 이 한 컴포넌트가 ‘잘하나 봐요’를 ‘이렇게 바뀌는구나’로 바꿉니다.
시공 사례 그리드와 필터: 포트폴리오가 쌓이는 구조
거실·주방·욕실·상업공간을 칩으로 필터링하는 공간별 시공 사례 그리드를 두어, 방문자가 ‘우리 집과 같은 공간’만 골라 보게 했습니다. 카드마다 평형·마감(오크/세라믹/포세린)을 점선으로 구분해 적어, 한눈에 스펙이 읽힙니다. 핵심은 이 그리드가 ‘늘어나는 구조’라는 점입니다 — 새 현장 사진과 평형·마감 정보만 같은 형식으로 넣으면 사례가 쌓이므로, 운영자가 개발자 없이 포트폴리오를 관리할 수 있습니다. 인테리어 홈페이지 제작에서 갤러리는 한 번 만들고 끝이 아니라, 매 현장마다 자라야 하는 자산입니다.
상담 동선: 4단계 프로세스에서 견적 폼까지
‘상담→설계→시공→완공’ 4단계를 번호와 소요 기간으로 투명하게 보여 “어떻게 진행되나”의 불안을 먼저 풀었습니다. 그리고 모든 동선이 견적 문의 폼 하나로 모이게 했습니다 — 성함·연락처·공간 유형·평형·하고 싶은 공사까지 한 화면에 받고, ‘문의만으로 비용이 들지 않는다’를 명시해 첫 연락의 문턱을 낮췄습니다. 데모는 샘플 폼이지만, 실제 운영 시 스팸 차단과 개인정보 동의를 연결하는 자리를 미리 비워뒀습니다. 인테리어 홈페이지 제작에서 디자인의 목적은 결국 ‘한 건의 견적 문의’입니다.
정직과 발견(GEO)
시공비·평형·금액은 모두 ‘예시’로 명시해 과장하지 않았습니다. 대신 “인테리어 견적”, “리모델링 비용”, “거주 중 시공”처럼 의뢰인이 실제로 검색하는 질문에 답하는 FAQ와 구조화 데이터(HomeAndConstructionBusiness·FAQPage)를 넣어 — 검색엔진과 AI 답변 양쪽에서 인테리어 홈페이지 제작 사례로 발견되게 했습니다. 보기만 예쁜 사이트가 아니라, 찾아지고 견적으로 이어지는 사이트를 목표로 했습니다.