È tempo di crunch e un cliente vuole vedere il loro design come apparirebbe su un iPhone o iPad. Non agitarti; ci sono un certo numero di mockup pronti all'uso sul mercato in attesa della tua personalizzazione.
Personalizzare un mockup è un modo semplice per mettere in mostra un progetto di design in un ambiente realistico che sicuramente impressionerà i clienti. L'utilizzo di un mockup può aiutare gli altri a visualizzare meglio come il design apparirà effettivamente con un'idea di scala. (A volte è facile dimenticare che non tutti vedono e immaginano un progetto nello stesso modo in cui lo si fa.)
Se non hai mai personalizzato un mockup, all'inizio potrebbe essere un po 'intimidatorio, ma lo illustreremo.
Seleziona un Mockup
Il primo passo è scegliere un mockup che funzioni per i tuoi progetti e il tuo flusso di lavoro. Le opzioni su cui riflettere includono il formato e il dimensionamento del file, nonché il design del mockup e se completeranno il tuo progetto. Alcuni prototipi sono dotati di una singola immagine per inserire i disegni, mentre altri sono disponibili in più di un formato kit con più modelli e opzioni.
Qui ci sono alcuni buoni posti per iniziare a cercare un ottimo design di mockup:
- Mockup Templates ha una grande collezione di mockup vari e gratuiti
- 100+ iPhone PSD e mockup vettoriali
- 100+ iPad Mockup: PSD, Foto e Vettori
- 100+ MacBook PSD e mockup vettoriali
- 50+ Mockup e grafica di Apple Watch
- 40+ iMac Mockup: PSD, Foto e Vettori
Pensa alle dimensioni e alla scala
Prima di acquistare o scaricare un mockup, pensa a come pensi di usarlo. Sarà inviato via email per una rapida visualizzazione o stampato su cartellone per una presentazione in sala riunioni? Questo ti aiuterà a determinare se puoi usare un mockup PSD più piccolo o se hai bisogno di una versione vettoriale. (Personalmente, scelgo sempre il vettore perché non si sa mai cosa potrebbe apparire e io odio arrampicarmi all'ultimo minuto).
L'altra considerazione del formato è quanto sei comodo con il software in cui modifichi il design. Le versioni PSD richiedono una buona conoscenza di Adobe Photoshop e l'uso dei livelli, mentre i formati vettoriali sono in genere modificati in Adobe Illustrator.
Scegli un ambiente realistico
Gli sfondi dei prototipi possono variare da un iPhone o iPad su uno sfondo bianco a opzioni con una visualizzazione fotografica realistica come una mano che tiene un telefono.
Un ambiente realistico può aiutare un cliente a immaginare il disegno come sarebbe effettivamente usato - ed è uno di quei trucchi di presentazione? che può wow. Un mockup senza sfondo si concentra esclusivamente sul design, che è quello che molti designer preferiscono. Ci sono anche versioni nel mezzo, con iPhone o iPad in cima alle immagini di sfondo che quasi cadono, come un tavolo o uno schema sottile.
Complimenti al Design
Indipendentemente dallo stile di mockup che scegli, dovrebbe completare il design. Non utilizzare uno sfondo woodgrain per un tema a spazi distanti; la giustapposizione è stridente. (Uno sfondo a grana di legno con un disegno basato sulla natura sarebbe più appropriato).
Non solo il tuo progetto comunicherà, ma quando utilizzi un modello la qualità generale della presentazione dice qualcosa anche sul progetto.
Prepara il tuo design
Il più grande passo nella preparazione del tuo design per un modello è la creazione di una copia per quel dispositivo di dimensioni. Non importa in che tipo di ambiente si costruisce il sito Web o l'app.
Per i prototipi PSD, puoi fare qualcosa di semplice come fare uno screenshot del design.
Per i formati basati su vettori, devi solo assicurarti che l'immagine sia abbastanza grande per ciò che pensi di fare con il mockup. (A volte uno screenshot non è sufficiente).
Se si utilizza la stessa suite di software, ad esempio Adobe, per questi progetti lo spostamento di un disegno in un prototipo può essere semplice come una copia e incolla. (Veramente!)
Unisci il modello e il design
Dopo aver creato un modello e un modello, dovrai unire i due in un unico file per la personalizzazione completa. La cosa bella della maggior parte dei mockup di iPhone e iPad è che sono fatti apposta per farti fare tutte le modifiche che desideri con i layer raggruppati e organizzati.
Apri il Mockup e il Design
Potrebbe essere necessario decomprimere il mockup per iniziare. Aprire il file nel software appropriato.
Apri il tuo design, o crea varianti, o prendi lo screenshot che userai per il mockup (questo è il metodo preferito da molti principianti per rendere le strutture di file meno goffe).
Scopri la struttura del file
Una volta entrato nel mockup dell'iPhone o dell'iPad per la prima volta, ti consigliamo di guardarti intorno per provare la struttura dei file.
Aggiungi il tuo design
Allora sei pronto per aggiungere il tuo design. Si desidera stabilire un buon set di flusso di lavoro e pratiche di file in modo da poter utilizzare ripetutamente un mockup con facilità. Ecco un flusso di lavoro di personalizzazione suggerito:
- Creare una nuova cartella, denominarla in base al progetto e aggiungere gli elementi di progettazione alla nuova cartella? o
- Aggiungi i tuoi elementi di design alla posizione pre-etichettata nel modello (molti modelli includono una cartella preimpostata)
- Regola la posizione in modo che il mockup sia nel livello giusto (in genere vicino al retro)
- Ruota, inclina o scala in base alle esigenze per adattarsi al modello
- Disattiva tutti i livelli non necessari
- Salvare
Conclusione
Quindi, dove trovi un mockup di iPhone o iPad di qualità? Cosa dovresti aspettarti di pagare?
Puoi trovare alcuni dei migliori modelli qui (tutte le immagini di questo post provengono da queste raccolte):
- 100+ iPhone PSD e mockup vettoriali
- 100+ iPad Mockup: PSD, Foto e Vettori
- 100+ MacBook PSD e mockup vettoriali
- 50+ Mockup e grafica di Apple Watch
- 40+ iMac Mockup: PSD, Foto e Vettori
I modelli variano nel prezzo dal kit gratuito a più versioni in formati scalabili che sono in genere meno di $ 20.(Molte versioni gratuite hanno un bell'aspetto ma sono adeguate solo per la visualizzazione digitale.) Avrai un sacco di utilizzo da questi strumenti e utilizzando un set comune di mockup, la preparazione dei disegni diventerà parte del tuo flusso di lavoro.
iPad Mockups
Un bellissimo modello di iPad può essere un ottimo modo per mostrare la tua app per iPad, il sito Web reattivo o il design dell'interfaccia. Tutto ciò che è stato progettato per un tablet sembra ottimo in un mockup di iPad e questa serie ti aiuta a iniziare. Trova i migliori modelli di iPad per i diversi modelli e scopri come utilizzarli!