개요
미지헌(未知軒)은 2026년 12월 서울 북촌 가회동에서 문을 여는 이머시브 시어터다. 바우어랩이 기획한 초감각 몰입 공간으로, 아직 정식 개관 전이라 지금의 웹사이트는 카운트다운과 붉은 '예약하기' 인장을 앞세운 티저의 성격을 띤다. 화면 맨 위에는 한국어·ENGLISH·日本語·中文 네 언어를 나란히 걸어 두어, 개관 전부터 국내외 관람객을 함께 겨냥한다는 의도를 감추지 않는다. 이번 리뷰에서는 '미지의 문을 여는 경험'이라는 콘셉트를 웹으로 어떻게 옮겼는지, 특히 스크롤 연출과 타이포, 색의 절제가 예약이라는 단 하나의 전환으로 어떻게 수렴하는지를 UX/UI 관점에서 살핀다.
브랜드 & 메시지
첫 화면은 검정에 가까운 배경 한가운데, 세로로 떨어지는 스포트라이트 아래 '名(이름 명)'을 새긴 비취빛 옥패가 매듭 술과 함께 걸려 있다. 설명 문장 하나 없이 오브제와 빛만으로 '이름 없는 무언가와 마주한다'는 첫인상을 전한다. 카피는 시종 절제돼 있다. 'STEP, INTO THE UNKNOWN', 'A MYSTERIOUS LIGHT CALLS YOU FROM BEYOND THE DOOR' 같은 영문 헤드라인을 클래식 세리프로 크게 얹고, 그 아래 '굳게 닫혀있던 문 너머, 미지의 빛이 당신을 부릅니다' 같은 국문 한 줄로 정서를 눌러 담는다. 컬러는 먹빛 검정을 바탕으로 짙은 비취 그린(한옥 대문), 따뜻한 앰버 골드(글자와 등불), 버건디 인장이라는 세 축으로 잡아 브랜드 톤이 끝까지 흔들리지 않는다. 내비게이션은 상단 물결 아이콘과 우측 'KOR' 토글로 최소화했고, 정작 사용자를 향한 행동 유도는 페이지 맨 아래 붉은 '예약하기' 인장과 '29일 11시 21분 15초' 카운트다운 하나로 모인다. 버튼을 여기저기 흩뿌리지 않고 전환을 단 하나로 좁힌 판단이 이 웹디자인의 성격을 잘 보여준다.
UX/UI 관점
실제 화면에서 드러나는 웹디자인 강점을 짚으면 이렇다. 첫째, 스크롤 자체가 서사다. 옥패에서 시작해 짙은 녹색 한옥 대문, 실루엣 관람객이 늘어선 어두운 전시실, 빛나는 문지방('STEP, INTO THE UNKNOWN'), 청사초롱이 밝힌 복도, 그리고 예약으로 이어지는 흐름이 '문을 하나씩 통과하는' 관람 동선을 그대로 웹으로 옮겨 놓았다. 둘째, 시선 유도가 정교하다. 원형 포털 안에 미지헌 건물 파사드를 담고 그 아래로 가느다란 빛줄기를 부챗살처럼 흘려, 다음 섹션으로 눈을 자연스럽게 끌어내린다. 셋째, 타이포 위계가 분명하다. 영문은 클래식 세리프 디스플레이로 무드를 잡고, '단지 보는 것을 넘어, 온몸으로 감각하는 새로운 차원의 몰입'처럼 국문은 큰 헤드와 작은 산세리프 본문으로 역할을 나눠 읽는 리듬을 만든다. 넷째, 색과 여백을 극도로 아꼈다. 먹빛 바탕에 골드·그린·버건디 세 색만 절제해 써서, 화려함 대신 몰입을 남긴다. 다섯째, 콘텐츠를 말이 아니라 화면으로 시연한다. '오픈형 이어폰과 조명, 세트 제어로 시지각과 청지각을 자극한다'는 설명 옆에 음성 파형 그래픽을 놓고, 전시실과 복도 실사로 4D 감각을 미리 체감하게 한다. 여섯째, FAQ 아코디언이 위치(가회동 9-1)·운영시간·티켓·지원언어·동시 입장 인원·연령제한처럼 개관 전 관람객이 실제로 던질 질문에 답해, 무드에 치우치기 쉬운 티저에 실용의 축을 더한다.
IA·SEO 전략
미지헌 사이트는 원페이지 티저이고, 화면 대부분이 실사와 3D 오브제, 모션으로 채워져 있다. 몰입에는 최적이지만 검색엔진이 읽을 텍스트가 얇다는 뜻이기도 하다. 'STEP, INTO THE UNKNOWN' 같은 헤드라인이 이미지에 구워져 있다면, 같은 문구를 실제 h1과 본문 텍스트로도 심어 크롤러가 브랜드 서사를 읽게 해야 한다. 무엇보다 이곳은 주소를 가진 물리적 공간이다. LocalBusiness 혹은 공연장(PerformingArtsTheater) 스키마에 '서울 종로구 가회동 9-1'이라는 상호·주소·전화(NAP)를 일치시키고, 2026년 12월 개관을 Event 구조화 데이터로 표기하면 개관 전부터 검색과 지도에서 존재감을 쌓을 수 있다. 네이버 플레이스와 구글 비즈니스 프로필을 미리 등록해 두는 것도 같은 맥락이다. 4개 언어를 내건 만큼 ko·en·ja·zh 각각에 별도 URL과 hreflang을 정합성 있게 걸어 언어별 색인이 서로를 잠식하지 않도록 관리하는 일이 특히 중요하다. 전환이 '예약' 하나로 명확하니, 예약 화면에는 Event·Offer 스키마를, 공유용으로는 인스타그램·유튜브 카드에 최적화된 OG 이미지를 붙여 두면 초기 확산에 유리하다.
성능·접근성
성능과 접근성의 관전 포인트는 '무겁고 어두운 몰입형'이라는 이 사이트의 성격에서 곧장 나온다. 옥패, 녹색 대문, 전시실, 복도까지 고해상 실사가 연속으로 깔리고 파형·빛줄기·원형 포털 같은 모션이 스크롤에 얹히므로, 초기 로딩(LCP)과 데이터 비용, 모바일 발열이 실질적인 부담이다. 히어로 이미지는 AVIF·WebP로 내려주고 뷰포트별 srcset을 두되 첫 화면만 preload하고, 스크롤 연출은 뷰포트에 들어올 때만 실행하는 지연 초기화로 메인 스레드 점유를 낮추는 편이 안전하다. 모션에 민감한 사용자를 위해 prefers-reduced-motion 대응도 함께 챙기면 좋다. 접근성에서는 명도 대비가 관건이다. 큰 골드 세리프는 검정 위에서도 잘 읽히지만, FAQ와 푸터의 회색 본문 카피는 대비가 낮아 기준선을 넘는지 점검이 필요하다. 옥패·유물·인물화 같은 핵심 오브제에는 의미를 담은 대체 텍스트를 붙이고, 카운트다운 숫자 영역은 미리 자리를 잡아 값이 들어올 때 레이아웃이 튀는 CLS를 막아야 한다. 몰입형 웹사이트 제작에서 이 최적화는 선택이 아니라 기본기다.
디지털 파트너 더블루캔버스
미지헌처럼 오프라인 경험이 핵심인 브랜드일수록, 개관 전 웹사이트는 사실상 '첫 관람'이 된다. 화면의 무드가 공간에 대한 기대치를 결정하고, 그 기대를 예약이라는 행동으로 잇는 일은 감각과 설계가 동시에 필요한 작업이다. The Blue Canvas는 이런 문화·전시·체험 공간의 홈페이지 제작을 브랜드 무드 설계 단계부터 함께 풀어 왔다. 몰입형 스크롤 연출과 무거운 비주얼을 쓰면서도 로딩과 검색 노출을 잃지 않는 웹사이트 제작, 개관 전부터 지역·다국어 검색을 선점하는 SEO, 그리고 카운트다운과 예약으로 이어지는 전환을 데이터로 다듬는 퍼포먼스 마케팅까지 하나의 흐름으로 설계한다. 새로운 공간의 문을 여는 웹을 고민하고 있다면, 무드와 성과를 함께 가져가는 방법이 있다.
마무리와 다음 스텝
미지헌의 웹사이트는 '문을 여는 경험'이라는 콘셉트를 색과 타이포, 스크롤로 밀도 있게 번역했고, 전환을 예약 하나로 좁혀 티저로서의 목적이 선명하다. 개관까지 남은 시간을 감안하면 지금은 무드를 지키면서 검색 자산을 미리 쌓을 최적의 시기다. 세 가지를 제안한다. 첫째, 이미지에 구워진 헤드라인을 실제 텍스트와 h1으로 옮기고 LocalBusiness·Event 구조화 데이터로 '가회동의 2026년 12월 개관'을 검색에 각인한다. 둘째, 고해상 실사와 모션을 AVIF와 지연 초기화, reduced-motion으로 다듬어 몰입은 유지하되 로딩과 접근성을 확보한다. 셋째, 4개 언어의 hreflang과 예약 스키마를 정리해 국내외 유입을 예약이라는 단일 전환으로 온전히 흘려보낸다. 새로운 공간의 홈페이지 제작에서 무드는 이미 완성된 축에 든다. 남은 과제는 그 무드가 검색과 성능 위에서도 흔들리지 않게 만드는 일이다.