Auf Mobilgeräten testen

Nutze den responsiven Viewport-Umschalter im Builder für eine schnelle Kontrolle, veröffentliche die App dann und teste sie auf einem echten Gerät für alles, was mobilspezifisches Verhalten betrifft.

Beim Testen auf Mobilgeräten gibt es in Proyecta zwei Ebenen: die responsive Vorschau im Builder und das Testen auf einem echten Gerät über eine veröffentlichte URL.

Responsive Vorschau im Builder

Das Vorschau-Panel enthält einen Viewport-Umschalter in der Adressleiste:

Modus	Abmessungen
Desktop	Volle Fensterbreite
Tablet	768 × 1024
Mobile	375 × 667

Wechsle beim Bearbeiten zwischen den Modi, um Layout-Probleme frühzeitig zu erkennen. Das ist der schnellste Weg, um offensichtliche responsive Fehler zu finden (Überlauf, kaputte Grids, nicht tippbare Buttons).

Auf einem echten Gerät testen

Der Viewport-Umschalter simuliert nur Abmessungen – er simuliert keine Touch-Eingabe, realistische Latenzen, Eigenheiten mobiler Browser oder plattformspezifisches Verhalten. Für alles, worauf es wirklich ankommt (Touch-Interaktionen, Install-Prompts, Push-Benachrichtigungen, Kamera, GPS), solltest du auf einem echten Gerät testen:

Veröffentliche deine App auf ihrer *.proyecta.live-Subdomain
Öffne die URL im Browser deines Telefons
Falls du PWA-Unterstützung hinzugefügt hast, wähle Add to Home Screen und teste die installierte Erfahrung
Gehe die Abläufe durch, die dir wichtig sind

Dinge, die nur auf einem echten Gerät auffallen

Tipp-Zielflächen – Finger sind größer als Mauscursor
Sticky-Elemente – Viewport-Einheiten verhalten sich mit dem Chrome mobiler Browser anders
Formulareingabe – Autofill, Tastaturtypen, Autocomplete
iOS Safari-Eigenheiten – 100vh-Probleme, Scroll-Bouncing, feste Positionierung
Ablauf der Push-Benachrichtigungsberechtigung – funktioniert nur auf einer veröffentlichten Origin über HTTPS in einem Top-Level-Browser-Tab; innerhalb des Vorschau-Panels des Builders wird es nicht ausgelöst (auch dann nicht, wenn die Vorschau bereits über HTTPS ausgeliefert wird).
Performance auf echter (langsamerer) Hardware

Tipps zum Testen

Nutze die Entwicklerwerkzeuge deines Telefons. Safari auf macOS kann sich mit mobilem Safari für Live-Debugging verbinden; Chrome kann sich mit Android Chrome verbinden.
Teste auch im Querformat. Die meisten Entwickler testen nur im Hochformat und übersehen Querformat-Fehler.
Teste mit aktiviertem Energiesparmodus. Animationen und Timer verhalten sich dann anders.
Teste PWA-Push auf einem echten iPhone. Push-Benachrichtigungen unter iOS funktionieren nur aus einer PWA, die über Safari installiert wurde.