Come configurare smartphone e PC. Portale informativo
  • casa
  • Windows Phone
  • Come effettuare una transizione graduale in Photoshop. Come effettuare una transizione graduale in Photoshop? Conoscenze di base e un segreto per un'opzione sempre vincente

Come effettuare una transizione graduale in Photoshop. Come effettuare una transizione graduale in Photoshop? Conoscenze di base e un segreto per un'opzione sempre vincente

Oggi te lo mostro come effettuare una transizione graduale tra due foto.

Ho fatto una foto in anticipo e questo è il risultato che ho ottenuto:

Per ottenere un'immagine del genere, scatterò due fotografie, che combinerò.

Ho scattato un bellissimo sfondo con il mare e una foto di una ragazza, che viene fotografata sullo sfondo di alberi cupi senza foglie.

Quindi iniziamo: lo farò transizione graduale dei colori e per questo seguirò questi passaggi:

Passo 1

Aprendo le mie foto in Photoshop e utilizzando lo strumento in movimento Trascino la foto della ragazza sulla foto con lo sfondo del mare.

Voglio ridurre un po' la foto della ragazza e per questo chiamo libera trasformazione, premendo la scorciatoia da tastiera CTRL+T.

La cornice che è apparsa intorno alla foto con la ragazza ha dei nodi che puoi tirare e ridurre le dimensioni della foto, tenendo premuto il tasto Spostare, in modo che le proporzioni dell'immagine non siano distorte.

Passo 2

Ora passo alla tavolozza Strati ed essendo sul livello con la ragazza clicco sull'icona, che si chiama Aggiungi maschera vettoriale.

Come vediamo nella tavolozza Strati sul livello con la ragazza si è formata una maschera di livello, che viene evidenziata con una cornice, che indica che la maschera è attiva e tutto il lavoro che eseguirò verrà eseguito proprio sulla maschera di livello.

Nel pannello superiore, dove si trovano tutte le impostazioni dello strumento Pendenza faccio clic su freccia, che si trova accanto all'icona dello strumento e nella finestra che appare con i gradienti, seleziono gradiente radiale, che va da da nero a trasparente.

Ora disegno le linee del gradiente senza raggiungere la figura della ragazza, come mostrato nell'immagine (puoi avere più direzioni). Quando si disegna una linea sfumata, lo sfondo scompare uniformemente.

Mi ci sono volute due o tre volte per disegnare una linea sfumata in ciascuna delle direzioni indicate nell'immagine per ottenere il risultato che vedi sotto nell'immagine.

Passaggio 4

Tuttavia, possiamo notare che con la scomparsa dello sfondo appartenente alla fotografia della ragazza, anche l'immagine della ragazza stessa è leggermente cambiata, poiché in alcuni punti è diventata traslucida.

Ma questo è molto facile da risolvere.

Mentre sono sulla maschera di livello, prendo un giro morbido spazzola Colore bianco e dipingi con questo pennello sulla ragazza.

Il pennello bianco ripristina tutte le parti perse dell'immagine della ragazza.

E vogliamo anche ricordarti che puoi sempre chattare sugli argomenti di Photoshop sul forum di Photoshop e trovare risposte a molte delle tue domande.

Ecco il risultato:

Ho unito le due foto usando una transizione graduale.

Spero di essermi spiegato chiaramente come fare una transizione graduale tra due foto - come puoi vedere è abbastanza semplice.

Ti consiglio anche di guardare la mia lezione precedente Valentika in Photoshop, che ha un sacco di cose interessanti.

Ti auguro un continuo successo nel padroneggiare Photoshop!

Galina Sokolova era con te.

1 voto

Buona giornata, cari lettori. Oggi ho deciso di dimostrarti che l'apprendimento della teoria si fa meglio nella pratica. Anche se sei un principiante, in appena un'ora puoi ottenere un buon risultato senza capire nulla in Photoshop! Guarda, questa immagine è stata creata interamente grazie ai gradienti. Sono applicati a vari elementi e in una varietà di variazioni.

Se leggi questo articolo fino alla fine, non solo imparerai come realizzare una transizione di colore uniforme in Photoshop, ma applicherai anche queste conoscenze nella pratica in relazione al testo, a una forma, alla creazione di splendidi diamanti luccicanti e molto altro.

Ho già fatto questa foto. Se vuoi, puoi creare da solo esattamente lo stesso, o forse anche meglio, ma ti insegnerò con un esempio diverso. Quale? Scoprilo a fine articolo. Disegnerò con te e descriverò il processo in parallelo, io stesso non so ancora cosa posso fare. Grazie a questo, sarò in grado di vedere quali problemi potresti incontrare e aiutarti a risolverli.

Conoscenze di base e un segreto per un'opzione sempre vincente

Quindi, prima dobbiamo aprire Photoshop. Consiglio vivamente di scaricare questo programma ( puoi acquistare una versione con licenza qui ). Non troverai mai migliore di lei. Se hai paura di non padroneggiare e spendere soldi invano, dimenticandoti completamente del programma dopo il primo tentativo, puoi provare il servizio online https://editor.0lik.ru/ . È molto più conveniente avere il tuo programma e molto presto capirai perché.

Ecco come appare la versione 2015 di Photoshop, se hai un'edizione diversa, non preoccuparti. Tutto sarà più o meno lo stesso. Hai leggermente meno opzioni e questa è l'unica differenza.

Creiamo un nuovo documento.

Scegliere una taglia è una delle domande più difficili per me. Come base, ho preso le dimensioni massime dell'immagine per un post sui social network. 800x500, ma, come capisci, non è questo il punto. Tutto dipende dagli obiettivi e dagli obiettivi che intendi raggiungere utilizzando Photoshop.

Guarda, il pannello a destra contiene tutti i pulsanti principali, incluso il gradiente. Tuttavia, ora non si trova. Come mai? Io stesso ho affrontato questo problema quando ho iniziato a imparare a lavorare con Photoshop. Leggi un articolo e metà delle informazioni che devi cercare in fonti di terze parti. Google Google GOOGLE.

Perdonatemi, un lettore molto intelligente che sa tutto molto bene per piccole divagazioni dall'argomento. Voglio che tutti i visitatori del blog possano lavorare sulle mie lezioni. Forse un giorno ti sarà molto utile. Risparmia molto tempo.

Nell'angolo in basso a destra di quasi tutti i pulsanti, ad eccezione della lente d'ingrandimento, c'è qualcosa come una freccia. Ciò indica che diversi strumenti sono nascosti nel pulsante.

Tieni premuto il pulsante sinistro del mouse sul pulsante per alcuni secondi per aprire un menu aggiuntivo e selezionare il gradiente.

Un altro menu aggiuntivo si è aperto in alto. Si applica esclusivamente ai gradienti. Fai clic sul testo: un menu di testo speciale si aprirà nella parte superiore, sul pennello e ... beh, hai capito.

Fare clic sulla freccia accanto all'icona del colore. È qui che vengono archiviate le transizioni standard o quelle che hai caricato.

Se non ti consideri un genio del design, ti consiglio di scaricare modelli gratuiti da Internet. Sono pieni. In primo luogo, consente di risparmiare tempo e, in secondo luogo, diverse opzioni simili vengono solitamente combinate in un tema creato nello stesso stile. questo può essere applicato a un'immagine senza problemi e avrà quasi sempre un bell'aspetto.

L'installazione di nuovi modelli non è un problema. Scaricali da Internet, quindi seleziona il dado nell'angolo in alto a destra e trova il link "Download ...".

Seleziona la cartella con i file scaricati sul tuo computer e salva.

Verranno aggiunti in fondo all'elenco.

riempire

Ora impariamo come riempire. Scegli l'opzione che preferisci (passeremo alla creazione un po' più tardi) e cliccaci sopra. Tieni premuto il pulsante sinistro del mouse in un punto qualsiasi dello schermo e trascina in qualsiasi direzione. Determina la posizione della transizione di colore.

Vedi la differenza.

Puoi girare ovunque.

Per evitare che la linea si sposti e si offusca, tieni premuto il tasto Maiusc mentre imposti la direzione.

Vedete, la transizione del colore viene ora eseguita al centro. Daremo un'occhiata più da vicino alle impostazioni durante la creazione del nostro gradiente. Ora parlerò solo dello spostamento del centro. Clicca su questa bacheca.

Prendiamo il pulsante sinistro del mouse per il colore sottostante e lo spostiamo a sinistra oa destra.

Ecco cosa ho finito.

Come applicare una sfumatura al testo per rendere le lettere moderne

Adesso scriviamo qualcosa. Seleziona il pulsante appropriato.

Se devi modificare la dimensione o il carattere stesso, fai attenzione al pannello nella parte superiore dello schermo. Tutto è semplice lì.

Ora premi Ctrl e allo stesso tempo fai clic sulla miniatura del nuovo livello di testo. Fai attenzione, devi fare clic non sul testo, ma sul rettangolo, come mostrato nello screenshot qui sotto.

Ora creiamo un nuovo livello. Ci sono tre opzioni per risolvere il problema: tenere premuto Maiusc, ctrl, N contemporaneamente; usa il pannello in alto, trova lì "Livello - nuovo - crea"; utilizzare il pulsante nel menu rapido a destra. Nella foto qui sotto, l'ho mostrato con una freccia.

Ora, per rimuovere l'evidenziazione ai bordi delle lettere, puoi fare clic sulla selezione, quindi fare clic in un punto qualsiasi dell'immagine. Ottieni questo risultato.

Questa non è la fine del testo. Guarda, abbiamo 2 livelli: uno con un gradiente e il secondo con lettere. Perché è successo lì? Ti spiego meglio che posso. Scrivi nei commenti se non è chiaro. Hai scritto il testo. Photoshop si rese conto che si trattava di lettere e ti offrì persino di aumentarle, ridurle, cambiare il carattere e così via.

Quindi hai selezionato questo frammento. Abbiamo creato un nuovo livello, se disegniamo un'analogia, ritagliamo uno stencil dalla carta e lo riempiamo. A questo punto Photoshop si è perso. Ha smesso di vedere le tue lettere. Per lui, è solo una parte di un'immagine, come un rombo, un quadrato o un cerchio con un centro ritagliato. Se vai a lavorare con le lettere sul livello, non ci riuscirai, se vuoi applicare una sfumatura al testo, la stessa cosa.

Se ora decidi di spostare il testo da qualche parte e entri nella sezione appropriata, quindi inizi a spostare la freccia, tutto si sposterà fuori da te.

Stiamo eliminando il livello di testo in modo da non confonderci. Fare clic su di esso con il tasto destro del mouse e selezionare l'opzione desiderata.

Tipi di gradiente, riempimenti forma e creazione di stelle

Se presti attenzione alla barra del gradiente in alto, potresti scoprire che hanno forme diverse: lineari, radiali, angolari, speculari o a diamante. Non è difficile vedere le differenze, per questo non è necessario leggere gli articoli, basta aprire un foglio bianco e provare ad applicare l'una o l'altra opzione. Guarda cosa è successo.

L'unica cosa degna di nota è che se vuoi vedere il risultato perfetto, come nella mia foto, la freccia deve essere diretta dal centro.

Ora torniamo alla nostra immagine. Lascia che ti insegni una tecnica interessante. Le transizioni di colore possono essere utilizzate all'interno delle forme che disegni. Questo è molto utile, soprattutto per coloro che creeranno siti web.

Quindi, scegli un rettangolo o un cerchio. Non importa.

Ora il colore di riempimento.

Passiamo alla sezione gradiente.

Abbiamo bisogno di un rombo qui.

Vedi, si è rivelato un effetto interessante, solo il colore bianco rovina tutto. Hai bisogno di trasparenza. Può essere trovato all'interno dei modelli. Se vedi un tale reticolo all'interno del modello, allora questo è ciò di cui abbiamo bisogno.

Gioca con le impostazioni e otterrai la vestibilità perfetta.

Ora cloniamo questo flash. Scegli una mossa. Basta fare clic sul pulsante.

Ora tieni premuto alt e trascina il duplicato di lato.

Ho ottenuto questo risultato.

Creazione di un nuovo gradiente e pulsanti per i siti Web

E infine, ti dirò come creare tu stesso i gradienti da zero e allo stesso tempo capiremo le loro impostazioni. Creiamo un bel bottone, vero? Aggiungerò un rettangolo con bordi arrotondati alla mia immagine.

Ecco come appare. Questa volta non useremo il riempimento interno. Non è molto conveniente lavorare con un nuovo modello attraverso di esso. Lascia che sia solo nero per ora.

Seleziona uno strumento familiare e fai clic sulla piastra.

Nuovi gradienti vengono creati in base a quelli vecchi. Fare clic su qualsiasi. La vecchia versione non andrà via. Quindi crea un nuovo nome per esso e salvalo.

I punti di controllo superiori controllano i livelli di trasparenza.

Con l'aiuto di quelli inferiori, viene eseguito il lavoro con il colore. Per espandere la gamma, fai clic su accanto a qualsiasi punto e verrà duplicato.

Puoi crearne quanti ne vuoi.

Per rendere la transizione moderna, è necessario smussare i colori. Non toccare questo indicatore e tutto andrà bene. Deve essere al 100%. Pronto. Puoi fare clic su "OK" o "Salva" - tutto dipende dal tuo desiderio.

Ora ripetiamo ciò che abbiamo già fatto di recente con il testo. Tieni premuto ctrl, fai clic sul pulsante dello stile desiderato al centro e creane uno nuovo basato su di esso.

Ora aggiungi una transizione e voilà.

Aggiungi testo al pulsante e il gioco è fatto. Non è chiaro perché l'aggeggio necessario sia finito. A proposito, puoi scaricare la mia fonte se vuoi ( Scarica il sorgente gradient.psd ). Puoi aprirlo in Photoshop e migliorare la mia immagine. Non credo sarà difficile.

Questo è tutto. Ora sai molto sui gradienti. Se sei un designer, layout designer, creatore di siti web o vuoi diventarlo, e questa lezione ti è stata davvero utile, iscriviti alla newsletter e scopri di più su ciò che ti interessa. Puoi anche dare un'occhiata a questo sito: https://photoshop-master.org/disc149/ . Qui puoi trovare un sacco di corsi a pagamento e gratuiti che ti insegneranno un lavoro reale e professionale con Photoshop.

Buona fortuna e ci vediamo di nuovo.

Creare un collage non significa semplicemente combinare più foto in una sola. Il collage giusto mostra l'abilità dell'autore e dimostra anche la sua capacità di organizzare le foto in modo bello e competente in modo che appaia elegante e attraente. Un collage avrà successo e sarà evidente, in cui non ci sono bordi evidenti tra le foto - invece, le foto sembrano fluire l'una nell'altra. Questo effetto può essere ottenuto eseguendo semplici operazioni in Adobe Photoshop.

Avrai bisogno

  • - Software Adobe Photoshop

Istruzione

  • Apri due foto approssimativamente della stessa dimensione che desideri combinare in un collage.
  • Premi il tasto V per attivare lo strumento sposta e trascina una foto sull'altra in modo che siano entrambe nella stessa finestra su due livelli diversi.
  • Seleziona quello in alto dall'elenco dei due livelli visualizzati, quindi aggiungi una maschera vettoriale (Aggiungi maschera di livello).
  • Accanto all'icona della foto nella linea del livello apparirà l'icona di una maschera a forma di quadrato bianco. Fare clic su di esso per attivare il livello. L'icona avrà un bordo nero attorno ad essa per indicare che è attiva.
  • Sulla barra degli strumenti, seleziona la sfumatura e specifica la direzione della sfumatura tracciando una linea dall'angolo in basso a destra all'angolo in alto a destra. Noterai come una delle immagini inizia a essere mostrata attraverso l'altra in cui hai applicato il gradiente d'angolo.
  • Sperimenta e modifica la lunghezza e la larghezza del gradiente finché non sei soddisfatto del risultato e le immagini scorrono l'una nell'altra in modo fluido e bello nel punto in cui vuoi vedere la transizione.
  • Per ottenere l'effetto desiderato, usa il gradiente solo con la modalità maschera di livello attivata, altrimenti non ci riuscirai.
  • Esci dalla modalità maschera facendo clic sull'icona della foto nel livello con il cursore del mouse dopo che il collage è pronto.
  • Unisci livelli (Unisci livelli) e salva il collage nel formato desiderato.
  • Sposta la seconda foto su quella precedentemente aperta.

    Puoi leggere di più sul collegamento delle foto in.

    Quindi, usando lo strumento Sposta, impostiamo la posizione desiderata delle foto l'una rispetto all'altra. È necessario assicurarsi che una foto si sovrapponga a un'altra, al posto della sovrapposizione verrà montata una transizione graduale. Per comodità, puoi ridurre temporaneamente l'opacità delle immagini nel pannello Livelli, è anche una buona idea inserire delle guide sui bordi della sovrapposizione.

    Ora determiniamo quale foto sarà in cima e, se necessario, cambiamo la disposizione dei livelli nel pannello Livelli. Avrò un'immagine con Twitter in alto.

    Quindi imposta l'opacità dei livelli dell'immagine su 100%.

    E, ora, passiamo alla creazione di una transizione graduale tra le foto, in questo esempio lo faremo usando una maschera di livello e applicando una sfumatura in bianco e nero.

    Aggiungi una maschera di livello al livello con la foto in alto facendo clic sull'icona corrispondente nella parte inferiore della tavolozza, mentre i colori nella tavolozza dei colori cambiano automaticamente in colore di primo piano nero e colore di sfondo bianco, l'icona della maschera sul livello corrispondente cambierà appaiono nel pannello Livelli. Quindi apri lo strumento sfumatura nella tavolozza degli strumenti. Nell'angolo in alto a sinistra della finestra di lavoro di Photoshop, fai clic sul triangolo per aprire la tavolozza dei gradienti e seleziona la prima in assoluto, che ha il nome "Dal colore principale allo sfondo". Quindi tracciamo una linea da una guida all'altra nella direzione mostrata nella figura.

    Per disegnare una linea sfumata rigorosamente in orizzontale (o, per altri casi, rigorosamente in verticale), tieni premuto il tasto Maiusc.

    Di conseguenza, otteniamo una transizione graduale alla trasparenza del bordo destro dell'immagine in alto, che dà l'effetto di una transizione graduale tra le due foto.
    Sull'icona della maschera nel pannello Livelli, vedremo le seguenti modifiche, il colore nero mostra la piena trasparenza e il bianco, al contrario, la piena opacità dell'immagine a cui è applicata la maschera di livello.

    Questo è tutto, il compito è completato!

    Ciao cari webmaster principianti. Ancora .

    In questo articolo ti dirò come passare dalle tonalità scure a quelle più chiare, nonché da un colore all'altro.

    Tale azione è chiamata gradiente e, poiché è essenzialmente un'immagine di sfondo, viene eseguita dalla proprietà background, che assume due valori:

    1. gradiente lineare - transizione del colore da un bordo o un angolo all'altro.

    2. gradiente radiale: transizione del colore dal centro ai bordi.

    È scritto come segue:

    sfondo: -moz-linear-gradient (in alto, #ff0000, #ffcfcf );
    in alto, #ff0000, #ffcfcf);

    Di seguito, utilizzando un esempio, analizzeremo in dettaglio ogni elemento di questo record.

    Sfortunatamente, il gradiente ha ancora problemi di rendering nei browser e nelle specifiche W3C, quindi i valori devono ancora essere prefissi.

    Metti un prefisso all'inizio del valore e inizia con un trattino.

    Questo è l'elenco che dovremo inserire nel selettore degli elementi, creando un gradiente per esso, in modo che il tuo bellissimo sfondo si rifletta correttamente in tutti i browser. La bellezza richiede sacrificio.





    Documento senza titolo





    Questo è il gradiente a due colori più semplice. Analizziamo nel dettaglio i valori della proprietà background

    La prima riga imposta lo sfondo per i browser che non supportano i gradienti lineari.

    Le 5 righe successive servono per visualizzare lo sfondo in diversi browser. Innanzitutto, il valore del gradiente viene scritto con un prefisso all'inizio.

    Quindi, tra parentesi:

    in alto - la direzione da cui inizia il primo colore (può essere in basso, a sinistra, a destra)

    #ff0000 - primo colore separato da virgole;

    #ffcfcf — secondo colore separato da virgole;

    Safari, fino alla versione 5 e Chrome fino alla dieci, avevano la propria sintassi, che aumentava notevolmente il codice. Questo è probabilmente il motivo per cui spesso non viene specificato il gradiente per queste versioni, soprattutto quando è presente un numero elevato di colori.

    Puoi effettuare la transizione del colore non orizzontalmente o verticalmente, ma da un angolo all'altro. Per questo, ci sono le seguenti indicazioni:

    in basso a destra - dall'angolo in basso a destra in alto a sinistra;

    in basso a sinistra - dal basso a sinistra in alto a destra;

    in alto a destra - da in alto a destra in basso a sinistra;

    in alto a sinistra - da in alto a sinistra in basso a destra;

    Puoi effettuare una transizione di colore dal centro del blocco ai bordi. Quindi nel significato al posto della parola lineare (lineare), metti radiale (radiale)

    #pendenza(
    sfondo : #ff0000 ;
    sfondo : -moz-radial-gradient( centro, copertina ellisse, #ff0000, #ffcfcf);
    sfondo: -webkit-radial-gradient( centro, copertina ellisse, #ff0000, #ffcfcf);
    centro, copertina ellisse, #ff0000, #ffcfcf);
    centro, copertina ellisse, #ff0000, #ffcfcf);
    larghezza: 600px
    altezza: 400px
    bordo: 1px solido #333;
    }

    E ora facciamo, per così dire, qualcosa come un arcobaleno. Per fare ciò, aggiungi un altro paio di colori al codice sopra e imposta il volume di ogni colore come percentuale (il numero di colori non è limitato)

    Il volume del colore è impostato da 0% a 100%, (il primo è 0%, l'ultimo è 100%, il resto tra di loro è in sequenza). Considera questa opzione su un gradiente radiale. In uno lineare, tutto si fa allo stesso modo.

    #pendenza(
    sfondo : #ff0000 ;
    sfondo: -moz-radial-gradient();
    sfondo : -webkit-radial-gradient-t( centro, copertura ellisse, #ff0000 0%, #00b630 30%, #6ff5f5 70%, #ffcfcf 100%);
    sfondo : -o-radial-gradient( centro, copertura ellisse, #ff0000 0%, #00b630 30%, #6ff5f5 70%, #ffcfcf1005);
    sfondo: -ms-radial-gradient( centro, copertura ellisse, #ff0000 0%, #00b630 30%, #6ff5f5 70%, #ffcfcf 100%);
    larghezza: 600px
    altezza: 400px
    bordo: 1px solido #333;
    }

    Il principio, credo, è chiaro. Quindi la riga per Safari fino alla quinta versione e Chrome fino alla decima, prova a scriverla tu stesso.

    Il gradiente è impostato su qualsiasi blocco HTML (body, div, h1-6, p, ul, ol) e su stili sia globali che inline (questo è per un sito WordPress).

    Ora qualche parola su come e dove scegliere i colori. Esistono servizi di sfumatura che offrono sia colore, percentuale di volume che codice sfumatura, ma la loro scelta è limitata dalla fornitura.

    Pertanto, utilizzo lo strumento colorscheme.ru, in cui puoi scegliere un colore in una gamma illimitata e sequenze e combinazioni abbinate in modo ottimale.

    Nella riga superiore del pannello, viene selezionato il numero di colori combinati. Passando per "Angolo 30°" cambia il range di selezione.

    In "Regolazione dello schema", il tono viene reso più scuro o più chiaro. Nella "Lista dei colori", tutti i colori presenti nello schema sono disposti per saturazione, e con un codice nella didascalia.

    In generale, possibilità illimitate di scegliere i colori per creare una sfumatura.

    Ti auguro successo creativo.

    — Rabinovich! Hai cento dollari da cambiare?
    No, ma grazie per i complimenti!

    Due Odessani:
    Rosa, ti piace il mio vestito nuovo?
    "Scusa, Sarah, ho fretta, non ho tempo per gli scandali in questo momento!"

    Articoli correlati in alto