Free
✈️ Travel
CROSS_PLATFORM

Lark Lodge Booking

Boutique lodge booking app with map-first discovery, date-range picker and a calm, editorial stay-detail flow.

8 views 0 copies 385 palavras

O prompt

# Lark Lodge — Boutique Lodge Booking App

## Goal
Design and build "Lark Lodge", a boutique lodge booking app. Feel: quiet luxury — the app equivalent of a linen-bound guidebook; discovery feels like planning, not shopping. Every screen should feel native-quality — fluid, tactile, zero jank.

## Visual Language
- **Palette**: warm paper #F7F4EE base, pine #2F4A3C primary, clay #C67B5C accent, ink #23241F text; light-first
- **Type scale**: large title 32-34px bold, section header 20px semibold, body 16-17px, caption 13px.
- **Surfaces**: layered backgrounds (base / elevated card / sheet), 20px card radius, subtle 1px hairline separators.
- **Iconography**: consistent 24px stroke icons, 1.75px stroke weight.

## Screens
1. **Discover** — full-bleed map with price-pill pins; bottom sheet list of lodges syncs with map bounds; tapping a pin previews a card with hero photo.
2. **Stay detail** — editorial layout: full-width photo carousel, serif title, amenity chips, sticky 'Check dates' bar; story block about the hosts.
3. **Date picker** — month view range selection with drag handles, minimum-stay rules shown inline, price-per-night dots under dates.
4. **Review & pay** — fare breakdown card (nights / cleaning / taxes), promo field, book button with optimistic 'Requesting…' state.
5. **Trips** — upcoming stay cards with countdown, one-tap 'Directions', past stays as a small archive.

## Interactions & Motion
- Map↔list sync: selecting a card pans the map with a spring; the pin enlarges and lifts the card.
- Date range: selecting start then end animates the in-between fill; invalid ranges shake gently with an inline hint.
- Photo carousel has parallax on scroll-in; hero photo Ken-Burns breathes on the detail screen.
- Booking confirmation: a minimal stamp animation ('Confirmed') — no confetti, this is quiet luxury.
- Spring physics for all transitions (stiffness ~260, damping ~24); never linear easing.
- Skeleton loaders for every async surface; optimistic UI for user actions.

## Details That Matter
- Price pills on the map use tabular figures and stay legible at small sizes.
- Offline: cache last-viewed lodge details for the subway-browsing user.
## Tech & Quality Bar
- React Native + Expo + TypeScript (or Flutter if requested). Reanimated for 60fps gestures.
- Dark & light mode from a single token file. Safe-area aware on all screens.
- Haptics on key confirmations. Offline-tolerant: cache last data, show stale-while-revalidate.

Você também pode gostar

Verified DR - Verified Domain Rating for buildpromptkit.comBuildPromptKit - AI prompts that ship real UI — every one has a live demo | Product HuntBuildPromptKit — AI Website & App Prompts - Featured on YizhanFeatured on saasfame.comFeatured on Twelve Tools