Skip to content

M1 — Day plan (Visitacity pattern)

Status: agreed · Last session: 2026-09-27

Sources: requirements.md M1, M11, M13, M14 · decisions.md P17, P34, P35, A13 · prototype review 27 Sep (founder's screenshot of the Annapurna Circuit trip, web width).

Who and the job

  • Traveller (group member, view-only): "What are we doing today, when, and where do I need to be?"
  • Group leader (view-only, shares the link): "Does this plan look right and exciting enough to send to my group?"
  • NepWalk team (edits): "Shape each day quickly — add, move, fix stops — and see gaps before the leader does."

Value

This screen is the product: it is what the leader forwards and what travellers open every morning. If it is cramped, repeated or empty-looking, NepWalk looks like a spreadsheet, not a trip. It is also the demo that makes mentors and vendors understand NepWalk.

Placement — and why

Element Mobile Tablet / web Why
Day navigation Top tabs "Day 1 · Wed 1 Apr", scroll sideways Left list only: "Day 1 · Kathmandu to Besisahar · Wed 1 Apr". No top tabs One way to move between days per screen size. The 27 Sep review found tabs and list repeating the same thing on web
Day title + date Under the tabs Top of the main column Says where you are
Stop cards Full width, photo on top Main column, photo left, text right (row card) More stops visible at once on wide screens; photo-on-top works on a narrow phone
Day map (M13) Collapsed "Map" button above the cards Right column, numbered pins + tonight's hotel Fills the empty space with something useful — the Visitacity pattern
Travel between stops Slim line between cards Same "How do I get to the next place, how long"
Tonight's stay (P17) One line under the day title, tap for the hotel card Same Travellers learn the day's base first (changed 28 Sep; was last card)
Previous / next day Swipe sideways Arrow buttons on the edges of the main column The old pagination footer took a whole row for little value
Add a stop (editor only) Floating "+" → bottom sheet "+ Add stop" button in the day header → right drawer Never covers content on web; thumb reach on phones (28 Sep)
Edit / delete / drag (team only) On the card, behind "…" On hover Leaders and travellers see a calm plan, not controls

Wireframe

Mobile

┌──────────────────────────────┐
│ ← Annapurna Circuit    Share │
├──────────────────────────────┤
│[Day 1][Day 2][Day 3][Day 4]→ │  tabs scroll sideways
│ Wed 1 Apr                    │
├──────────────────────────────┤
│ Kathmandu to Besisahar       │
│ [ Map ▾ ]                    │  opens the day map
│ ┌──────────────────────────┐ │
│ │        PHOTO             │ │
│ │  (credit, small)         │ │
│ ├──────────────────────────┤ │
│ │ 06:00 · 4 h          …   │ │  "…" = team only
│ │ Drive from Kathmandu     │ │
│ │ Private jeep, Prithvi Hwy│ │  story, 3 lines max
│ │ 💡 Leave before 6 — traffic│ │  one tip
│ └──────────────────────────┘ │
│   🚗 4 h · Besisahar         │  travel line
│ ┌──────────────────────────┐ │
│ │ PHOTO … next stop        │ │
│ └──────────────────────────┘ │
│ 🌙 Tonight: Hotel X, Besisahar│
│                         (+)  │  floating add, team only
└──────────────────────────────┘
   ← swipe → for other days

Web / tablet

┌────────────────────────────────────────────────────────────────────────────┐
│ ← Dashboard  Annapurna Circuit Trek  ● Published        Services  Share  👤 │
├──────────────────────┬───────────────────────────────┬─────────────────────┤
│ DAYS                 │ ‹  Day 1 · Wed 1 Apr 2026  ›   │                     │
│ ▌1 Kathmandu to      │    Kathmandu to Besisahar ✎    │     DAY MAP         │
│    Besisahar · Wed 1 │                                │   ① ② ③  🏨         │
│  2 Besisahar to      │ ┌────────┬──────────────────┐ │   numbered pins,    │
│    Chame · Thu 2     │ │ PHOTO  │ 06:00 · 4 h    … │ │   tonight's hotel   │
│  3 Chame to Lower    │ │        │ Drive from KTM   │ │                     │
│    Pisang · Fri 3    │ │        │ story, 2 lines   │ │  [Open in Google    │
│  …                   │ │        │ 💡 tip           │ │   Maps]             │
│ 12 Pokhara to        │ └────────┴──────────────────┘ │                     │
│    Kathmandu · Sun 12│   🚗 4 h                       │                     │
│                      │ ┌────────┬──────────────────┐ │                     │
│ TRIP                 │ │ PHOTO  │ 11:00 · 1 h      │ │                     │
│ 12 days · 62 stops   │ │        │ …                │ │                     │
│ ⚙ Trip settings      │ └────────┴──────────────────┘ │                     │
│                      │ 🌙 Tonight: Hotel X, Besisahar │                (+)  │
└──────────────────────┴───────────────────────────────┴─────────────────────┘

Tablet: the map column drops below the cards (or behind a "Map" button) when the width is too small for three columns.

States

  • No photo: same-height placeholder with a type icon (built 27 Sep). A stop not linked to a library place never has a photo — see TBD 1.
  • No stops on a day: "Nothing planned yet" + (team) "Add a stop"; (leader / traveller) "Free day".
  • No hotel tonight: (team) "+ Add hotel"; (leader / traveller) nothing — the team warning is not theirs.
  • Stops without coordinates: no travel line, no map pin; never a made-up time.
  • Long day (10+ stops): cards stay compact on web (row cards); no inner scroll inside the main column.
  • Loading: grey card skeletons, same sizes. Error: "Couldn't load this day" + Retry.

Rules and edge cases

  • Travel times: src/lib/travel-time.ts (27 Sep) — formula for short hops, Nepal table for long hops, no time for unknown flights.
  • Tonight's stay: the STAY item covering that night (nights.ts); last day shows none (P17).
  • Meals and activities are suggestions, not bookings (P34): shown as stops, no vendor on them.
  • Leader and traveller never see edit controls, helper warnings or booking detail (M5, P28).

Decided

  • Day navigation: top tabs on mobile only; left list on tablet / web.
  • Web day list: "Day N · title · date", with "Night: " small underneath (27 Sep).
  • Previous / next: swipe on mobile, edge arrows on web; the pagination footer goes.
  • Add a stop: floating "+" opening a drawer (web) or bottom sheet (mobile), team only.
  • Web cards: photo left, text right. Mobile cards: photo on top.
  • Stop photos: the team links a stop to a library place from the edit form (photo, credit, story, tip and coordinates come with it); an unlinked stop shows the placeholder (27 Sep).
  • Map column: cards use the full main area until M13 is built; the map column arrives with M13 (27 Sep).
  • Stop notes are for travellers (28 Sep): everyone on the trip sees them; only the editor writes them for now (P36). The form label changes from "Private notes for trip leaders" to "Notes for travellers — everyone on this trip sees them".
  • "+ Add hotel" presets the type "Stay" in the add form (28 Sep).
  • Travel line mode (28 Sep): the line after a transport item uses that item's mode (after a flight, ✈).
  • Tonight's stay sits at the top of the day (28 Sep, replaces "last"): one line under the day title — "🌙 Tonight: Hotel Barahi · Pokhara" — that opens the hotel card when tapped. Travellers learn the day's base first (luggage, where to go back). The editor sees "+ Add hotel for tonight" there when a night has none; others see nothing.
  • Add a stop (28 Sep, replaces the floating "+" everywhere): tablet / web has an "+ Add stop" button in the day header, where it never covers content; phones keep the floating "+" (thumb reach). Both open the same drawer / sheet.
  • Only places are photo cards (28 Sep): a PLACE item, or any item linked to a library place, is a card with photo. Meals, free time and other activities are a compact row — no photo block, warm background, type icon by the time — so the day's sights stand out.
  • Travel line is clearly visible (28 Sep): a readable pill ("🚗 10 min") with space above and below, not small grey text. Tapping it will later show where the vehicle comes from (backlog).
  • Layout (28 Sep): the day body sits in the same centred container as the day header; more space between items.
  • Transport stops (drive, flight, transfer): shown as a travel line between cards ("🚗 4 h · Kathmandu → Besisahar"), not as full cards (27 Sep).

TBD

  • None open.

Backlog (after launch)

  • Weather per day; sunrise / sunset.
  • Offline copy of the day on the phone (PWA, M6).
  • Undo after delete (M14 says "remove with undo"; today it is a confirm dialog).
  • Reorder by drag on mobile.
  • Tap a travel line or vehicle to see where the vehicle comes from and its driver (needs vendor / slot data, M15).

Tasks

Agreed 27 Sep; in tasks.md → Build day 11 (M1 revision).

  1. Web / tablet: remove the top day tabs; left list shows "Day N · title · date" + "Night: ". Mobile keeps the tabs.
  2. Remove the pagination footer; add edge arrows (web) and swipe (mobile).
  3. Web row card (photo left, text right); keep mobile photo-on-top; cards use the full main width.
  4. Transport items (FLIGHT, VEHICLE, TRANSFER) render as travel lines, not cards.
  5. Floating "+" → right drawer (web) / bottom sheet (mobile); remove the "Add new activity" bar.
  6. Edit form: link a stop to a library place (search by name / alias); linked stops show its photo, credit, story, tip.
  7. Hide edit / delete / drag and helper warnings for leader and traveller views.
  8. Empty-day, loading and error states.

Revision 2 — 30 Sep (UX review picks)

From the design research in NepWalk/docs/design-reference/nepwalk-journey-ux-2026-09-30/ (outside the repos). The founder took the concepts below; the rest of that review waits for real users.

  • The day flows hotel → stops → hotel: a travel line from last night's hotel to the first stop and from the last stop back to tonight's hotel, with the walk or drive time when both have coordinates; travel lines between stops name where they go next. A flight or drive that opens or closes the day keeps that movement.
  • Meal cards: "Meal not included · pay locally" (P34). Choosing from our restaurants stays as it is for now.
  • Tomorrow card at the end of each day; scrolling on past the end opens it only after a firm pull (about three wheel notches), with a filling bar and a reset on pause.
  • "Directions ↗" on each placed stop; "Times shown in Nepal time" under the date.
  • Phones: the day title keeps its own row; Share stays; Publish, Save as my Paila and Services move into a ⋯ menu; no big New Trip button inside a trip.
  • Fixes: "1 day" not "1 days"; "My trips" not "Trip Dashboard"; library place stories never assume the day of the trip (Garden of Dreams).
  • After the founder's test (30 Sep): every move reads "Drive: 10 min · Hotel Shanker → Boudhanath" in a pale green box, and moves without coordinates still show (names only, no time), so the flow never breaks; "Directions" routes from where the traveller is now, or from the previous stop / morning hotel when the browser blocks location; the same firm pull upward at the top opens the day before, landing at its end; Share gives feedback (phone share menu, or "Link copied"); the ⋯ menu opens inside the screen.
  • Edit mode (founder, 30 Sep): the trip page opens clean for the creator, as travellers see it; Edit turns on the editing tools (day rename and delete, Add stop as an outline button, card edit and reorder, add day, editor hints) and Done turns them off. Share stays in the header; Publish, Save as my Paila, Print day and Services sit in one ⋯ menu on every screen.
  • Stop card (founder, 30 Sep): number · title · time · duration · map icon (Directions) on one line; notes such as "Meal not included" below the title; the story as up to three bullet points with "Learn more ›" to the place page; tip and traveller note at the bottom of the card; a 256 px photo filling the card's height with the credit on it; cards without a photo get a small icon tile and stay short. Move lines have no box and sit centred between cards. "Tomorrow" is a quiet divider with a link, not a card.
  • Later, not now: tonight above the word of the day (decide over time); "Next in the plan" during the trip; stay and vehicle drawers; Contact trip team; serif titles and warm canvas (O7).

Revision 3 — 14 Oct (adding a stop in two taps)

Job: the trip creator adds a stop by choosing what it is and which place, then Save. No form to fill; times fill themselves and stay editable.

Decided (founder, 14 Oct):

  • Kind as chips, not a dropdown: Place · Food · Hotel · Travel · Free time · Other. One tap; Place is the default. Travel opens the move kinds already in the form (drive, flight, transfer).
  • Times fill themselves. Start = the end of the stop above (first stop of an empty day: 9:00). End = start + the place's typical duration (typicalDurationMinutes, already on every sight); without one: food 60 min, free time 60 min, other 60 min. Hotel and travel keep their own fields.
  • Times as one line, not four dropdowns: "09:00 – 10:30 · 1 h 30". Tap to change. Changing the start moves the end and keeps the duration; changing the end changes the duration.
  • "+" between stops, edit mode only (task 2): the sheet then knows its slot, so the start is the end of the stop above. Until task 3 the new stop takes the gap; overlaps are fixed by hand.
  • Shift the rest of the day (task 3): changing a stop's time, or adding one in the middle, moves every later stop of that day by the same amount, in one backend call (one transaction).
  • Later (backlog): ideal start windows per kind and place ("breakfast at 2 pm is unrealistic", P15 time profiles) and warnings when a stop does not fit its time.

Wireframe (phone; web is the same in the right drawer):

Add a stop                                  ✕
[Place] [Food] [Hotel] [Travel] [Free] [Other]

Which place?
[ Search a sight or an area, e.g. Boudhanath ]
Not in the list? Add a new place

09:00 – 10:30 · 1 h 30            Change ›
+ Add a note for travellers

        [Save & add another]  [Save]

States: no place chosen yet → the time line shows the suggested start only; a place without a typical duration → the kind's default; editing an existing stop → its saved times, no suggestion.

Tasks (build day 20):

  1. [fe] Kind chips; times suggested from the stop above + typical duration; one-line time with "Change"; "Save & add another" starts where the last stop ended.
  2. [fe] "+" between stops in edit mode, opening the sheet for that slot.
  3. [be]/[fe] Shift the rest of the day when a time changes or a stop is added in the middle.

Changed on the day (founder, 14 Oct), replacing earlier rows of this card:

  • No "Add stop" button (replaces "Add a stop" of 28 Sep): in edit mode a "+" sits above the first stop, between stops and below the last, on the day's dashed line; an empty day keeps its own "Add" button.
  • Header icons: Copy day, Share, Edit / Done as icons with a tooltip on hover (gone on click and after a few seconds). The ⋯ menu only holds "Make private". Save as my Paila and the trip setup moved to the trip's settings page (tabs).
  • Tonight's hotel (replaces the "Tonight" line of 28 Sep): the start / end hotel row opens the hotel's card in the side sheet.
  • The day's own tools: rename and delete on each day's row in the day list (web); phones keep them in the header.
  • Each kind asks one or two things: food — which meal and where; hotel — which hotel (a typed one shows as not confirmed), that night's town, nights as chips; travel — from (filled from the stop above) and to.
  • Later, in tasks.md → October backlog: smart hotel nights and check-in, a hotel link that fills the hotel, a typed hotel shown as not confirmed on the card, tooltips on phones.