프로젝트 무료 상담 신청 MOTZ - UX/UI 리뷰 | The Blue Canvas
UX/UI Review

MOTZ Website Design Review

2026-06-17·브랜드/웹 리뷰

YSL·구글·아디다스·삼성의 무대를 만든 브랜드 경험 에이전시 MOTZ. 카피 없이 장면으로 말하는 첫 화면부터 서비스 아코디언까지, 이 웹사이트의 설계 의도를 뜯어본다.

협업 문의 및 자세히 보기

개요

MOTZ는 공간과 감각으로 브랜드를 각인시키는 브랜드 경험(Brand Experience) 에이전시다. 사이트에 들어서면 그 정체성이 곧장 드러난다. YSL 러브샤인 팝업의 핑크빛 미러룸, 그 한가운데 검은 슈트의 모델이 선 풀블리드 영상이 스크롤 한 번 없이 화면을 가득 메운다. 상단에는 ◆ MOTZ 로고와 Work·Service·About us·News·Contact 다섯 개의 영문 메뉴뿐. 설명을 덜어낸 자리에 장면이 들어선 구성이다. 이번 리뷰에서는 이 히어로의 몰입감이 실제 정보 탐색으로 얼마나 매끄럽게 이어지는지, OUR WORKS와 WHAT WE DO, NEWS로 내려가는 흐름이 방문자를 어디까지 데려가는지, 그리고 에이전시 홈페이지 제작이라는 관점에서 MOTZ가 어떤 선택을 했고 무엇을 남겨두었는지를 화면 근거로 따져본다.

MOTZ 웹사이트 메인 스크린샷

브랜드 & 메시지

MOTZ의 화법은 카피가 아니라 장면으로 말한다. 히어로에는 헤드라인 한 줄 얹지 않았고, 대신 사이트 맨 아래 검은 푸터 밴드에서 WE CHANGE HOW PEOPLE FEEL THROUGH EXPERIENCE — CREATE UNFORGETTABLE MOMENTS 두 줄로 미션을 못 박는다. 감정을 바꾸고 잊지 못할 순간을 만든다는 선언이 톤 전체를 지배한다. WHAT WE DO 영역의 카피도 결이 같다. "We combine deep expertise, proven experience, and technology to create brand experiences with artistic value"라는 영문 진술 아래, "우리는 감각과 전략이 완벽하게 균형을 이루는 경험의 지형도를 설계하여 브랜드가 사람들의 삶 속에 영원한 좌표로 새겨지도록 만듭니다"라는 국문이 나란히 놓여 감성과 전략을 한 문장에 묶는다. 톤앤매너는 철저히 절제됐다. 흰 바탕과 검은 타이포, 넉넉한 여백이 캔버스 역할을 하고 컬러는 오직 사례 이미지에서만 터진다.

다만 전환 설계는 아쉬움을 남긴다. 히어로에도, 본문 어디에도 눈에 띄는 CTA 버튼이 없다. 문의 경로는 상단 내비게이션의 Contact와 푸터의 전화번호(+82.2.3015.3100)·이메일(edc@motz.kr)에 조용히 의존한다. 몰입은 강하지만, 마음이 움직인 방문자를 다음 행동으로 밀어줄 손잡이가 화면 곳곳에 부족하다.

키워드: 장면 중심 화법, 절제된 모노톤 캔버스, 이원(국·영문) 미션 카피, 약한 CTA 동선

UX/UI 관점

화면에 근거한 이 웹사이트의 강점은 분명하다.

첫째, 말보다 보여주는 히어로. 텍스트 대신 실제 프로젝트 현장 영상을 풀블리드로 깔아, 방문자는 첫 3초 안에 "이 팀이 만드는 경험의 밀도"를 눈으로 체감한다. 경험 에이전시에 가장 정직한 첫인상이다. 둘째, OUR WORKS 2×2 그리드. YSL LOVESHINE FACTORY, GOOGLE FOR KOREA, ADIDAS GROUND SEONGSU, TEAM GALAXY CONNECT IN SEOUL — 네 장의 카드가 균일한 크기로 정렬되고 각각 영문 제목과 한 줄 설명("A Futuristic YSL Luxury Pop Up Store in Seongsu" 식)을 단다. 티어1 클라이언트의 이름 자체가 강력한 사회적 증거로 작동한다. 셋째, 색을 아끼는 절제. 무채색 레이아웃이 화려한 사례 사진을 도드라지게 만들어 시선이 정확히 작업물로 향한다.

넷째, WHAT WE DO 아코디언. Experience Design 항목만 펼쳐져 Core Scope(Experience Planning, Touchpoint Constellation Mapping, Space & Program Harmonization, Audience Journey Choreography)를 보여주고, Visual Design·Event Marketing·Content Production·Operations·Digital Campaign은 접힌 채 우측에 2D/3D 디자인, 이벤트 제작, 콘텐츠 제작, 현장 운영, 디지털 캠페인이라는 국문 라벨을 붙였다. 방대한 역량을 한 화면에 밀어넣지 않고 사용자가 필요할 때 펼치도록 계층을 나눈 판단이 좋다. 다섯째, 날짜가 박힌 NEWS 카드. 2025.03.20 디블라트와의 AI 경험 마케팅 솔루션 개발, 2024.12.04 AFC 시상식·컨퍼런스 수행 등 시점이 명시된 소식이 팀의 현재 활동성을 증명한다. 여섯째, 에디토리얼한 타이포와 여백이 전체를 고급 브랜드북처럼 읽히게 한다.

키워드: 영상 퍼스트 히어로, 균일 그리드 포트폴리오, 무채색 대비, 계층형 서비스 아코디언, 시점형 뉴스

IA·SEO 전략

MOTZ 사이트는 브랜드 무드를 위해 거의 모든 소제목을 영문으로 처리했다. OUR WORKS, WHAT WE DO 같은 표기는 감각적이지만, "성수 팝업스토어", "브랜드 경험 마케팅 대행", "체험형 이벤트 기획" 같은 국문 검색어를 원하는 잠재 고객에게는 거의 노출되지 않는다. 국내 B2B 리드를 검색으로 확보하려면 각 섹션에 국문 H2와 본문 텍스트를 함께 심는 웹사이트 제작 전략이 필요하다. 특히 OUR WORKS의 네 장 카드는 지금 이미지와 한 줄 카피에 머물러 있는데, YSL·구글·아디다스·삼성 프로젝트를 각각 별도 상세 페이지로 확장하고 기획 의도·규모·성과를 서술형으로 풀면, 그 자체가 강력한 키워드 자산이자 세일즈 자료가 된다. NEWS의 날짜형 소식은 Article 구조화 데이터와 개별 URL을 붙여 색인 대상으로 만들 여지가 크다. 페이지별 고유 title·description·OG 태그를 프로젝트 단위로 분리하는 정비도 함께 권한다.

성능·접근성

가장 먼저 볼 지점은 풀블리드 히어로다. 첫 화면을 채우는 대용량 영상·이미지는 LCP에 직접 영향을 주므로, 포스터 프레임을 먼저 그려 체감 로딩을 앞당기고 소스는 코덱과 해상도를 디바이스별로 분기하는 편이 안전하다. OUR WORKS와 NEWS의 사진들은 폴드 아래에 있으니 지연 로딩과 WebP/AVIF 병행 제공으로 초기 전송량을 낮출 수 있다. 영문 디스플레이 서체는 서브셋과 display=swap으로 폰트 지연을 줄이고, 무거운 인터랙션 스크립트는 초기화 시점을 뒤로 미루는 것이 좋다. 접근성 측면에서 WHAT WE DO 아코디언은 키보드 포커스 순서와 aria-expanded 상태를 명시해야 스크린리더 사용자도 펼침/접힘을 인지한다. 사례 이미지에는 프로젝트를 설명하는 대체 텍스트를, 검은 푸터의 저대비 영역에는 명도 대비 점검을 권한다.

디지털 파트너 더블루캔버스

MOTZ의 사이트는 "경험을 파는 회사가 어떻게 자기 경험을 웹으로 번역하는가"에 대한 좋은 참고서다. 동시에 이 리뷰가 짚은 지점들 — 국문 검색 유입, 프로젝트 상세 페이지, 명확한 전환 동선, 히어로 성능 — 은 브랜드 경험·이벤트·공간 마케팅 업종이 홈페이지 제작에서 공통으로 마주하는 과제이기도 하다. The Blue Canvas(더블루캔버스)는 감각적인 웹디자인과 검색에 강한 정보 구조를 한 흐름으로 설계하고, SEO 검색엔진최적화와 퍼포먼스 마케팅까지 이어 붙여 "예쁜데 안 팔리는 사이트"와 "잘 팔리는 사이트"의 간격을 메운다. 포트폴리오형 브랜드 사이트의 UX/UI 정비, 프로젝트 상세 콘텐츠 설계, 리드를 만드는 전환 동선 구축을 고민한다면 언제든 상담을 청해도 좋다.

The Blue Canvas 바로가기

마무리와 다음 스텝

MOTZ 웹사이트는 브랜드 경험 에이전시가 지향할 만한 미감의 정점에 가깝다. 영상 퍼스트 히어로와 절제된 모노톤, 티어1 사례 그리드가 첫인상을 단단히 잡는다. 남은 과제는 이 몰입을 성과로 바꾸는 실리적 장치다. 실행 제안은 셋으로 압축된다. 첫째, OUR WORKS 네 프로젝트를 국문 본문이 담긴 상세 페이지로 확장해 검색 자산이자 세일즈 자료로 삼는다. 둘째, 히어로와 각 섹션 말미에 Contact로 이어지는 명확한 CTA를 배치해 전환 동선을 촘촘히 만든다. 셋째, 히어로 영상 최적화와 아코디언 접근성 보완으로 체감 속도를 끌어올린다. 이 셋만 손봐도 강한 인상이 문의로 이어지는 비율은 확연히 달라진다.