# UX Flows

## Main app surfaces

### 1. Trip planner

Map plus side panel:

- start/end/import GPX,
- dates,
- bike/load type,
- daily target,
- surface preference,
- sleep preference,
- water/food interval,
- routing strictness,
- bailout preference.

Output:

- route line,
- stage cards,
- warnings,
- POI layer toggles,
- export/offline actions.

### 2. Stage timeline

A vertical list of days:

```text
Day 1 — 74 km — 1,150 m climb — 38% unpaved
Sleep: campsite at km 72, hostel at km 78
Water: km 18, 51, 69
Food: supermarket km 42, bakery km 63
Warning: last reliable water before 11 km climb
Bailout: train station +5 km from route at km 58
```

### 3. Riding mode

Large simple panel:

```text
Next water: 12.4 km
Next food: 28.0 km, closes 18:00
Sleep Plan A: 31.5 km
Daylight left: 3h 40m
Bailout: train station 9.1 km detour
Warning: remote section starts in 6 km
```

Actions:

- reroute to water,
- reroute to sleep,
- skip climb,
- find bike shop,
- find bailout,
- report issue.

### 4. POI detail card

For a water point:

```text
Village fountain
Type: drinking water
Distance: 12.4 km on route
Confidence: Medium
Last confirmed: 18 days ago
Notes: Tap on cemetery wall; sometimes locked after 20:00
Actions: Navigate / Save / Report unavailable
```

### 5. Rule card

```text
Wild camping rule — Bavaria, Germany
Status: Restricted / unclear
Summary: Overnight camping outside designated sites may be restricted. Bivouac rules vary by land type and protected areas.
Confidence: Medium
Source: official/regional source URL
Last reviewed: 2026-06-01
App advice: prefer listed campsites/shelters; avoid protected-area bivouac unless locally permitted.
```

## Map layers

- Route/stages.
- Surface and roughness.
- Legal/access confidence.
- Water.
- Food/resupply.
- Sleep.
- Repair.
- Bailout.
- Local reports.
- Weather risk.
- Protected areas/local rules.

## Interaction principles

- Always show confidence and stale data indicators.
- Optimize for quick decisions during riding.
- Avoid hiding critical logistics behind filters.
- Default to route-corridor relevance instead of global POI clutter.
- Explain routing choices with concrete reasons.