{
  "schemaVersion": 2,
  "id": "53",
  "slug": "appointment-studio",
  "name": "Appointment Studio",
  "brand": "COMMON / Barber studio",
  "family": "Small business",
  "status": "ready",
  "thesis": "Choose the person first; find the time that fits.",
  "suitableFor": [
    "Barber",
    "Hair salon",
    "Beauty",
    "Tattoo studio"
  ],
  "character": "Expressive",
  "traits": {
    "composition": "black and peach editorial staff roster with a time-slot ledger",
    "navigation": "Staff roster followed by professional, service, day and time selection",
    "typography": "Space Grotesk",
    "density": "Medium",
    "imagery": "Working-barber photograph and clearly labelled fictional staff portraits",
    "surface": "Blush editorial panels with a dark service-menu band",
    "motion": "Minimal"
  },
  "effort": "Medium",
  "definingFeatures": [
    "Staff profiles",
    "Service menu",
    "Staff-first calendar"
  ],
  "adaptableChoices": [
    "Verified business content",
    "Brand and subject",
    "Equivalent licensed typefaces"
  ],
  "discovery": {
    "industries": [
      "Barber",
      "Hair salon",
      "Beauty",
      "Tattoo studio"
    ],
    "visitorGoals": [
      "Find an appointment"
    ],
    "conversionActions": [
      "Book an appointment"
    ],
    "siteSize": "Service site",
    "interactionTypes": [
      "Staff directory",
      "Booking calendar"
    ],
    "keywords": [
      "Barber",
      "Hair salon",
      "Beauty",
      "Tattoo studio",
      "Book an appointment",
      "Service site",
      "Staff profiles",
      "Service menu",
      "Staff-first calendar",
      "small business",
      "local business",
      "appointment based",
      "booking",
      "calendar"
    ]
  },
  "patterns": [
    "Staff profiles",
    "Service menu",
    "Staff-first calendar"
  ],
  "entryRoute": "/preview/53-appointment-studio/start",
  "states": [
    {
      "key": "book",
      "label": "Choose an appointment",
      "route": "/preview/53-appointment-studio/book"
    },
    {
      "key": "confirmation",
      "label": "Booking summary",
      "route": "/preview/53-appointment-studio/confirmation"
    }
  ],
  "referenceImages": [
    {
      "file": "/previews/53/desktop.jpg",
      "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/53/056a938c3f9327cd-desktop.jpg",
      "route": "/preview/53-appointment-studio/start",
      "viewport": {
        "width": 1440,
        "height": 1000
      },
      "state": "start",
      "fixture": "deterministic-2026-11-v1",
      "sourceRevision": "sha256:aede09874daa733c7b0367ced65bfb66191a5e68dae04540c80ee0a760e831e0",
      "sha256": "056a938c3f9327cdac01acf9410c46ed0147dbc8ad2675e7e22a1305ec3862fa",
      "fullPage": false
    },
    {
      "file": "/previews/53/mobile.jpg",
      "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/53/0a3d0a05c4014584-mobile.jpg",
      "route": "/preview/53-appointment-studio/start",
      "viewport": {
        "width": 390,
        "height": 844
      },
      "state": "start",
      "fixture": "deterministic-2026-11-v1",
      "sourceRevision": "sha256:aede09874daa733c7b0367ced65bfb66191a5e68dae04540c80ee0a760e831e0",
      "sha256": "0a3d0a05c4014584c75dae0947379ad1626c8b27ad1ae4a5f2a78b4cd5386e34",
      "fullPage": false
    },
    {
      "file": "/previews/53/detail.jpg",
      "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/53/ab383a4b58a2a4e0-detail.jpg",
      "route": "/preview/53-appointment-studio/book",
      "viewport": {
        "width": 1440,
        "height": 1000
      },
      "state": "book",
      "fixture": "deterministic-2026-11-v1",
      "sourceRevision": "sha256:aede09874daa733c7b0367ced65bfb66191a5e68dae04540c80ee0a760e831e0",
      "sha256": "ab383a4b58a2a4e08196cdd89db84c96e25903f81cac1e1bb270a8541d67dee4",
      "fullPage": false
    },
    {
      "file": "/previews/53/full-page.jpg",
      "url": "https://drew-site-design-library.t3.tigrisfiles.io/references/53/eec7d4657715cc81-full-page.jpg",
      "route": "/preview/53-appointment-studio/start",
      "viewport": {
        "width": 1440,
        "height": 1000
      },
      "state": "start",
      "fixture": "deterministic-2026-11-v1",
      "sourceRevision": "sha256:aede09874daa733c7b0367ced65bfb66191a5e68dae04540c80ee0a760e831e0",
      "sha256": "eec7d4657715cc81d7acbe0570f875d0a7052c0a4649b10ac4ddacd3a81c86e5",
      "fullPage": true
    }
  ],
  "sourcePath": "src/designs/53-appointment-studio",
  "neighbours": [
    "09",
    "62"
  ],
  "palette": {
    "page": "#f5e9df",
    "surface": "#ffffff",
    "ink": "#262221",
    "accent": "#713b31"
  },
  "fonts": [
    "Space Grotesk",
    "DM Sans"
  ],
  "brief": "**Philosophy and fit.** Choose the person first; find the time that fits. Built for barber, hair salon, beauty, tattoo studio. The visitor’s next step is to book an appointment.\n\n**Visual grammar.** Use a black and peach editorial staff roster with a time-slot ledger. Preserve the hierarchy of staff profiles, service menu, staff-first calendar; these patterns solve this business’s actual decision, rather than supplying interchangeable decoration.\n\n**Sample and interaction.** COMMON / Barber studio is a fictional demonstration. The entry page establishes a complete visual direction, with choose an appointment and booking summary as supporting states. Inputs use local deterministic fixtures; no request, order, application or payment is sent.\n\n**Responsive behaviour.** On a phone, keep the primary decision first, stack facts with explicit labels, preserve the order of the workflow, and provide comfortably sized controls. Wide diagrams scale; tabular facts retain their labels.\n\n**Adaptation.** Replace the fictional brand, prices, availability, qualifications and claims with verified client information. Preserve staff profiles, service menu, staff-first calendar. Use imagery to explain the place, people, work or product, with deliberate crops and honest captions. Do not turn this into a generic hero-and-card layout.\n\n**Identity and adaptation.** The staff roster is the central decision. Portraits lead to each professional’s availability, while a priced service menu sets expectations before booking.",
  "scope": "Complete visual reference with local sample interactions; no production business backend.",
  "downloadUrl": "/downloads/53-appointment-studio.zip"
}