Testa su Mobile
Usa il selettore di viewport responsive nel builder per un controllo rapido, poi pubblica e testa su un dispositivo reale per tutto ciò che riguarda i comportamenti esclusivi del mobile.
Il testing mobile in Proyecta si articola su due livelli: l’anteprima responsive integrata nel builder e il testing su dispositivo reale tramite un URL pubblicato.
Anteprima responsive nel builder
Sezione intitolata “Anteprima responsive nel builder”Il pannello di anteprima include un selettore di viewport nella barra degli indirizzi:
| Modalità | Dimensioni |
|---|---|
| Desktop | Larghezza intera della finestra |
| Tablet | 768 × 1024 |
| Mobile | 375 × 667 |
Passa da una modalità all’altra mentre modifichi per individuare i problemi di layout in anticipo. È il modo più rapido per scovare i bug responsive più evidenti (overflow, griglie rotte, pulsanti difficili da toccare).
Testa su un dispositivo reale
Sezione intitolata “Testa su un dispositivo reale”Il selettore di viewport simula solo le dimensioni — non simula l’input touch, la latenza del mondo reale, le peculiarità dei browser mobile o i comportamenti specifici di piattaforma. Per tutto ciò che conta davvero (interazioni touch, prompt di installazione, notifiche push, fotocamera, GPS), testa su un dispositivo reale:
- Pubblica la tua app sul suo sottodominio
*.proyecta.live - Apri l’URL dal browser del tuo telefono
- Se hai aggiunto il supporto PWA, scegli Add to Home Screen e testa l’esperienza da app installata
- Percorri i flussi che ti interessano
Cose che puoi scoprire solo su un dispositivo reale
Sezione intitolata “Cose che puoi scoprire solo su un dispositivo reale”- Dimensioni delle aree tappabili — le dita sono più grandi dei puntatori del mouse
- Elementi sticky — le unità viewport si comportano diversamente con la chrome del browser mobile
- Input da form — autocompletamento, tipi di tastiera, autocomplete
- Quirk di iOS Safari — problemi con
100vh, scroll con rimbalzo, posizionamento fixed - Flusso dei permessi per le notifiche push — funziona solo su un’origine pubblicata tramite HTTPS in un tab del browser di primo livello; non si attiva all’interno del pannello di anteprima del builder (anche quando l’anteprima è già servita tramite HTTPS).
- Performance su hardware reale (e più lento)
Consigli per il testing
Sezione intitolata “Consigli per il testing”- Usa gli strumenti per sviluppatori del tuo telefono. Safari su macOS può connettersi a Safari mobile per il debug live; Chrome può connettersi a Chrome su Android.
- Testa anche in landscape. La maggior parte degli sviluppatori testa solo in portrait e non rileva i bug in landscape.
- Testa con la modalità risparmio energetico attiva. Animazioni e timer si comportano diversamente.
- Testa su un iPhone reale per le notifiche push PWA. Le notifiche push su iOS funzionano solo da una PWA installata tramite Safari.