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 test su mobile in Proyecta si articola su due livelli: l’anteprima responsive nel builder e il test 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 | 390 × 844 |
Passa da una modalità all’altra durante la modifica per individuare subito i problemi di layout. È il modo più rapido per scovare bug responsive evidenti (overflow, griglie rotte, pulsanti non cliccabili).
Aprilo sul telefono con un codice QR
Sezione intitolata “Aprilo sul telefono con un codice QR”Il modo più veloce per testare su un dispositivo reale è la scheda Mobile → Test della dashboard. Una volta pubblicata l’app, mostra un codice QR — inquadralo con la fotocamera del tuo telefono per aprire l’app live istantaneamente. C’è anche un pulsante Copy link se preferisci inviarti direttamente l’URL. (Se non hai ancora pubblicato, la scheda ti invita a farlo prima — il test su dispositivo richiede un URL live.)
Testa su un dispositivo reale
Sezione intitolata “Testa su un dispositivo reale”Il selettore di viewport simula soltanto le dimensioni — non simula l’input touch, la latenza reale, le peculiarità del browser mobile o i comportamenti specifici della 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 sottodominio
*.proyecta.live - Apri l’URL nel browser del tuo telefono
- Se hai aggiunto il supporto PWA, scegli Add to Home Screen e testa l’esperienza installata
- Percorri i flussi che ti interessano
Cosa puoi rilevare solo su un dispositivo reale
Sezione intitolata “Cosa puoi rilevare solo su un dispositivo reale”- Dimensioni delle aree di tocco — le dita sono più grandi dei puntatori del mouse
- Elementi sticky — le unità viewport si comportano diversamente con il chrome del browser mobile
- Input nei form — autocompletamento, tipi di tastiera, autocomplete
- Quirk di iOS Safari — problemi con
100vh, rimbalzo dello scroll, posizionamento fisso - Flusso di autorizzazione per le notifiche push — funziona solo su un’origine pubblicata tramite HTTPS in una scheda del browser di primo livello; non si attiva all’interno del pannello di anteprima del builder (anche quando l’anteprima è già servita tramite HTTPS).
- Prestazioni 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 modalità landscape. La maggior parte degli sviluppatori testa solo in portrait e non si accorge dei 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.