Landing page proposals · 2026. 09. 27

랜딩 페이지 시안,
다섯 가지 방향

같은 브랜드 자료 — BX 제안서, 제품 렌더, 브랜드 필름 — 로 서로 다른 다섯 방향의 브랜드 랜딩을 만들었습니다. 제품 사양이 아니라 Tearest의 생각과 시간, 의식과 세계를 보여 주는 페이지들이고, 실제 향수·뷰티 브랜드 사이트를 벤치마킹했습니다. 다섯 모두 손으로 돌려 보고 캡을 열어 볼 수 있는 실시간 3D 병을 각자의 방식으로 담았습니다. 어떤 인상이 Tearest에 맞는지 고르기 위한 비교 시안이고, 선택된 방향을 실제 페이지로 발전시킵니다.

브랜드 공식
R = f(t)
변수
t = tea, time, tone
라인업
향수 2종 · 뷰티 라인(가칭)

각 시안 페이지 왼쪽 아래의 작은 막대로 시안 사이를 오갈 수 있습니다(키보드 [ ]). 주소 끝에 ?clean을 붙이면 막대 없이 보입니다 — 예:/formula/?clean

A

Formula 공식

브랜드 공식 R = f(t)로 쓴 선언문 — 글자가 주인공인 에디토리얼.

종이와 먹, 큰 세리프. 「쉼에 관한 일곱 개의 공리」로 브랜드의 믿음을 먼저 세우고, 차·시간·톤 세 변수와 한 줄의 인용(헨리 제임스)으로 두 톤의 시간을 연다.

이 시안이 묻는 것
말수가 적고 생각이 분명한 브랜드를 원하는가
참고한 결
Le Labo의 매니페스토, Aesop의 인용 한 줄, 잡지 지면
3D
종이 위의 Fig. 3 「빛 속에서, 천천히」 — 위에서 보기·캡을 여는 순간·라벨, 그리고 하루의 빛.
글꼴
Newsreader · Noto Serif KR · Pretendard
색
움직임
알림 중심
이미지 비중
어두움
시안 열기

B

Afterglow 잔광

브랜드 필름의 빛으로 여는 시네마틱 캠페인.

스크롤이 곧 시간이다. 늦은 오후의 정원에서 해 질 녘 테라스, 첫 등불까지 빛이 기울며 두 톤을 차례로 비추고, 필름의 원칙 「빛은 움직이고, 손은 머문다」가 한 장면이 된다.

이 시안이 묻는 것
분위기와 감정으로 설득하는 캠페인 톤을 원하는가
참고한 결
Byredo·Tamburins의 캠페인 사이트, 메종 향수 필름
3D
등불 아래의 입장 연출 — 스크롤하면 병이 등을 돌린 자세에서 관객 쪽으로 돌아선다.
글꼴
Cormorant Garamond · Noto Serif KR
색
움직임
알림 중심
이미지 비중
어두움
시안 열기

C

Ritual 의식

차를 우리고 톤을 고르는 하루의 의식을 따라가는 라이프스타일.

다섯 개의 몸짓 — 우리다·기다리다·고르다·얹다·머물다 — 이 멈춰 선 사진 옆으로 흐른다. 두 톤은 하루의 두 시간으로, 뷰티 라인은 의식의 나머지로 놓이고, 출시 알림은 초대장이 된다.

이 시안이 묻는 것
사람의 손과 일상의 장면으로 브랜드를 느끼게 하고 싶은가
참고한 결
Diptyque의 감각의 의식, Nonfiction의 손과 매크로, Ffern의 대기 명단
3D
「손에 들고, 빛에 비춰 보기」 — 톤을 고르기 전에 손에 드는 3D, 끝에 초대장으로.
글꼴
Pretendard · Cormorant Garamond
색
움직임
알림 중심
이미지 비중
어두움
시안 열기

D

Hours 시간

t = time을 체험으로 바꾼 인터랙티브.

방문한 시각에 맞춰 화면의 빛이 바뀌고, 하루를 손으로 넘기면 그 시간에 어울리는 톤이 나타난다. 나만의 공식을 카드로 남긴다.

이 시안이 묻는 것
참여하고 공유하는 디지털 경험을 원하는가
참고한 결
시간·날씨에 반응하는 인터랙티브 브랜드 경험
3D
시간 다이얼이 3D 병의 빛과 배경까지 바꾼다 — 아침·늦은 오후·해 질 녘·첫 등불.
글꼴
Instrument Serif · IBM Plex Mono · Pretendard
색
움직임
알림 중심
이미지 비중
어두움
시안 열기

E

Object 오브제

브랜드를 다섯 개의 방으로 거니는 전시.

차·시간·톤·오브제·R′ — 다섯 개의 방에 큰 이미지와 작은 벽 캡션만 둔다. 병은 네 번째 방의 좌대 위, 손으로 돌려 보는 한 점의 오브제다.

이 시안이 묻는 것
말보다 이미지와 여백으로 브랜드를 보여 주고 싶은가
참고한 결
미술관 전시와 도록, Byredo의 타이포 판, Tamburins의 설치 작업
3D
네 번째 방 「한 점의 오브제」 — 좌대 위에서 360°로 돌려 보고, 캡을 연다.
글꼴
Bodoni Moda · IBM Plex Mono · Noto Serif KR
색
움직임
알림 중심
이미지 비중
어두움
시안 열기

Side by side

한눈에 비교

시안한 줄움직임알림 중심이미지 비중어두움
A Formula브랜드 공식 R = f(t)로 쓴 선언문 — 글자가 주인공인 에디토리얼.낮음낮음중간낮음
B Afterglow브랜드 필름의 빛으로 여는 시네마틱 캠페인.높음낮음높음높음
C Ritual차를 우리고 톤을 고르는 하루의 의식을 따라가는 라이프스타일.중간중간높음낮음
D Hourst = time을 체험으로 바꾼 인터랙티브.높음낮음중간중간
E Object브랜드를 다섯 개의 방으로 거니는 전시.중간낮음높음낮음

For the client meeting

고객과 확인할 다섯 가지

  1. 1
    첫인상

    페이지를 열었을 때 무엇이 먼저 보여야 하나요 — 글자와 선언(A), 빛과 영상(B), 사람의 손과 의식(C), 방문자의 시간(D), 전시처럼 걸린 이미지(E)?

  2. 2
    출시 초기의 목표

    세계관을 알리는 것이 먼저인가요(A·B·E), 출시 알림 신청을 모으는 것이 먼저인가요(C — 초대장이 페이지 끝까지 따라옵니다)?

  3. 3
    밝기

    브랜드의 기본 화면은 밝은 종이(A·C·E)인가요, 어두운 방(B)인가요? D는 시간에 따라 둘 다 됩니다.

  4. 4
    움직임

    조용히 읽히는 페이지와, 스크롤·조작에 반응하는 페이지 중 어느 쪽이 Tearest다운가요?

  5. 5
    뷰티 라인의 자리

    뷰티 라인은 향수와 같은 하루의 몸짓으로 보여 주나요(C·D), 향수 다음 장·다음 방으로 이어 두나요(A·B·E)?

Shared rules

다섯 시안이 함께 지킨 것

  • 다섯 시안 모두 같은 사실만 씁니다 — 브랜드명, R = f(t), t = tea, time, tone, 두 톤의 이름과 세계(시간·장소·빛). 브랜드 랜딩이라 도면·치수·재질 사양은 싣지 않았습니다.
  • 로고는 BX 제안서 PDF의 원본 벡터를 그대로 추출해 썼습니다. 다시 그리거나 비슷한 글꼴로 흉내 내지 않았습니다.
  • 제품은 클라이언트가 준 렌더와 그 라벨 원판으로 만든 3D로만 보여 줍니다. AI 이미지는 무드(정원·차·빛·손·질감)에만 쓰고, 병을 생성하지 않았습니다.
  • 향 노트, 농도, 지속력, 가격, 출시일은 자료에 없어 어디에도 쓰지 않았습니다. 빌드마다 금지 표현 검사가 돕니다.
  • Tone 02 · Golden Terrace는 보틀 아트워크가 없어 병 대신 그 시간(브랜드 필름 B의 테라스)으로 보여 줍니다.
  • 다섯 시안 모두 실시간 3D 병이 들어 있습니다. 치수 대신 몸짓(돌려 보기·위에서 보기·캡 열기)과 하루의 빛으로 보여 주고, 라벨은 제안서 인쇄 원판(금박·먹) 그대로라 렌더의 오탈자가 없습니다.
  • AI로 만든 이미지가 있는 페이지에는 모두 「AI로 제작된 콘텐츠」 표기가 들어가 있습니다.

Still open

확인이 필요한 것

뷰티 라인 구성
제품명·종류가 자료에 없어 Hand · Body · Hair & Linen 세 자리를 (가칭)으로 두었습니다. 실제 라인업을 주시면 한 곳만 고쳐 다섯 시안에 모두 반영됩니다.
가격 · 출시일 · 향 구성
미확정이라 「출시와 함께 안내」로 비워 두었습니다.
Tone 02 보틀 아트워크
라벨·상자 자료가 없어 화면에 병을 두지 않았습니다. 자료가 오면 같은 자리에 넣을 수 있게 설계했습니다.
A의 인용 한 줄
헨리 제임스 『여인의 초상』(1881)의 첫 문장 — 「오후의 차라 불리는 의식에 바친 한 시간」 — 을 제사로 걸었습니다. 서양 문학의 인용이 Tearest에 맞는지, 우리 고전에서 고르는 편이 나은지 확인이 필요합니다.
제안서 렌더의 라벨 오탈자
렌더 두 장(정면·비스듬히) 라벨에 「t = teo, time, tone」, 공식이 「R–f()」로 찍혀 있습니다. 그래서 병 전체 렌더는 글자가 읽히지 않는 크기로만 쓰고, 크게 보일 자리는 3D와 라벨을 피한 매크로 컷이 맡습니다. 최종 렌더에서 수정이 필요합니다.
유리 병 도면(3D 정확도)
화면에 치수를 싣지는 않지만, 3D 모델의 유리 비례는 렌더에서 잰 값입니다. 유리 용기 도면(DH패키지)이 오면 같은 스크립트로 모델을 다시 만듭니다.
밑라벨 용량 표기
5쪽 밑라벨의 「1.70 FL.OZ.LIQ」는 30 ml(= 1.01 fl oz)와 맞지 않아 쓰지 않았습니다.
실서비스 전 필요한 것
사업자 정보, 개인정보 처리방침, 알림 신청 저장소(현재 폼은 시안이라 저장하지 않음).