Travela.
Eén flow, offline.
Een reisplanner die van een reisstijl een dag-tot-dag programma maakt. Reisdagen, verplaatsingen, accommodaties en kosten in één visuele lijn, op één pagina per reis, deelbaar met één link. Werkt offline.
- Type
- Eigen product · Web app
- Bewijs
- Demonstratie
- Jaar
- 2025
- Rol
- Concept, interactieontwerp, ontwikkeling en de offline-architectuur
- Stack
- Next.jsTypeScriptVercel
- Doorlooptijd
- 3 weken
Wat een reiziger doorloopt.
De productsite is open en vraagt geen account. Dit is de route van reisstijl naar een programma dat je kunt delen.
- Stap 1
Reisstijl kiezen
Tempo, budget, interesses en gezelschap. Daaruit volgt het profiel waarop het programma gebouwd wordt.
- Stap 2
Bestemming en dagen
Aankomst, vertrek en het aantal nachten per plek. Meer vraagt de app niet.
- Stap 3
Dagprogramma lezen
Per dag verplaatsing, verblijf, activiteiten en kosten in één verticale lijn, per onderdeel aan te passen.
- Stap 4
Delen en offline
Eén link per reis. Wie hem opent leest hetzelfde programma, en na het eerste bezoek ook zonder verbinding.
Reizigersaantallen en voorbeeldreizen op de productsite zijn voorbeelddata om de interface te tonen, geen gemeten gebruik. Het offline-gedrag is wel zelf te controleren: zet je telefoon in vliegtuigstand en open de app opnieuw.
Te veel schermen, of helemaal geen structuur.
Reisplanners zijn óf touroperator-tools met te veel stappen, óf een platte lijst in Notion. Frequente reizigers hebben iets ertussenin nodig.
Travela is een eigen product, geen klantopdracht. Het bestaat om te bewijzen dat een web-app in de "breukmomenten" van een reis, wachtend op een vlucht, in de auto, in een hotelkamer zonder wifi, net zo betrouwbaar is als een native app. Dat vraagt een offline-first architectuur, en die is lastig achteraf toe te voegen. Daarom is hij hier vanaf de eerste commit zo ontworpen.
- 01Reisstijl kiezen: tempo, budget, wat je wel en niet wilt zien.
- 02Daaruit volgt een dag-tot-dag programma met verplaatsingen, verblijf en kosten.
- 03Eén pagina per reis, aan te passen en te delen met één link.
- 04Alles blijft werken zonder verbinding; sync zodra die er weer is.
Waar het product gewonnen werd.
Van reisstijl naar dagprogramma, in één flow.
Geen wizard van twaalf schermen. De reiziger kiest een stijl, geeft bestemming en dagen op en krijgt een programma dat per dag aan te passen is. Reisdagen, verplaatsingen, accommodaties en kosten staan in één verticale lijn, zodat je in één blik ziet waar je morgen bent en wat het kost.
Een service worker voor de hele app.
De hele app draait vanuit de cache, en de lokale state is de waarheid. Bewerkingen gebeuren eerst op het apparaat; een cloud-kopie is optioneel en synct zodra er verbinding is. Die keuze bepaalde de complete architectuur, van datamodel tot routing.
Eén link, één pagina, geen account voor de lezer.
Een reis is één pagina met één link. Wie de link heeft ziet hetzelfde programma en dezelfde kosten, ook zonder verbinding na het eerste bezoek. Geen exports, geen pdf die na de eerste wijziging verouderd is.
Wat het bewijst.
Een eigen product heeft geen opdrachtgever die een cijfer bevestigt. Wat wel te controleren is: zet je telefoon in vliegtuigstand en open de app.
Wat hier niet staat. Beschrijft de opgeleverde flow. Eigen product zonder externe opdrachtgever, dus zonder gemeten klantresultaat.
Voor klanten is dit het bewijs voor elke app die in het veld gebruikt wordt: inspecties, evenementen, bezorging, zorg aan huis. Dezelfde offline-architectuur, dezelfde sync-logica, zonder app-store.
Vier lagen, bewust klein gehouden.
| Laag | Keuze | Waarom |
|---|---|---|
| Framework | Next.js + TypeScript op Vercel | Statische app-shell, typed datamodel voor de reis |
| Styling | Tailwind CSS | Eén verticale lijn per dag, leesbaar op een telefoon |
| Offline | Service worker + lokale state | Werkt zonder verbinding, geen spinner |
| Sync | Optionele cloud-kopie | Delen en bewaren zodra er verbinding is; niet verplicht |
Voor een tool die mensen in de breukmomenten gebruiken, is offline-first geen feature die je later toevoegt. Het bepaalt het datamodel, de routing en de manier van delen. Die keuze in week 1 maken kostte een dag; hem in week 3 alsnog maken had het hele project gekost.
Plan een vergelijkbaar project.
Een web-app die ook zonder wifi werkt.
Een gesprek van 45 minuten: je hoort of jouw app zonder app-store kan, wat offline-first voor jouw proces betekent en wat er in 1–6 weken live staat. Vaste offerte binnen 48 uur.
Laatst bijgewerkt: 8 september 2026.