Share
Cosa starai creandoIn questo tutorial, imparerai come progettare una semplice icona della bussola semplice in Adobe Photoshop, utilizzando strumenti come lo strumento Penna, lo strumento rettangolo arrotondato e lo strumento rettangolo. Imparerai anche come combinare le forme di base per creare una forma più complessa. Infine, vedrai come aggiungere un'ombra lunga all'icona. Iniziamo.
Avrai bisogno delle seguenti risorse gratuite per seguire questo tutorial.
Crea un nuovo file in Photoshop (File> Nuovo). Imposta le sue dimensioni a 500 pixel × 500 pixel.
Clicca il Aggiungi livello di regolazione icona nella parte inferiore del Livelli pannello. Selezionare Tinta unita.
Seleziona rosso chiaro (# db687b) per il colore.
Fare doppio clic sul Tinta unita strato e quindi attivare Sovrapposizione di modelli. Usa il modello di pixel gratuito da PSDfreemium. Imposta la sua modalità su Moltiplicare con basso Opacità, 20%.
Cambia il nome del suo livello in sfondo. Suggerisco di rinominare ogni livello per aiutarti a riconoscere la funzione del livello.
Per prima cosa, vogliamo costruire la base dell'icona. Imposta il colore di primo piano su # 3ab2cb. Attiva il Strumento rettangolo arrotondato, e impostare il suo Raggio a 30 px. Shift-click e trascina per disegnare un rettangolo arrotondato.
Fai doppio clic sulla forma e attiva Sovrapposizione sfumatura. Seleziona la sfumatura da bianco a nero. Ridurre Opacità con Sovrapposizione modalità fusione.
Crea un nuovo livello e posizionalo sopra la base dell'icona. Controllo-clic il livello base per creare una nuova selezione in base alla sua forma. Fare clic con il tasto destro e selezionare Ictus. Nel Ictus finestra di dialogo, selezionare un colore blu più scuro (# 1d6b80) con Larghezza 2 px.
Aggiungi una maschera di livello al livello di traccia e riempila di nero. Dipingi la metà inferiore con il bianco per rivelare il tratto.
Ripeti la forma precedente e aggiungi un'altra linea di tratto su un nuovo livello. Questa volta, usa un colore blu più chiaro con Larghezza 1 px.
Aggiungi una maschera di livello e quindi riempila di nero per nascondere il tratto. Dipingi la parte superiore per rivelare parte della linea del tratto. La combinazione di tratti leggeri in alto e tratti scuri in basso aggiungerà un effetto 3D alla base.
Disegna una forma circolare e aggiungi una forma circolare più piccola al suo interno con la modalità percorso Sottrai la forma frontale. Ora dovremmo avere una forma ad anello. Per il suo colore, impostalo su bianco (# e4ffff).
Aggiungi un tracciato triangolare nella parte superiore della forma ad anello. Imposta la sua modalità su Combina forme.
Aggiungi un altro triangolo sulla sua parte inferiore.
Duplica i due triangoli. Ruota di 90 °.
Ora abbiamo un triangolo che punta in quattro direzioni.
Ripeti il processo. Questa volta aggiungi triangoli più piccoli. Ruota di 45 °.
Fare doppio clic sulla forma del livello e quindi aggiungere Sovrapposizione sfumatura e Ombra esterna. Vedi lo screenshot seguente per le sue impostazioni.
Aggiungi una forma di anello più piccola sopra la forma precedente. Imposta il suo colore su #eaeded.
Aggiungi una forma a mezzo triangolo che copre metà del punto nella forma della bussola.
Continua ad aggiungere un altro mezzo triangolo che copre gli altri punti. Questa forma creerà l'illusione che la forma della bussola sia estrusa, non piatta.
Fai doppio clic sulla forma e scegli Sovrapposizione sfumatura.
Per il gradiente, impostalo Stile a Lineare con transizione di colore da grigio (# d7d7d7) a bianco (#ffffff).
Aggiungi un nuovo livello e assicurati che sia collocato sopra tutti gli altri livelli. Controllo-clic la forma precedente che abbiamo appena creato. Avremo una nuova selezione basata sulla sua forma. Fare clic con il tasto destro e selezionare Ictus. Impostato Larghezza a 1 px, Ubicazione: all'interno, con il colore #eeefef.
Questo ti darà una linea di tratti sottili lungo la forma.
Aggiungi una maschera di livello alla forma del livello e riempila di nero. Dipingi alcune parti della linea di tratto con il bianco per rivelarle.
Facciamo sembrare realistica la forma aggiungendo l'ombra al di sotto di essa. Aggiungi un nuovo livello e posizionalo sotto la forma della bussola. Controllo-clic il livello di forma della bussola per creare una nuova selezione in base alla sua forma. Clic Modifica> Riempi. Impostato Soddisfare a Nero e quindi fare clic ok per riempire la selezione con il nero.
Rimuovi la selezione usando Controllo-D. Clic Filtro> Sfocatura> Sfocatura movimento. Imposta la sua Angolo a -45 °.
Ammorbidisci l'ombra usando a Sfocatura gaussiana filtro. Clic Filtro> Sfocatura> Sfocatura gaussiana.
Per ora, questa non è l'ombra che vogliamo. Per risolvere questo problema, aggiungi una maschera di livello al livello e quindi dipingi l'ombra non necessaria sul lato superiore sinistro dell'ombra. Abbiamo solo bisogno di ombra sul lato destro della forma. Vedi l'immagine qui sotto per riferimento. Assicurati di ridurne anche il livello Opacità per rendere l'ombra sottile.
Aggiungiamo una freccia al centro della forma della bussola. Inizia aggiungendo un rettangolo e quindi applicando una trasformazione (Controllo-T). Per prima cosa, ruotalo di 45 °. In secondo luogo, spremi il suo angolo fino a quando non avremo una forma a freccia. Terzo, ruotalo di nuovo.
Fare doppio clic sulla forma della freccia e quindi applicare Bagliore interno, Sovrapposizione sfumatura, e Ombra esterna con le seguenti impostazioni.
Vogliamo che il colore della freccia sia metà bianco e metà rosso. Per fare ciò, basta duplicare la forma (Controllo-J) e quindi rimuovere i suoi stili di livello. Impostalo su Maschera di ritaglio. Fai clic sul punto in basso con il Strumento Penna per eliminarlo.
Aggiungi un piccolo cerchio al centro della freccia. Fare doppio clic su di esso e quindi applicare Bagliore interno, Sovrapposizione sfumatura, e Ombra esterna.
Aggiungi un nuovo livello e posizionalo tra la forma della bussola e la sua freccia. Disegna una selezione poligonale come visto sotto usando il Strumento poligonale e poi riempirlo di nero. Riduci il livello Opacità a 20%. Controllo-clic la base dell'icona e aggiungi una maschera di livello. Ora l'ombra può essere vista solo sulla base dell'icona.
Per migliorare l'illusione che la forma della bussola sia estrusa, vogliamo aggiungere più ombra su di essa. Crea un nuovo livello tra la forma della bussola e la sua freccia. Dipingi nero sull'ombra della freccia che tocca la forma della bussola.
Aggiungi un altro livello e poi un'altra ombra sottile dietro la freccia. Attiva il Pennello con 0% di durezza e impostare il suo Opacità a 5%. Dipingi l'ombra dietro la freccia.
Aggiungi un nuovo livello. Questa volta aggiungi l'evidenziazione all'icona. Dipingi il bianco sull'angolo dell'icona. Riduci il suo livello Opacità.
Ripeti questo passaggio, selezionando l'evidenziazione su altre parti dell'icona finché non appare troppo piatta.
Ora, aggiungiamo ombra alla base dell'icona. Crea un nuovo livello sotto il livello di base. Controllo-clic il livello di base e riempire la selezione con il nero.
Colpire Controllo-D rimuovere la selezione. Ammorbidisci l'ombra applicando Sfocatura gaussiana.
Puoi duplicare l'ombra cliccando Controllo-J se non sei soddisfatto del risultato e vuoi un'ombra più scura. Se la trovi troppo scura, puoi attenuarla riducendola Opacità.
E questo è il nostro risultato finale. Spero ti piaccia il tutorial e ora comprendi la tecnica di creare un'icona piatta con una lunga ombra.
Accentsconagua