Share
In questo tutorial di suggerimento rapido spiegheremo come creare un interruttore di plastica in Photoshop che puoi usare nei tuoi progetti di interfaccia. Iniziamo!
Crea un nuovo file. Imposta la larghezza su 400 e Altezza su 300 e la risoluzione su 72 PPI.
Ora crea un nuovo gruppo e chiamalo Sfondo. Usando lo Strumento Rettangolo (U) disegna una forma più grande della tela, proprio come quella nell'esempio. Imposta il colore su bianco #ffffff e applica gli stili di livello.
Crea un nuovo gruppo e chiamalo Base. Usando lo strumento Penna (P) disegna una forma come quella nell'esempio. Imposta il colore su un grigio scuro # 242424 e applica gli stili di livello. Ora la nostra forma base è fatta.
Crea un nuovo gruppo e chiamalo Pulsante. Usando lo strumento Penna (P) disegna una forma come quella nell'esempio. Imposta il colore su # ada397 e applica lo stile di livello.
Ora per aggiungere volume e dettagli al pulsante. All'interno del gruppo di pulsanti crea un nuovo livello sopra la forma del pulsante e usando lo strumento Pennello (B), imposta il colore di primo piano sul nero # 000000, la dimensione del pennello su 11px e la durezza su 0 e disegna una linea breve in basso parte del pulsante, come visto nell'esempio. Trasforma quel livello in una maschera di ritaglio tenendo premuto il tasto ALT e premendo tra i due livelli, o semplicemente fai clic destro sull'ultimo strato e seleziona Crea maschera di ritaglio.
Crea un nuovo livello e, utilizzando lo strumento Penna (P), disegna una forma nera # 000000 proprio come quella nell'esempio. Vai a Filtro> Sfocatura> Sfocatura gaussiana, imposta il Raggio su 1,5 px e applica il filtro. Usando lo strumento Gomma (E), imposta Dimensione su 58 e la Durezza su 0, e sfiora il lato sinistro della forma sfocata (la forma rossa nell'esempio segna il punto). Imposta l'opacità del livello su 18% e rendi questo livello una maschera di ritaglio. Ora crea un nuovo livello, seleziona lo strumento pennello (B), imposta la dimensione su 15px e la durezza su 0, imposta il colore su # 92897f e traccia una linea dritta come quella nell'esempio. Quando hai finito, trasforma questo strato in una maschera di ritaglio.
Crea un nuovo livello, seleziona Strumento Penna (P), imposta il colore su # c8b7a5 e disegna una forma come quella nell'esempio. Vai a Filtro> Sfocatura> Sfocatura gaussiana, imposta il Raggio su 1,5 px e applica il filtro. Usando lo strumento Gomma (E), imposta Dimensione su 58 e la Durezza su 0, e sfiora il lato sinistro della forma sfocata (la forma rossa nell'esempio segna il punto). Ora seleziona lo strumento pennello (B), imposta la dimensione su 13px e la durezza su 0, imposta il colore su # c8b7a5 e disegna una linea retta come quella nell'esempio. Rendi questo livello una maschera di ritaglio.
Crea un nuovo livello e, utilizzando lo strumento Penna (P), imposta il colore su nero # 000000 e disegna una forma come quella nell'esempio. Vai a Filtro> Sfocatura> Sfocatura gaussiana, imposta il Raggio su 1,5 px e applica il filtro. Usando lo strumento Gomma (E), imposta Dimensione su 58 e la Durezza su 0, e sfiora il lato sinistro della forma sfocata (la forma rossa nell'esempio segna il punto). Ora imposta la modalità di fusione per il livello su Sovrapponi e Opacità su 80% e trasforma il livello in una Maschera di ritaglio.
Crea un nuovo livello e, utilizzando lo strumento Pennello (B), imposta Dimensione su 10px, la Durezza su 0%, il colore su nero # 000000 e disegna qualche linea intorno alla parte inferiore e destra del pulsante come nell'esempio . Trasforma quel livello in una maschera di ritaglio e creane una nuova. Usa lo strumento Pennello (B) con le stesse impostazioni di prima e traccia alcune altre righe sul lato destro del pulsante. Ora dobbiamo copiare la miniatura della Maschera vettoriale della forma del pulsante sul nostro livello. Tenendo premuto il tasto ALT, fare clic e trascinare la miniatura della Maschera vettoriale dalla nostra Forma pulsante a questo livello esattamente come si vede nell'esempio. Non creeremo questo strato o nessun futuro strato di maschere di ritaglio.
Faremo un nuovo livello. Usando lo strumento Penna (P) disegna un'altra forma nera # 000000 proprio come quella nell'esempio. Vai a Filtro> Sfocatura> Sfocatura gaussiana, imposta il Raggio su 1,5 px e applica il filtro. Imposta l'opacità del livello sul 20%. Crea un nuovo livello e Usando lo strumento Pennello (B) aggiungeremo alcuni punti salienti. Imposta la Dimensione su 2px e la Durezza sullo 0%, imposta il colore su # d5c8b5 e crea un piccolo punto vicino all'angolo superiore sinistro del pulsante. Crea un altro livello e, usando Pen Tool (P), aggiungeremo ulteriori dettagli. Imposta il colore su #dbcebe e disegna altre tre forme come quella vista nell'esempio. Questi punti salienti aiuteranno a dare più volume e realismo al nostro pulsante.
Crea un nuovo gruppo e posizionalo sotto Gruppo base. Chiamalo Shadow. Usando lo strumento Penna (P), impostare il colore su # 000000 e disegnare una forma come quella nell'esempio. Vai a Filtro> Sfocatura> Sfocatura gaussiana, imposta il Raggio su 1,5 px e applica il filtro. Imposta l'opacità del livello al 20% e utilizza lo strumento Gomma (E), imposta la dimensione a 58px e la durezza a 0% e allontana la parte inferiore destra della nostra forma (il cerchio rosso indica l'area nell'esempio).
Accentsconagua