Tours & experiências Demonstration project
Andorinha — small-group tours across Portugal with a live trip planner
A sun-washed editorial travel journal for a Lisbon-based tour company: warm ivory paper, swallow-black ink and a ceramic-cobalt accent over real photographs of Sintra, the Douro, Alfama, the Algarve, Belém and Óbidos — with a filterable six-tour catalogue and a tour-date-people booking flow whose total updates live.
feitura.pt/demo/andorinha — Live
A licensed guide who left the double-decker circuit runs seven-seat van tours from Lisbon to the whole country. The site has to sell slowness and credibility at once: real places in real photographs, six routes with actual stops, durations, group limits and prices in euros, filters by region and length, a booking flow a traveller can finish on a phone from a beach, the guide's RNAAT credentials front and centre, meeting points and what's included spelled out, and a private-tours door for weddings and offsites.
What's inside
- Sun-washed editorial design system — warm ivory paper, swallow-black ink, ceramic-cobalt accent, italic serif display and mono facts
- Eight real photographs of Portuguese places, art-directed with a consistent warm CSS grade and full author/licence credits in the footer
- Six-tour catalogue with real itinerary stops, durations, group limits and EUR prices
- Filter chips by region (Lisboa, Norte, Centro, Algarve) and duration (half-day, full day) with a live result count
- Tour planner booking flow: tour, date picker, people stepper and a summary card whose total updates live
- Tour cards pre-select the booking flow and scroll to it with one tap
- Guide profile with RNAAT registration, guide-interpreter and first-aid credentials
- Meeting points, included/not-included lists and a private-tours request form
- Full-bleed quote band over Ponta da Piedade, scroll reveals via IntersectionObserver, reduced-motion safe
- Fully bilingual PT/EN with a native toggle, AA contrast and 44 px touch targets
Build log
- Art direction — ivory/ink/cobalt tokens, italic serif and mono type scale, swallow logo SVG, photo sourcing and licence audit for the eight real places
- Warm photo grade system — CSS overlay tints, crops and captions; hero composition with Cabo da Roca and mono facts strip
- Tour catalogue content — six routes with real stops, durations, group limits and EUR pricing, written in PT-PT and EN
- Filter chips by region and duration with live count, tour card grid with dashed itinerary blocks
- Booking flow state machine — tour selection, date picker with minimum date, people stepper clamped to group limits, live total in the summary card
- Guide profile with RNAAT credentials, reviews strip, practical section and private-tours form on the cobalt band
- Quote band over Ponta da Piedade, scroll reveals, lazy-loading and dimension attributes on every photo, footer with full photo credits
- EN locale pass, contrast and touch-target audit, reduced-motion pass, mobile recomposition of the planner at 375 px
Stack
- Laravel
- Vue.js
- Inertia
- Tailwind CSS
- TypeScript
Lighthouse
93
Performance
100
Accessibility
100
Best practices
100
SEO