it.hideout-lastation.com
Paradiso Per Designer E Sviluppatori


Come confrontare le revisioni delle immagini in Github

Con Git, non solo puoi tenere traccia delle modifiche nel codice, puoi anche confrontare le modifiche (alias diff ). E nel caso in cui le revisioni vadano errate, puoi tornare facilmente alle versioni precedenti. Puoi anche confrontare le modifiche al codice in modo semplice e intuitivo con Github.

Sebbene sia principalmente utilizzato per condividere codici, progetti e contributi da parte degli sviluppatori, Github consente di vedere i cambiamenti storici e i confronti tra file. Per vedere questo, fare clic su uno dei file e fare clic sul pulsante Cronologia, come segue.

Nell'immagine seguente, puoi vedere Github confrontando la revisione precedente e la nuova revisione con linee verdi e rosse. Le linee verdi rappresentano le aggiunte di linea, mentre le linee di colore rosso rappresentano le sottostrutture . Quindi, in sostanza, questi indicatori di colori ti guidano su cosa c'era e cosa è appena stato aggiunto nel file.

Spesso un progetto non riguarda solo i codici testuali, ma può comprendere anche molte immagini e persino file PSD. Github ha recentemente aggiunto la possibilità di confrontare immagini e PSD in modo interattivo . Questa è una nuova interessante funzione che vale la pena esplorare, quindi vediamo come funziona.

Revisioni di immagini e confronti

Github supporta un numero di formati immagine come PNG, JPG, GIF e PSD. Come per il confronto dei codici, per prima cosa selezioniamo l'immagine e facciamo clic sul pulsante Cronologia. Sotto l'immagine, vedrai l'elenco dei modi per confrontare l'immagine, ovvero 2-Up, Swipe e Onion Skin .

Per prima cosa, proviamo il metodo Swipe . Con Swipe, possiamo dividere l'immagine in due parti e visualizzare le modifiche apportate nell'immagine fianco a fianco. Lo scorrimento è più utile se hai modificato l'immagine nel suo insieme, ad esempio trasformandola in scala di grigi, in questo modo.

2-Up è il metodo di confronto delle immagini che visualizza due revisioni (più vecchie e più recenti) affiancate, come mostrato di seguito. Questo metodo è particolarmente utile per vedere i cambiamenti nella dimensione dell'immagine, come mostrato di seguito.

Onion Skin è la strada da percorrere quando il cambio di immagine è molto buono e la differenza è appena percepibile. Quando selezioni Skin Onion, ci sarà una barra manubrio, come mostrato di seguito.

Trascinando il manubrio a sinistra vedrete la revisione precedente dell'immagine, e trascinandola verso destra renderà l'immagine sfumata nella nuova versione. Questo effetto di dissolvenza ti aiuterà a individuare facilmente la differenza tra le revisioni.

Pensiero finale

Vedo che questa nuova aggiunta di funzionalità porterà nuove prospettive sul fatto che Github non è solo per i programmatori. Se sei un graphic designer dovresti essere molto emozionato; puoi anche sfruttare questa funzionalità e noi Git e Github per gestire le tue revisioni di progetto.

Crea immissione data / ora minimalista Seleziona con Flatpickr

Crea immissione data / ora minimalista Seleziona con Flatpickr

Uno dei campi più difficili da creare è la selezione di data / ora . Gli sviluppatori spesso ricorrono a semplici menu di selezione per il mese / giorno / anno o si basano su vari plugin per fare il lavoro.I campi selezionati funzionano bene ma sono un po 'goffi. Invece, puoi ravvivare il tuo modulo con il plugin Flatpickr .

(Consigli tecnici e di design)

Aggiungi il testo del passaggio del margine a qualsiasi sito web facilmente con Marginotes

Aggiungi il testo del passaggio del margine a qualsiasi sito web facilmente con Marginotes

I tooltip in linea sono fantastici ma a volte semplicemente non si adattano bene a determinati contenuti. La maggior parte dei siti web lascia spazio nei margini lungo il corpo della pagina e questo è perfetto per aggiungere contenuto in stile tooltip senza le descrizioni comandi .Inserisci Marginote, un plugin jQuery open source gratuito che aggiunge note personalizzate ai margini della tua pagina web.

(Consigli tecnici e di design)