Cos'è ParkMate
App concept mobilità: mappa con posti segnalati, dettaglio con distanza e orario di liberazione, indicazioni stradali, recensioni e lista utenti in parcheggio. Versioni UI dark e light.
Case study · UX/UI · Mobilità urbana
Parcheggio urbano, in community
Concept app ParkMate: la community segnala posti liberi e orari di rilascio; gli automobilisti trovano parcheggio, ricevono indicazioni, leggono recensioni e vedono chi sta parcheggiando.
00
Overview
ParkMate riduce il tempo di ricerca parcheggio in città con segnalazioni community su mappa. Progetto UX/UI hi-fi in Figma (~1 mese), poi sospeso per vincoli economici del committente.
Cosa volevano
Demo credibile per investitori: trovare posto in pochi tap, passaggio rapido tra automobilista e utente che libera, fiducia tramite recensioni e visibilità di chi parcheggia.
Chi volevano raggiungere
Giulio Bianchi, automobilista: distanza, recensioni e orario di liberazione a colpo d'occhio. Elena Rossi, utente community: segnala e libera posto con handoff rapido.
Cosa volevano ottimizzare
Leggibilità mappa e card posto su sfondo scuro, handoff community in pochi tap, dual theme dark/light per uso diurno e notturno, fiducia tramite recensioni e lista utenti.
01
Low-Fid Linear Wireflow
Due percorsi complementari su ParkMate: automobilista che cerca posto e utente community che segnala o libera un parcheggio sulla stessa mappa.
Flusso automobilista: cerca mappa, dettaglio posto, indicazioni stradali, recensioni
Cerca mappa
Dettaglio posto
Indicazioni
Recensioni
Flusso community: mappa, dettaglio posto, fine sosta, lista utenti parcheggio
Cerca mappa
Dettaglio posto
Fine sosta
Lista utenti
02
User Interview
Due personas derivate dai flussi prodotto: automobilista e utente che segnala/libera posto, con bisogni tradotti in insight di design.
Persona derivata dal prodotto · User interview · Automobilista
Giulio Bianchi
Automobilista in città: vuole capire subito distanza, recensioni e quando si libera un posto, senza aprire più schermate.
Insight
-
01 Mappa con distanza immediata
«Quando cerco parcheggio voglio vedere subito quanto è lontano il posto e se vale la pena andarci. Niente pin generici senza contesto.»
Cosa abbiamo integrato: pin mappa con distanza, rating e orario stimato di liberazione visibili già dalla lista e dal dettaglio.
-
02 Dettaglio posto completo
«Prima di partire voglio sapere se il posto è vero, quante stelle ha e se qualcuno ha parcheggiato lì di recente.»
Cosa abbiamo integrato: card dettaglio con recensioni, lista utenti in parcheggio e CTA Indicazioni sempre in evidenza.
-
03 Indicazioni in un tap
«Ho scelto il posto: voglio aprire le indicazioni senza cercare un menu. Se cambio idea, torno alla mappa in un gesto.»
Cosa abbiamo integrato: CTA primaria Indicazioni nel dettaglio, header mappa persistente e back gesture coerente su dark e light.
Persona derivata dal prodotto · User interview · Utente community
Elena Rossi
Utente che segnala o libera posto: vuole passaggio rapido al prossimo automobilista, senza form lunghi o conferme ridondanti.
Insight
-
01 Fine sosta veloce
«Sto per partire: devo segnalare che libero il posto in due tap. Se sbaglio orario, correggo subito.»
Cosa abbiamo integrato: flusso Fine sosta con orario precompilato, conferma un tap e aggiornamento mappa in tempo reale.
-
02 Lista utenti parcheggio
«Voglio vedere chi sta parcheggiando vicino: così so se qualcuno aspetta il mio posto o se posso segnalarlo liberamente.»
Cosa abbiamo integrato: lista utenti con avatar, tempo di sosta e link rapido al dettaglio posto condiviso.
-
03 Dual theme per contesto
«Di giorno preferisco light in macchina, di sera dark fuori dal parcheggio. Stessi flussi, stessi posti.»
Cosa abbiamo integrato: UI kit dark (#0d1117) e light con stessa gerarchia, token blu #2f8fff e componenti mappa condivisi.
03
Project Roadmap
-
01
UX Research
Brief concept parcheggio urbano, analisi competitor e ipotesi modello community.
-
02
Initial User Flows
Personas Giulio ed Elena derivate dai flussi automobilista e community.
-
03
Wireframing
Wireflow lineare: mappa → dettaglio → indicazioni/fine sosta → recensioni → lista utenti.
-
04
Site map
Site map CTA: cerca posto, dettaglio, indicazioni, fine sosta, recensioni.
-
05
High-Fidelity UI Design
UI hi-fi Figma con palette blu scura, componenti mappa e varianti dark/light.
-
06
UI Deliverable
Concept sospeso: deliverable UI Figma completo, senza sviluppo app.
-
07
User Testing
Non eseguito: progetto interrotto per vincoli economici del committente.
04
Site map
Percorsi CTA in ParkMate: tre modi per l'automobilista e un flusso community lineare. Ogni freccia è un tap reale su mappa, dettaglio, indicazioni o fine sosta.
Flusso automobilista
Hub mappa · tre modi per esplorare, orientarsi o valutare un posto
Percorso A · Cerca posto
-
Mappa posti
ParkMate · mappa
-
Esplora · mappa
-
Dettaglio posto
/posto
-
Avvia indicazioni
-
Indicazioni stradali
/indicazioni
Percorso B · Recensioni
-
Mappa posti
ParkMate · mappa
-
Apri dettaglio
-
Dettaglio posto
/posto
-
Leggi recensioni
-
Recensioni posto
/recensioni
+ rating → commenti → torna al dettaglio
Percorso C · Indicazioni
-
Dettaglio posto
/posto
-
Avvia indicazioni
-
Indicazioni stradali
/naviga
Collegamenti trasversali
- Mappa → Dettaglio · tap pin o card lista
- Dettaglio → Indicazioni · CTA primaria
- Dettaglio → Recensioni · tab o link rating
Flusso community
Segnala o libera posto · passaggio rapido al prossimo automobilista
Flusso fine sosta
-
Dettaglio posto
/posto
-
Fine sosta
-
Posto in liberazione
/libera
-
Torna mappaoppureLista utenti
-
Utenti in parcheggio
community · handoff
Collegamenti trasversali
- Dettaglio → Fine sosta · CTA libera posto
- Fine sosta → Mappa · posto aggiornato
- Lista utenti → Dettaglio · tap riga
05
Product & design
Identità visiva ParkMate per demo concept: palette blu su dark #0d1117, tipografia Outfit e UI kit con varianti dark e light.
Wordmark ParkMate Blu primario su dark: stesso asset in header, hero e sezione design.
Palette
-
Blu ParkMate CTA primarie, pin attivi, link e accenti interattivi.
-
Dark background Sfondo app dark, hero case study e header sticky.
-
Surface Card posto, pannelli mappa e aree elevate su dark.
-
Accent chiaro Highlight secondari, stati hover e badge orario liberazione.
-
Testo on dark Titoli, body e label su sfondo scuro.
Tipografia
-
Outfit Hero H1, titoli sezione, numeri roadmap e nomi persona.
-
System sans Label, footer Utente/Admin, paragrafi e tabella decisioni.
Decisioni UX / UI
| Decisione UX / UI | Perché | Scartato |
|---|---|---|
| Mappa hub con distanza | Giulio decide in pochi secondi se vale la pena | Lista testuale senza mappa |
| Fine sosta in 2 tap | Elena libera posto senza form lunghi | Wizard multi-step |
| Recensioni nel dettaglio | Fiducia prima di avviare indicazioni | Recensioni in schermata separata obbligatoria |
| Dual theme dark / light | Leggibilità mappa di giorno e di notte | Solo dark mode |
↳
Schermate prodotto
Screenshot UI da Figma 2025: ogni schermata illustra una scelta di prodotto in ParkMate, con varianti dark e light.
Percorso Giulio · Mappa
Hub mappa community
Vista mappa dark con posti liberi, distanza stimata e accesso rapido al dettaglio. Punto di ingresso per automobilista e community.
Mappa Community
→ Scelte UX
Core · Dettaglio
Card posto completa
Distanza, rating, orario di liberazione e CTA Indicazioni in evidenza. Stesso layout su dark e light con token condivisi.
Dettaglio Indicazioni
→ Scelte UX
Percorso Giulio · Indicazioni
Indicazioni e contesto
Variante dettaglio con focus su percorso e azioni rapide: avvia navigazione o torna alla mappa senza perdere il posto selezionato.
Navigazione Contesto
→ User interview Giulio
Fiducia · Recensioni
Recensioni community
Rating, commenti e storico segnalazioni per validare il posto prima di partire. Accessibile dal dettaglio con un tap.
Recensioni Fiducia
→ User interview Giulio
Dual theme · Light
UI light diurna
Variante light per uso diurno in auto: stessi componenti, stessa gerarchia, contrasto ottimizzato su sfondo chiaro.
Coerenza tra dark e light riduce il costo di manutenzione del kit e accelera eventuale sviluppo futuro.
Light Dual theme
→ User interview Elena
Percorso Elena · Community
Lista utenti parcheggio
Elenco utenti attualmente in sosta: handoff community visibile, tap su riga per aprire dettaglio posto condiviso.
Community Handoff
→ User interview Elena06
Outcome
Obiettivi di design plausibili per il concept ParkMate: tempo di ricerca, handoff community e coerenza dual theme. Progetto UI completato, sviluppo non avviato.
<30s
Tempo ricerca posto
Da brief testuale a scelta posto credibile in meno di 30 secondi grazie a mappa con distanza e dettaglio unificato.
2 tap
Handoff fine sosta
Flusso community mirato in due tap: libera posto, conferma orario, aggiornamento mappa per il prossimo automobilista.
2 temi
Coerenza dual theme
Da mockup sparsi a UI kit Figma unificato con varianti dark e light e token condivisi.