Mockup

I modelli sono presentazioni creative, spesso fotorealistiche, che mostrano come potrebbe apparire o funzionare un progetto nel mondo reale. In altre parole, l'implementazione di una qualsiasi di queste 4 tecniche di mockup professionale fornisce uno sguardo al futuro: un logo stampato su una borsa portata da acquirenti occasionali, un'app fatta scorrere da una mano invisibile o persino la vetrina di un negozio completamente brandizzato. Rendilo convincente, devi sapere come realizzare layout professionali. Qui ti diremo come farlo.

Sebbene siano costituiti da immagini, i layout di progettazione sono più efficaci quando raccontano una storia. La cura e i dettagli messi nella storia determineranno se il pubblico la apprezzerà o la metterà a dormire.

Ci sono due elementi che rendono vincente una tecnica di layout: l’impostazione creativa della scena e l’inclusione realistica del disegno. Abbiamo già trattato un argomento precedente con suggerimenti incentrati sulla formulazione di un concetto di layout e sulla scelta delle immagini giuste per raccontare una storia. In questo articolo, delineeremo brevemente gli aspetti tecnici della creazione di un mockup del tuo progetto utilizzando i 4 metodi di mockup più comuni.

Impaginazione del libro. Requisiti per la progettazione del libro.

1. Crea il tuo layout da zero. Mockup
-

Un layout personalizzato è un layout completamente personalizzato per un progetto specifico. Se desideri creare modelli unici, ti consigliamo questa tecnica migliori risultati. Dato che lo scopo di un mockup è la presentazione e, in ultima analisi, la persuasione (ovvero la vendita di un concetto di design), è ovvio che il mockup più persuasivo è quello progettato per un cliente specifico.

Ma ovviamente, creare modelli da zero per ogni progetto non è l’approccio più pratico. Ciò richiede molto impegno per qualcosa che è essenzialmente una presentazione unica risorsa. Anche questo è utile solo se il concetto di layout è molto originale: non ha senso scherzare con tutti questi problemi se il risultato è indistinguibile dal modello. Alla fine, spetta a te decidere se sei abbastanza appassionato del progetto o del cliente da fare il possibile per creare un modello unico nel suo genere.

Per un layout davvero personalizzato avrai bisogno di foto originali. Ciò ti consente di creare un layout di scena molto più vicino alla tua visione progettuale, mentre le foto stock per loro natura sono progettate per ambientazioni e scene generali. Se hai l'attrezzatura, l'esperienza e il tempo, puoi scattare le tue fotografie. In questo caso, dovresti fare un brainstorming o abbozzare la scena in anticipo, in modo simile a come potresti realizzare lo storyboard di un film.

Qual è il margine di vendita? e come calcolarlo

Potresti anche assumere un fotografo professionista, ma questa è ovviamente una spesa che non sarà praticabile per ogni designer: è più probabile che ciò accada nell'ambito di un'agenzia di design che lavora con clienti aziendali. Un'ottima alternativa è utilizzare foto che appartengono al cliente: ad esempio, il designer Top Level goopanic applica il suo marchio Academia de Artes a foto reali della scuola e dei suoi studenti. Anche se queste foto non sono così Alta qualitàCome foto d'archivio professionali, daranno al cliente un'idea più autentica di come sarà alla fine il suo design.

Una volta che hai le tue foto, dovrai utilizzare un software di fotoritocco per incorporare il tuo disegno nell'immagine. Il software più comune per questo scopo è Adobe Photoshop, ma Affinity Photo e Gimp sono alternative affidabili. Questi programmi forniscono molti strumenti e guide per ottenere risultati realistici e sostanzialmente si riducono a quanto segue:

• strumenti di trasformazione per far sì che il design corrisponda all'immagine
• metodi di fusione per incorporare la texture della foto originale
• livelli di regolazione per lavorare con illuminazione, colore e contrasto

 

Se vuoi lavorare con animazioni personalizzate, usa un software di animazione come After Effects: ad esempio, puoi usare le maschere di livello per creare animazioni a scorrimento per le app su una foto del telefono.

Strumenti richiesti

• Fotografia e/o attrezzatura fotografica
• Software per fotoritocco (Photoshop, Foto Serif, Gimp)
• *Opzionale* Software di animazione (Adobe After Effects)

spese

• Da moderato ad alto

Pro

• Il risultato sono modelli più specifici e fedeli alla visione del designer.
• Immagini di origine; nessuna filigrana o necessità di acquistare licenze

Contro

• Costoso e richiede molto impegno; richiede una conoscenza più approfondita del software
• Inefficace e dispendioso in termini di tempo
  Stampa per ufficio per affari dalla tipografia Azbuka.

2. Crea modelli di layout riutilizzabili. Mockup.
-

I modelli di layout personalizzati sono layout creati dai designer stessi, ma sono sufficientemente generici da poter essere utilizzati in più progetti. Come abbiamo sottolineato nell'ultima sezione, creare mockup personalizzati per ogni progetto può essere poco pratico e costoso, ma questo metodo consente al progettista di creare mockup originali e riutilizzabili a un costo inferiore.

Questo è anche un modo per il designer di aggiungere il proprio marchio personale o stile ripetitivo nelle presentazioni ai clienti.

Il processo per creare modelli di mockup è essenzialmente lo stesso della creazione di mockup personalizzati: è comunque necessario acquistare una foto e utilizzare un programma di fotoritocco per incorporare il design. Una differenza è l'approccio alla fotografia del tuo layout: dovrebbe essere abbastanza vago da funzionare per più clienti; ad esempio, invece di utilizzare scenari identificativi, gli sfondi del layout della designer di alto livello Daria V. si concentrano su accenti illustrati che possono essere modificati con ogni progetto.

Ciò può aiutare a raggruppare i clienti in base a temi comuni, come l'industria (potresti avere un modello di layout per tutti i clienti proprietari di un ristorante, uno per tutti i clienti al dettaglio, ecc.). Ciò semplifica la selezione di immagini che funzioneranno in contesti comuni.

Generatori di layout di libri: 5 strumenti GRATUITI

Per i prodotti fisici, alcuni designer creano rendering vuoti del prodotto utilizzando software 3D come Adobe Dimension, e questo ha l'ulteriore vantaggio di consentire la creazione di layout animati e ruotabili.

Per creare il layout del tuo modello in Photoshop, il tuo obiettivo è fondamentalmente impostare il documento in modo che il design possa essere facilmente sostituito in progetti futuri mantenendo tutte le tue impostazioni manipolazione. Photoshop ne fornisce due per questo strumenti utili:

Oggetti avanzati di Photoshop. Mockup.

Un oggetto avanzato è essenzialmente un contenitore che memorizza un'immagine in un documento collegato, consentendoti di apportare modifiche drastiche all'interno della composizione più ampia senza influire sull'immagine originale. Se sostituisci un'immagine in un oggetto intelligente, verrà aggiornata nella composizione con tutte le modifiche applicate.

Quindi, con i mockup, tutto ciò che devi fare è convertire il livello di progettazione in un oggetto intelligente all'inizio del progetto (vai su Livello > Oggetti avanzati > Converti in oggetto avanzato). Successivamente, puoi semplicemente sostituire il disegno all'interno dell'oggetto intelligente la prossima volta che avrai bisogno di un layout.

Azioni di Photoshop. Mockup.

Le azioni registrano le modifiche apportate a un documento Photoshop in modo da poter ripetere tali passaggi con un clic di un pulsante, eliminando attività ripetitive. Pertanto, con un mockup, puoi utilizzare un'azione per registrare tutte le trasformazioni e gli effetti applicati a un disegno per farlo corrispondere a una foto e applicare le stesse modifiche a un altro disegno in futuro semplicemente facendo clic su un pulsante.

Strumenti richiesti

• Fotografia e/o attrezzatura fotografica
• Software di fotoritocco (Photoshop, Serif Photo, Gimp)
• *Opzionale* Software di modellazione di prodotti 3D

spese

• moderato

Pro

• L'uso ripetuto vale la pena di creare layout personalizzati.
• Immagini di origine; nessuna filigrana o necessità di acquistare licenze

Contro

• Richiede una conoscenza del software più avanzata
• Può essere uno spreco di sforzi se i risultati non sono sufficientemente diversi da un modello di terze parti.

3. Utilizza un sito Web per il generatore di mockup.
-

Un sito Web per la generazione di mockup è un servizio online che utilizza immagini stock e software AI per generare automaticamente un mockup da un modello di terze parti. In genere, tutto ciò che un designer deve fare è caricare il proprio progetto e il software si occuperà di tutte le questioni tecniche.

Questo metodo è di gran lunga la soluzione più economica e semplice, ma presenta alcuni svantaggi. Il layout risultante non sarà originale e, dato che molti designer hanno utilizzato lo stesso servizio, non è raro vedere le stesse immagini di layout apparire fino alla nausea in tutti i siti portfolio. Allo stesso tempo, può essere utile in caso di necessità e, a meno che il cliente non sia un fornitore di mockup di designer, probabilmente non gli dispiacerà.

Quando si sceglie un servizio, è necessario considerare quanto segue: prezzo, qualità e pertinenza. In termini di prezzo, molti generatori di mockup sono gratuiti, anche se dovresti stare attento agli inconvenienti nascosti come l'aggiunta di filigrane o una selezione limitata di modelli. Altrimenti il ​​prezzo è solitamente basato su modelli di abbonamentoe la maggior parte dei servizi che ho recensito sono compresi tra $ 10 e $ 20 al mese.

La qualità può dipendere dal gusto personale, ma dovresti dedicare un po' di tempo a studiare i layout utilizzati da altri designer e concorrenti per avere un'idea di cosa è intelligente e cosa è generico. Puoi anche utilizzare servizi come Trustpilot per trovare recensioni degli utenti che ti dicano, oltre al materiale promozionale, quanto bene funziona il servizio e quali sono i risultati effettivi.

Schermata della home page del generatore di mockup di design Smartmockups

Infine, alcuni di questi siti sono specializzati in determinati tipi di layout e dovrai sceglierne uno che sia pertinente ai tuoi progetti, soprattutto se stai acquistando un abbonamento. Ad esempio, Artboard Studio e Mockup Mark sono specializzati in stampa e impaginazioni vestiti. Servizi come AppMockUp e Mockuuups Studio sono specializzati in modelli di progettazione digitale. Nel frattempo, Smartmockups, renderforest e Placeit offrono modelli di mockup comuni sia per la stampa che per il digitale.

Strumenti richiesti

• Connessione Internet affidabile
• *Facoltativo* Iscrizione al layout del sito

spese

• Da libero a basso

Pro

• Rapidamente e senza sforzo; nessuna conoscenza del software richiesta
• La qualità a volte può essere vicina al layout personalizzato

Contro

• Crea un aspetto comune con le immagini utilizzate da molti progetti online.
• Il modello di abbonamento è utile solo se sono necessari più layout.

4. Utilizza un plug-in software per creare layout.
-

I plugin di mockup sono integrazioni di terze parti che si collegano al software di progettazione per creare mockup. Essenzialmente, queste applicazioni consentono ai progettisti di progettare e creare layout all'interno di un singolo programma, con l'ulteriore vantaggio che il progettista può utilizzare gli strumenti del programma per apportare modifiche al layout dopo che è stato creato.

È il meglio di entrambi i mondi: un modello economico, poco impegnativo e personalizzabile. Detto questo, questo metodo è generalmente destinato alla progettazione digitale e la maggior parte dei plug-in sono destinati a software di prototipazione di applicazioni come Schizzo , Figma и Adobe XD .

Esistono diversi servizi popolari che forniscono plug-in scaricabili, inclusi Angolo , Ruota и Cornici Mokup . Poiché questo software è scaricabile, di solito richiede un pagamento una tantum. Questo prezzo è solitamente più alto rispetto alla maggior parte dei siti di generazione di mockup, ma a lungo termine è inferiore poiché non si paga una quota di abbonamento.

Dovrai seguire le istruzioni specifiche del sito per scaricare e installare il plug-in nel tuo software. Da lì, avrai la possibilità di applicare il design dal tuo software al layout. Il processo è simile all'utilizzo di un sito web con un generatore di mockup: il plugin creerà automaticamente il tuo mockup e utilizzerai gli strumenti di personalizzazione per perfezionarlo.

Strumenti richiesti

• Software di progettazione (Sketch, Figma, Adobe XD)
• Download della licenza e del plugin

spese

• basso

Pro

• Rapidamente e senza sforzo; Richiesta poca conoscenza del software
• I modelli vengono creati nel software di progettazione come parte del processo di progettazione.

Contro

• Crea un aspetto comune con le immagini utilizzate da molti progetti online.
• I risultati non sono molto diversi dai generatori di mockup online

È tempo di creare modelli unici!
-

I modelli di design sono strumenti di presentazione incredibilmente potenti che non solo vendono un'idea di design, ma offrono anche allo spettatore una finestra su un futuro in cui quel design esiste già. Se fatto bene, il cliente sarà quasi costretto a rendere questo futuro una realtà.

Come affermato in questo articolo, esistono molti metodi per creare modelli e ognuno di essi ha il proprio vantaggi e svantaggi. Ma non importa come crei i tuoi layout, i risultati dipenderanno in ultima analisi dal progettista e dal suo impegno nel rendere realisticamente un layout che salti fuori dallo schermo.

 АЗБУКА

Come gestire con successo progetti in un business online