Mockup trasparenti: utili ovunque tranne che negli store

Un mockup esportato con sfondo trasparente si può posare su qualsiasi pagina, diapositiva o sezione colorata e sembrerà al suo posto. È la risorsa più riutilizzabile che puoi produrre, ed è anche il formato che entrambi gli store rifiutano.

Dove la trasparenza rende

Testate web il cui sfondo di sezione è definito in CSS. Diapositive che cambiano colore da presentazione a presentazione. Pagine di marketing dove la stessa immagine compare in tre sezioni. Email, dove non controlli lo sfondo. In tutti questi casi un PNG o WebP trasparente significa un’esportazione invece di una per sfondo, e sopravvive a un cambio di marca senza rifare il render.

Il problema dell’ombra

L’ombra di contatto appartiene allo sfondo, non al dispositivo: esportare con alfa o la elimina o cuoce una macchia semitrasparente che stonerà su fondo scuro. Due risposte praticabili: includere l’ombra nell’alfa e posare l’immagine solo su sfondi vicini per valore a quello del render, oppure esportare senza ombra e aggiungerla via CSS. Per una risorsa riusata su sfondi molto diversi la seconda è più sicura.

Non mandare mai alfa a uno store

Gli screenshot App Store e l’immagine in evidenza di Play non possono avere canale alfa. Una risorsa per il resto perfetta fallisce per un angolo trasparente, e il messaggio d’errore non sempre lo dice chiaramente. Tieni due esportazioni per risorsa: un master trasparente per le tue superfici e una versione appiattita per gli store.