윤슬 홈페이지 첫 화면. 동해 바다 사진 위에 '바다가 반짝이는 시간에 머무릅니다'라는 문구와 객실 보기 · 실시간 예약 버튼이 놓여 있습니다.

윤슬

바닷가 스테이 브랜드브랜드 해석, 기획, 카피, 디자인, 반응형 제작

BRAND READING

머무는 장소보다,
빛이 바뀌는 시간을 먼저 읽었습니다.

윤슬은 바다 앞의 숙소라는 정보만으로 설명되지 않습니다. 물 위의 빛, 객실 안으로 들어오는 시간, 조용히 쉬는 감각을 하나의 브랜드 경험으로 해석했습니다.

소개 섹션. '여기서는 시간을 보는 일이 일정의 전부입니다'라는 문구 옆에 침대에서 바라본 창과 수평선 사진이 놓여 있습니다. 갤러리 섹션. '사진은 보정 없이 게시합니다'라는 제목 아래 낮 바다와 달빛 바다 사진이 가로로 이어집니다.

PAGE STRATEGY

감각을 먼저 보여주고,
머무는 방법은 그다음에 설명했습니다.

첫 화면에서 바다와 머무는 시간을 느끼게 한 뒤, 공간의 차이와 함께 쓰는 것, 주변의 기록, 예약 정보로 자연스럽게 이어지도록 순서를 정했습니다.

먼저 느끼기바다와 빛의 첫 장면
공간 살펴보기네 개의 서로 다른 체류
머무름 결정하기예약과 안내

윤슬의 화면을 만든
세 가지 기준

은빛이 남는 이미지

강한 필터보다 바다와 공간의 실제 밝기를 주인공으로 두었습니다.

호흡느리게 읽는 여백

설명 사이를 넓게 두어 머무는 시간의 속도를 화면에도 반영했습니다.

대비고요한 네이비

밝은 공간 이미지 사이에 깊은 색을 넣어 밤의 분위기까지 이어집니다.

긴 화면에서도
한 장면씩 기억되도록

같은 구조를 반복하지 않고, 큰 풍경과 세로 이미지, 짧은 정보 면을 번갈아 배치했습니다. 두 가지 제안 모두 윤슬의 차분한 분위기를 다른 밀도로 보여줍니다.

A안 데스크톱 전체 화면. 히어로, 소개, 네 채의 객실, 공용 공간, 갤러리, 위치 순으로 이어집니다.
A안 — 사진 없이도 완성되는 구성
B안 데스크톱 전체 화면. 큰 사진을 앞세워 A안보다 이미지 비중이 높습니다.
B안 — 현장 사진을 앞세운 구성

작은 화면에서는
장면을 한 열로 이어갑니다.

모바일에서는 복잡한 움직임보다 사진의 순서와 글의 길이를 우선합니다. 공간의 표정이 잘리지 않도록 세로 크롭과 충분한 간격을 사용했습니다.

모바일 첫 화면. 두 개의 버튼이 세로로 쌓이고 문구가 화면 아래쪽에 놓입니다.
모바일 객실 목록. 데스크톱의 2열 그리드가 한 열로 바뀌고 사진이 세로로 길어집니다.
모바일 위치 안내. 주소와 이동 시간이 표 형태로 쌓입니다.

화면을 만들기 전에
브랜드의 흐름부터 만들었습니다.

브랜드 방향 해석페이지와 섹션 기획홈페이지 카피UI와 비주얼 디자인이미지 아트 디렉션데스크톱 구성모바일 반응형정적 화면 제작

당신의 브랜드는
어떤 장면으로 기억되어야 할까요?

홈페이지에 담아야 할 강점과 필요한 페이지부터 함께 찾아봅니다.