Share
Per questa quarta puntata della serie "Creazione di un set di icone di pittura digitale" creeremo una tavoletta grafica da zero, in particolare il tablet Cintiq Wacom da 12 ".Questo modello combina sensibilità al tocco e alla pressione, che consente agli utenti di disegnare direttamente sullo schermo Queste funzionalità lo rendono un favorito per gli illustratori. Andiamo al lavoro.
Di seguito sono elencate le cinque icone che stiamo creando in questa serie.
Dai un'occhiata all'icona finita per questo tutorial. Disegneremo il tablet e lo stilo completo di schermo lucido, pulsanti laterali e indicatori di stato a LED blu.
Avvia Photoshop e crea un nuovo documento RGB vuoto, scegliendo una tela quadrata da 512 x 512 px. Scegli un colore di primo piano grigio scuro quindi seleziona lo strumento Rettangolo arrotondato (U) dalla barra degli strumenti. Nella barra delle opzioni nella parte superiore dello schermo, immettere 30px per il raggio dell'angolo (1a), quindi fare clic tenendo premuto Alt e trascinando dal centro dell'area di disegno per creare il corpo principale del tablet (1b). Il tasto Alt consente di centrare forme, selezioni e trasformazioni attorno al mouse. È una scorciatoia da tastiera piuttosto utile quindi annotala. Quando sei soddisfatto della forma, fai clic con il pulsante destro del mouse sul livello e scegli Rasterizza livello. Chiamalo "base".
Stabiliamo ora che la luce proviene dall'alto. Ciò richiede di rendere tutte le superfici rivolte verso l'alto più chiare e tutte le superfici rivolte verso il basso più scure. Ci atteniamo a questa regola durante il tutorial.
Il corpo principale della tavoletta sembra piatto. Aggiungiamo un po 'di illuminazione scegliendo un grigio chiaro come colore di primo piano e mantenendo il precedente grigio scuro come colore di sfondo (2a). Premi G per selezionare lo strumento Gradiente. Prima di colorare il gradiente, però, blocchiamo la trasparenza del livello "base" facendo clic sul quadrato trasparente nella parte superiore della palette Livelli (2b). Ora possiamo tranquillamente dipingere su tutto il tablet perché saremo limitati ai pixel esistenti. Dipingi la sfumatura con un tratto verticale, da chiaro a scuro (2c).
La superficie del tablet non è così liscia. C'è una grana molto fine. Per crearlo vai su Filtro> Disturbo> Aggiungi disturbo e scegli 1%, Uniforme e Monocromatico (3a). Vedi il risultato (3b). Dobbiamo anche dare spessore al tablet, quindi fare doppio clic sul livello "base" per aprire la finestra Stile livello e fare clic su Smusso e rilievo. Fare riferimento all'immagine 3c per le impostazioni. Ora il tablet ha uno spessore e una curva delicata attorno ai bordi (3d).
Disegniamo la superficie del vetro. Seleziona nuovamente lo Strumento rettangolo arrotondato (U), ma questa volta Raggio su 10px (4a). Disegna un rettangolo più piccolo al centro in alto e chiamalo "vetro" (4b). Rasterizza, blocca la trasparenza e riempila con un gradiente verticale da un medio ad un grigio molto scuro (4c).
L'area attiva effettiva è leggermente più piccola del vetro e presenta spigoli vivi. Disegnalo con lo strumento Rettangolo e dargli uno stile Sovrapposizione sfumatura, grigio chiaro o medio (5a). Ora è anche il momento di aggiungere un logo nella parte inferiore del vetro. Usa lo strumento Testo (T) e un grigio molto chiaro (ma non bianco) per aggiungere il tuo logo personalizzato (5b).
Il vetro è inserito dalla superficie di plastica della base del tablet. Duplicare il livello "vetro" e denominare la copia "bordo di vetro". Imposta il riempimento su 0% (6a). I pixel effettivi del livello sono invisibili ma qualsiasi stile di livello che aggiungiamo non lo farà. Questo è un trucco perfetto quando vuoi semplicemente usare il contorno di un livello senza mostrare il suo contenuto. Quello che vogliamo è di nuovo Bevel and Emboss. Assicurati di scegliere l'opzione "Giù", che creerà una smussatura interna (6b). Ora il vetro ha un bordo duro e poco profondo dalla base (6c).
Per finire lo schermo aggiungeremo un grande highlight riflettente. Cmd-clic sul "vetro" (7a) quindi riempire un nuovo livello con bianco (7b). Chiamalo "reflection" (7c). Usando lo strumento Lazo poligonale (L) fai una selezione obliqua sul lato destro del livello (7d). Aggiungi la selezione come maschera (7e) quindi imposta la modalità di fusione del livello su Schermo, 20% di opacità (7f). Lo schermo è finito (7g), quindi possiamo raggruppare tutti i livelli correlati ora (7h).
Per la luce a LED, seleziona lo strumento Ellisse (U) e disegna un'ellisse blu di 7x3 pixel nell'angolo in alto a sinistra del tablet (8a). Chiamalo "LED 1", quindi aggiungi uno stile di bagliore esterno (8b) e bagliore interno (8c). Ora abbiamo una bella luce di stato luminosa (8d).
Duplica la luce LED e aggiungi alcuni simboli sotto di loro. Crea il tuo o fai riferimento alle foto del Cintiq attuale.
Ai pulsanti laterali. Per prima cosa facciamo la touch strip. Scegli lo stesso grigio del livello "base". Utilizzando lo strumento Rettangolo arrotondato (U) con un raggio di 2 pixel, traccia una sottile striscia verticale sul lato sinistro del vetro (10a). La striscia è inserita dal corpo principale, quindi aggiungiamo uno stile Bevel and Emboss (10b). Attiva anche l'opzione Contorno (10c). Guarda il risultato (10d).
Accanto alla touch strip c'è un'altra sezione smerlata che contiene i quattro tasti funzione. Duplica la striscia, spostala verso destra e allargala in modo che i quattro tasti si adattino. Chiamalo "key strip".
Per i tasti funzione scegli un colore grigio più chiaro. Disegna il tasto in alto con lo strumento Rettangolo (12a) e chiamalo "chiave in alto". La chiave lancia un'ombra tutt'intorno a sé. Crea quell'ombra con uno stile Outer Glow (12b). Le restanti chiavi possono essere facilmente create duplicando il "tasto superiore", adattandone le proporzioni e posizionandole sulla striscia (12c).
Raggruppa entrambe le strisce e le cinque chiavi in un gruppo chiamato "BUTTONS L." Duplicare il gruppo, denominare il nuovo "BUTTONS R", spostarlo a destra del vetro e capovolgerlo orizzontalmente (13a). Per finire il tablet aggiungiamo un'ombreggiatura. Su un nuovo livello sotto la "base" disegnare una sottile ellisse nera lunga. Impostalo su Moltiplica, 70% di opacità. Vai a Filtro> Sfocatura> Sfocatura gaussiana e scegli 3px. Il risultato è un'ombra morbida e dall'aspetto naturale (13b).
È ora di creare lo stilo. Disegna la metà destra dello stilo usando lo strumento Penna in modalità Livello livello (14a). Crea l'altra metà (14b) quindi unisci le due forme insieme. Utilizzare un grigio medio come colore di base (14c). Denominare il livello "corpo della penna".
Aggiungiamo il momento clou principale. Duplica il livello penna e ridimensionalo orizzontalmente. Schiarire usando Tonalità / Saturazione (Cmd + U) o Luminosità / Contrasto (15a). Infine aggiungi un Gaussian Blur da 1px per fonderlo con lo strato inferiore (15b). Potrebbe essere necessario impostare la modalità di fusione dell'illuminazione su Schermo in base ai colori selezionati e al risultato desiderato. Denominare il livello "riflessione corpo penna".
Utilizzando lo strumento Selezione rettangolare (M), selezionare una sottile striscia orizzontale sul livello "riflessione del corpo della penna" a metà dell'estremità conica. Scurisci la selezione (16a). Ora seleziona la punta su entrambi i livelli e cancella, lasciando una estremità piatta (16b).
Aggiungi il pennino come un semplice rettangolo grigio scuro (17a) su un livello sotto il "corpo della penna". La gomma può essere creata con un'ellisse grigio scuro, anche su un livello sotto la penna (17b). Poiché la gomma è arrotondata, è necessario aggiungere una variazione di colore sulla superficie. Lo facciamo con uno stile Gradient Overlay (17c).
Disegna l'impugnatura di gomma con un rettangolo arrotondato leggermente affusolato in modo che diventi più luminoso in alto (18a). Il raggio dovrebbe essere veramente piccolo, circa 3px. Aggiungi uno stile Sovrapposizione sfumatura (18b). L'impugnatura di gomma ora appare rotonda (18c).
Disegniamo il pulsante laterale sullo stilo. Disegna un rettangolo grigio scuro su un nuovo livello, proprio dove il pollice sarebbe se afferrassi lo stilo (19a). Selezione: seleziona i due terzi in basso (19b), quindi premi Cmd + J per copiare la selezione in un nuovo livello. Questo lato del bottone è rivolto verso l'alto, quindi dobbiamo schiarirlo (19c). Premi Cmd + E per unire questa faccia verso il basso. Ora dobbiamo solo aggiungere un bagliore esterno per simulare il foro in cui è impostato il pulsante (19 d). Il pulsante laterale è completo (19e).
Raggruppare tutti i livelli che compongono la penna e denominare il gruppo "PEN" (20a). Mantieni la struttura del livello per modifiche successive. Duplica il gruppo e premi Cmd + E per unire tutti i livelli in uno solo. A questo punto possiamo aggiungere un'ombra esterna (20b) e posizionare lo stilo dove vogliamo. Abbiamo finito (20c).
Spero che tu abbia imparato alcuni trucchi da questo tutorial. Forse ti ha persino fatto venire voglia di comprare un tablet! Come sempre con il design di icone, ci siamo basati su forme vettoriali e stili di livello per ottenere il massimo effetto e flessibilità. Se si desidera cambiare i colori, gli spessori o la direzione della luce, è sempre possibile tornare alla struttura del livello e apportare le modifiche necessarie. Ci vediamo la prossima volta per il nostro progetto definitivo in questa serie quando creeremo un'icona di visualizzazione di un paesaggio urbano!
Accentsconagua