Créer une maquette de smartphone pliable avec Duo Studio
Duo Studio est un outil open source qui crée des maquettes de smartphones pliables et des animations à partir de captures d’applications, directement dans le navigateur. Importez les écrans internes et externes, choisissez une position et exportez un visuel pour présenter votre produit. Le mode web permet d’explorer les sites qui autorisent leur intégration. Les images et les exports sont traités localement. L’outil n’exécute ni iOS ni votre application native.
Comment créer une maquette à partir de captures ?
- Dans Captures, importez l’image de l’écran interne. Ajoutez une image externe distincte si vous le souhaitez ; sinon, la moitié gauche de l’image interne est utilisée.
- Choisissez Ajuster pour conserver toute l’image, ou Remplir pour couvrir l’écran sans bandes. Réglez le cadrage et le zoom.
- Choisissez Pliage libre, Fermé, Paysage, Portrait, Assis ou Debout, puis attribuez des captures adaptées à chaque orientation.
- Prévisualisez avec le curseur de pliage et choisissez le format et la taille d’export. Le mode Avancé ajoute les réglages de fond et de caméra.
Quelles dimensions de captures préparer ?
Ces dimensions correspondent aux emplacements d’images et aux préréglages d’export utilisés par Duo Studio : 2853 × 2007 pixels pour l’écran interne en paysage, 2007 × 2853 en portrait, 1398 × 2034 pour l’écran externe en portrait et 2034 × 1398 pour la position debout. Les pixels des images diffèrent de la fenêtre CSS d’une page web. Ce sont des paramètres de l’outil, et non une certification matérielle ou une garantie d’acceptation sur l’App Store.
| Écran | Position | Pixels recommandés | Ratio |
|---|---|---|---|
| Interne · paysage | Pliage libre, paysage | 2853 × 2007 | 1.42:1 |
| Interne · portrait | Portrait, assis | 2007 × 2853 | 1:1.42 |
| Externe · portrait | Fermé | 1398 × 2034 | 1:1.45 |
| Externe · paysage | Debout | 2034 × 1398 | 1.45:1 |
Peut-on prévisualiser n’importe quel site ?
Le site doit autoriser l’intégration dans une iframe. Les restrictions Content-Security-Policy frame-ancestors et X-Frame-Options ne peuvent pas être contournées. Le navigateur se connecte directement au site demandé.
Les parties de l’écran plié peuvent utiliser des pages indépendantes ; les clics et le défilement ne sont alors pas synchronisés. Ouvrez entièrement l’appareil pour tester l’interaction. L’export demande l’autorisation de capturer cet onglet Duo Studio. Les vues sont capturées localement, le partage s’arrête, puis le fichier est généré.
Quels formats peut-on exporter ?
| Format | Usage | Résolution et fréquence |
|---|---|---|
| PNG | Image avec cadre, fond transparent facultatif | Taille de scène, 1600 × 1000, 1080 × 1350 ou 1200 × 1200 |
| MP4 / WebM | Animation H.264 / VP9 selon les encodeurs du navigateur | 30 i/s · côté maximal 1280 px |
| GIF | Animation en boucle | 12 i/s · côté maximal 640 px |
| ZIP | PNG des scènes importées et manifeste | Dimensions de chaque emplacement |
| PNG UI brut | Image originale sans cadre, vérification stricte | Dimensions identiques à l’emplacement requis |
Mes captures sont-elles envoyées à un serveur ?
Les images importées et les exports sont traités sur votre appareil. Le projet est enregistré dans le navigateur et peut être sauvegardé en .duo.json. Ce fichier contient les images originales : tenez-en compte avant de le partager. Sauvegardez-le avant d’effacer les données du navigateur. En mode web, les connexions au site choisi relèvent de ses propres pratiques de confidentialité.
Quelles sont les limites des images et animations ?
Images PNG, JPEG ou WebP : 4096 px par côté, 16 mégapixels et 20 Mo maximum. Les animations durent de 2 à 10 secondes, avec une pause facultative de 0 à 2 secondes à chaque extrémité. MP4 et WebM dépendent des encodeurs du navigateur. Les dimensions CSS du site et les pixels de l’image exportée se règlent séparément.
Est-ce un outil officiel Apple ?
Duo Studio est un projet open source indépendant, pas un produit Apple. Les sources des modèles et les licences figurent dans le dépôt public. Une maquette ne prouve pas la compatibilité de l’application avec un appareil réel. Pour l’App Store, consultez les exigences actuelles et effectuez de vrais tests sur appareil.