1. Parti da uno screenshot pulito
Niente conta quanto lo screenshot. Un'immagine sfocata rovina anche la scena 3D più bella.
- Fallo sul dispositivo o nel simulatore, a piena risoluzione. Per un iPhone 17 Pro sono 1206 × 2622 pixel.
- Pulisci la barra di stato. Il simulatore di Xcode mostra 9:41 e batteria piena; la modalità demo di Android fa lo stesso.
- Usa contenuti veri. Il lorem ipsum e le liste vuote fanno sembrare il mockup incompleto.
Per un sito, cattura la prima schermata e non la pagina intera: il dispositivo mostra solo la parte visibile.
2. Decidi cosa vuoi ottenere
Lo stesso screenshot può diventare tre cose diverse, e questo cambia i passaggi successivi:
- un'immagine fissa (App Store, sito, slide);
- un video breve (lancio, Reels, anteprima App Store);
- il tuo design dentro una foto vera (social, portfolio).
Farle in tre programmi diversi richiede tempo. Abbiamo fatto Mockup Center perché tutte e tre nascano nella stessa app.
3. Scegli dispositivo e scena
Usa il dispositivo su cui la tua app gira davvero. Un'app iOS su un telefono Android è un errore piccolo, ma si nota. Mockup Center ha 65 dispositivi, tra cui iPhone, Samsung Galaxy, Google Pixel, iPad, MacBook, iMac e Apple Watch, tutti senza loghi.
I modelli arrivano con luce, angolo di camera e movimento già impostati. Se hai fretta, parti da lì e cambia quello che non ti piace.
4. Trascina lo screenshot
Trascina l'immagine sul dispositivo e riempie lo schermo. Se ne trascini diverse insieme, ognuna finisce sullo stesso dispositivo nella stessa scena. Con sei screenshot per l'App Store risparmi parecchio tempo.
Per un video, trascina allo stesso modo una registrazione dello schermo. Scorre sullo schermo mentre il dispositivo si muove.
5. Angolo, luce e sfondo
Qui piccoli cambiamenti fanno molta differenza:
- Angolo: una leggera rotazione è più viva della vista frontale. Tra 15 e 25 gradi di solito funziona.
- Luce: ruota la luce principale e l'ombra ruota con lei. Un'ombra verso dietro e verso il basso sembra la più naturale.
- Sfondo: un colore pieno o una sfumatura morbida non fanno concorrenza allo schermo. Un tono chiaro del colore del tuo brand funziona quasi sempre.
6. Aggiungi movimento (per il video)
Scegli le animazioni dal menu; ognuna parte dove finisce la precedente. Per accorciare una clip, trascinane il bordo sulla timeline. Se i modelli non bastano, imposta i tuoi fotogrammi chiave per dispositivo e camera.
Usa 9:16 per Reels e TikTok e 16:9 per YouTube e il tuo sito. Escono entrambi dallo stesso progetto.
7. Esporta
- App Store e Google Play: PNG o JPEG con sfondo. Gli store rifiutano le immagini trasparenti.
- Siti e slide: PNG trasparente, così il dispositivo si appoggia direttamente sulla pagina.
- Video: MP4. Se va in un programma di montaggio, ProRes 4444 o WebM trasparente.
Mockup Center esporta fino a 8K e scarica più immagini insieme in uno ZIP.
