본문으로 건너뛰기
포트폴리오 목록으로

웹사이트콘셉트 데모

포에모라 에디토리얼 성형외과

패션 캠페인처럼 절제된 하이엔드 무드

직접 써보기 이 사례를 참고해 문의하기

18개 에디션매거진형 경험

누구를 위해
절제된 하이엔드 인상으로 선택받고 싶은 병원
무엇이 문제였나
진료 선택을 돕는 읽기 경험과 운영팀의 콘텐츠 검수·발행을 연결하는 과제입니다.
무엇을 했나
에디션형 진료 페이지·프라이빗 상담 폼과 저널을 관리하는 Maison Office를 만들었습니다.
무엇이 달라지나
고객은 상담 접수까지, 운영자는 저널 초안 저장·검수·예약·발행까지 체험할 수 있습니다.
포에모라 에디토리얼 성형외과 체험 화면
가상 브랜드로 만든 체험 화면입니다. 실제 고객 사례가 아닙니다.

어떻게 움직이나

한 건의 일이 처음부터 끝까지 어떻게 흘러가는지 순서대로 보여드립니다.

저널 한 편이 발행되기까지

예시 입력구성 18개 에디션운영 Maison Office

재생을 누르거나 단계를 눌러 순서대로 살펴보세요.

직접 써보기

가상 브랜드로 만든 데모입니다. 주문·예약·상담은 실제로 전송되지 않습니다.

이렇게 해보세요

  1. 상단 MAISON OFFICE의 JOURNAL & CMS에서 제목 수정 → 초안 저장 → 검수 → 예약 → 발행을 완료해보세요
  2. COMPLETE INDEX에서 시술 에디션·의료진·공간·저널·상담 등 18페이지를 탐색해보세요
  3. 시술 상세페이지를 끝까지 읽으며 고객 질문, 의료진 노트, 큐레이션 4단계와 연관 에디션을 확인해보세요
체험 가이드 2개 더 보기
  • 마지막 PRIVATE APPOINTMENT CTA에서 이름·연락처·필수 동의를 입력해 접수 완료까지 진행해보세요
  • 모바일 보기에서는 매거진형 콘텐츠와 상담 폼이 한 열의 읽기 흐름으로 재편됩니다

화면 크기를 바꿔 PC와 모바일에서 같은 흐름을 확인할 수 있습니다.

https://example.com
포에모라 에디토리얼 캠페인

POEMORA SIGNATURE 01

당신이라는 선을 가장 아름답게

유행하는 얼굴보다 오래 보아도 편안한 인상. 포에모라는 한 사람의 표정과 비율에서 디자인을 시작합니다.

0103

POEMORA CURATION

Beyond a feature,
design the whole.

부위별 접근을 넘어 얼굴 전체의 인상과 움직임까지 연결해 보는 시그니처 큐레이션입니다.

FACE DESIGN

얼굴의 인상을 섬세하게 읽다

하나의 부위보다 표정과 비율, 움직임의 관계를 먼저 살펴보는 포에모라의 페이스 디자인.

01 / ONE PERSON

한 사람을 위한 해석

정답을 권하기보다 충분히 듣고 함께 방향을 정합니다.

02 / LONG VIEW

오래 남는 디자인

지금의 유행보다 시간이 지나도 편안한 인상을 바라봅니다.

03 / CALM CARE

차분한 회복의 시간

결정 이전부터 회복 이후까지 필요한 정보를 투명하게 나눕니다.

PRIVATE APPOINTMENT

Your own rhythm,
your own beauty.

만든 범위

웜 그레이지의 캠페인 비주얼과 넓은 여백을 중심으로 설계한 하이패션 에디토리얼 무드의 18페이지 데모입니다. 매거진의 목차처럼 작동하는 COMPLETE INDEX에서 브랜드 선언, 얼굴·눈·코·윤곽·리프팅·바디·맨즈 에디션, 의료진, 안전, 회복, 공간, 저널, FAQ, 위치, 상담으로 이동하고, Maison Office에서는 상담 큐레이션과 의료 검수 기반 저널 발행을 이어서 관리합니다. 절차 소개·인물 화보·공간 풀블리드·에세이·정보 페이지가 각기 다른 편집 레이아웃으로 구성됩니다.

구현한 기능

  • 18페이지 매거진 인덱스Cover·Maison·Curation·People·Standard·Journal·Information을 에디션처럼 탐색
  • 하이패션 캠페인 비주얼모델을 왼쪽에 두고 오른쪽 카피 여백을 확보한 오리지널 와이드 히어로
  • 에디토리얼 시그니처 전환페이스·바디·맨즈를 선택하면 이미지와 설명이 매끄럽게 교차 전환
  • 절제된 브랜드 타이포그래피세리프 헤드라인, 미세한 자간, 낮은 채도의 톤으로 패션 매거진의 리듬 구현
  • 다중 상담 진입 동선헤더·퀵 메뉴·프로그램 상세·하단 바에서 동일한 상담 경험으로 연결
  • 프라이빗 결정 여정고객 질문·의료진 노트·4단계 큐레이션·연관 에디션을 거쳐 상담 폼으로 전환
4개 더 보기
  • 프라이빗 상담 폼이름·연락처·필수 동의 입력 후 접수 완료까지 이어지는 모달 플로우
  • Maison Office 편집 데스크상담 큐레이션·예약 수용량·저널 초안·의학 검수·예약 발행을 매거진 제작 흐름처럼 연결
  • 의료 광고 톤 가드결과 단정과 전후 비교를 배제하고 포트폴리오 콘셉트와 가상 이미지임을 명시
  • PC·모바일 전용 구도모델 크롭, 카피 위치, 메뉴와 상담 바를 화면별로 다시 배치

사용한 기술

Next.js · React · TypeScript · TailwindCSS · Framer Motion · OpenAI Image Generation

확인된 사실

무드
하이패션·절제
구성
18개 에디션
핵심 기능
시그니처 전환
화면
PC·모바일

데모의 구현 범위입니다. 실제 고객 성과가 아니며, 브랜드와 인물은 체험을 위해 만든 가상 콘셉트입니다.