UI · 페이지

Ember House

코드 렌더 · 같은 결과

Sauna house · send a booking request in one view

Fictional urban Nordic sauna & cold-plunge house

지역 사업
행동
스테이지
H8 Availability & Booking

Ember House는 가상 브랜드이고 가격·수치·이미지는 모두 샘플입니다. 레시피는 실제 콘텐츠가 없는 자리를 지어내지 않고 조건 규칙대로 바꿉니다.

실제 페이지를 스크롤하며 녹화한 화면입니다(32초, 소리 없음). 데스크톱 1440×900 · 모바일 390×844 에서 검수했습니다.

섹션 화면

Ritual
Sessions
Prices
Visit

섹션 순서

위에서 아래 순서입니다. 내비게이션과 푸터는 모든 페이지에 들어 있어 뺐습니다.

01
HeroH8 Availability & Booking
Session, day, time of day and guests pickers in real DOM, with the honest response time next to the button.
H8 Availability & Booking: a visitor who already knows the place starts the request in the first view.
02
Ritual상품·서비스
Scroll-scrubbed sequence: cold stones → heat → water poured → steam.
Sells the experience of the visit in one motion.
03
Sessions상품·서비스
Shared, private and sunrise sessions with a pinned image swap and "Choose this session" links.
Each option explained once, feeding straight back to the booking form.
04
Cold interlude작업·결과
Cold-plunge frame opening to full bleed.
A dramatic pause that shows the second half of the ritual.
05
Prices가격·요금
Price table plus what is always included.
Answers cost before asking for details.
06
Visit문의·위치
Address, hours, getting there and a drawn walking map.
A local business must make the trip feel easy.
07
FAQ자주 묻는 질문
How a request works, changes and cancelling, what to bring, first-timers and who can come.
Clears the hesitations of a first-time bather.
08
Request행동 유도
Booking request form with a confirmation state ("Demo complete — nothing was sent.").
The only submit on the page, with no promise of a held slot.

조건별 변형

레시피는 만들기 전에 세 가지를 묻고, 답에 따라 아래 규칙으로 섹션을 바꿉니다.

이럴 때	이렇게 바꾼다
No live availability integration	The hero is a booking REQUEST: no "available", seat counts, confirmed slots or countdown; time is chosen as time of day.
Live availability exists	Still ship this recipe as a request flow — real slots belong to a different recipe.
Phone / walk-in only	Replace the form submit with a tel: link under the same label; keep the pickers as a "plan your visit" summary.
No reviews	No proof section, rating, guest count or "loved by" line.
No public prices	Drop the price column, pricing table and totals; keep "Always included" and say "Price on request".
One option only	Remove the session picker and the sticky offers stage; keep one offer block.
Options with restricted days	Disable (not hide) the other days in the day picker and say which days beside the label.

스타일

Stage — strong scale contrast, one cinematic image per screen, dark warm palette, one ember accent

다른 페이지