fbpx

Płaski styl czyli material design od wielu lat jest na szczycie w trendach graficznych. Jego minimalizm cały czas ewoluuje i obecnie możesz go spotkać na każdym kroku. W czasach gdy płaski styl opanował projekty, gradienty zniknęły niemal całkowicie. Jednak kiedyś wszystko się nudzi i nawet najlepszy styl potrafi znużyć. Dlatego też w grafice ważną rzeczą jest śledzenie trendów, które znikają oraz powracają. Jednym z takich właśnie odradzających się trendów są gradienty. Kiedyś stosowane niemal w każdym projekcie, dziś odeszły w zapomnienie na rzecz minimalizmu. Jednak jeśli nie jesteś wielkim fanem gradientów, być może jest to odpowiedni czas, żeby zmienić swoje nastawienie. Okazuje się, że można zaobserwować stale rosnącą popularność stosowania gradientów w ostatnim czasie. Zobaczysz je chociażby w odnowionym Material Deisign, logo Instagrama, (które całkowicie zaszalało w użyciu gradientu) oraz Spotify. Należy jednak tutaj szczerze powiedzieć: Tak, kiepskie gradienty wyglądają okropnie i psują projekt. Ale dobrze zaprojektowane gradienty zawsze dodadzą uroku do projektu graficznego.

 

W 2014 roku Google wprowadziło styl “Material Design”, a Windows styl “Metro”. Cechuje je minimalizm czyli tzw, płaskie kolory, które mają dobrze wyglądać na urządzeniach mobilnych o niższej rozdzielczości. Tak też faktycznie jest ponieważ interfejsy zaprojektowane z użyciem “płaskiej” palety kolorów są czyste i czytelne. Niestety paleta Material Design jest ograniczona i z czasem każda aplikacja zaczęła wyglądać tak samo. Dlatego co raz częściej projektanci poszukują nowych rozwiązań, a jednym z nich jest właśnie powrót do stosowania gradientów. Pozwalają one zmieszać dwa lub kilka kolorów dając tym samym zupełnie nową barwę. Tak naprawdę gradienty występują w naturze i ludzie są do nich przyzwyczajeni. Wszak każdy owoc ma gradient od jasnego do ciemniejszego w cieniach. Niebo ma barwy od nienasyconych do bardziej nasyconych, gdy oddalasz się od horyzontu.

 

 

Oto kilka szybkich wskazówek, na to jak stosować gradienty.

Gradient to stopniowe łączenie kolorów z jednego koloru w inny. Jego zadanie to stworzenie przejścia za pomocą koloru. Może być łagodne gdy zastosujemy podobne barwy lub ostre gdy kolory będą znacznie różnić się od siebie. Gradient dodaje innego wymiaru w projekcie oraz nadaje głębi. Potrafi symulować odległość lub bliskość od danego elementu w projekcie.

Tworząc gradient, który składa się z dwóch barw najlepiej jest spojrzeć na dowolne koło kolorów. Wybór kolorów, które są blisko siebie, będzie miał płynniejsze przejście w gradiencie w porównaniu do kolorów po przeciwnych stronach gdzie przejście będzie ostre. O wiele rzadziej stosuje się takie gradienty, które łączą kolory po przeciwnych stronach koła jak np. zielony i czerwony.

W przypadku gdy chcesz stworzyć gradient z trzech barw musisz zrobić to w taki sposób, żeby uniknąć szarej barwy między nimi, która często występuje w połowie, na łączeniu. Dzięki temu zabiegowi Twój gradient stanie się głębszy, przyjemniejszy w odbiorze.

 

 

Gdy tworzysz gradient z przeźroczystością zadbaj o to, żeby stanowił on tylko jeden kolor na dwóch jego końcach. Częstym błędem w tego typu gradientach jest pozostałość koloru na drugim, przeźroczystym końcu.

 

 

Nie przesadzaj z kolorami. Gradient w kolorach tęczy zawsze będzie złą decyzją. Najbezpieczniejszym sposobem na stworzenie przyjemnego gradientu jest użycie dwóch kolorów, maksymalnie trzech.  Czasem jednak gradient składający się z więcej niż dwóch kolorów będzie o wiele lepszym wyborem. Jednak w tego typu kompozycjach uważaj na płynne przejścia między kolorami. Jeśli zastosujesz gradient, który zawiera zupełnie różne od siebie kolory, to na pewno będzie to skutkowała chaosem w projekcie.

 

 

 

  • Unikaj sprzecznych kolorów. Mało kiedy sprawdzi się gradient, który zaczyna się na jednym końcu kolorem zielonym, a kończy kolorem czerwonym.
  • Użyj gradientu liniowego dla obszarów, które są prostokątem.
  • Użyj gradientu kołowego dla okrągłych obszarów.
  • Stosując gradient, rób to na osobnej warstwie tak, żeby móc manipulować jego kryciem oraz mieszaniem.

 

Gradient jako tło

To najczęstszy sposób w jaki będziesz stosował gradient. Tło tego typu praktycznie zawsze dobrze wygląda, oczywiście o ile dobierzesz je umiejętnie. Za pomocą gradientów stworzysz jasne i ciemne odcienie co pozwoli Ci manipulować ostrością w projekcie, za którym będzie podążać oko widza. Dzięki temu możesz przenieść wzrok widza przez projekt od treści reklamy po przycisk wzywający do działania. Wystarczy odpowiednie użycie odcieni.  Poniższy przykład wykorzystuje właśnie tę technikę gdzie za pomocą jasnego odcienia uwydatniono to co najważniejsze w tej reklamie czyli środek. To właśnie tam widz ma skupiać swój wzrok. Natomiast brzegi tworzą swojego rodzaju winietę czyli ciemniejszy odcień, który sprawi, że wzrok ląduje właśnie na środku projektu.

 

 

 

Gradient na pierwszym planie

Podobnie jak gradient może być używany w tle, może również służyć z powodzeniem jako element pierwszego planu. Warunek jest tutaj jeden: tło musi być jednolite i nie może rozpraszać uwagi. Odpowiedni dobór kolorów w gradiencie, który zapewni czytelność jest tutaj bardzo ważny.

 

 

 

Gradient jako nakładka

Nakładki kolorów w postaci gradientów są obecnie bardzo popularne. Często takim zabiegiem wzbudzamy zainteresowanie zdjęciem, które jest trochę nudne w odbiorze. Jednak nigdy nie stosujemy tej metody aby poprawić kiepską jakość zdjęcia np. niską rozdzielczość. Technika ta, jest bardzo efektowna jednak ostatnio bardzo nadużywana dlatego przed jej zastosowaniem upewnij się czy Twoja reklama wyróżni się tym sposobem od konkurencji.

 

 

 

Gradient jako element identyfikacji firmy

Co raz częściej można zaobserwować trend wykorzystywania gradientu jaki elementu, który charakteryzuje daną firmę. O ile użycie jednej barwy może niekoniecznie zawsze kojarzyć się z daną firmą, to użycie jej w formie gradientu może naprawdę być skuteczną techniką na zapamiętanie elementów graficznych Twojej firmy. Dlatego jeśli postawisz na ten krok wybierz kolor przewodni i przy jego pomocy stwórz gradient, który będzie nadawał się do wielu zastosowań. Od strony internetowej po reklamy oraz elementy na Facebooka. Poniżej mamy przykład strony gdzie wykorzystano dosyć odważny i mocny akcent w postaci gradientu. Trzeba przyznać, że kolor ten zapadnie w pamięć każdemu kto odwiedzi stronę tej firmy.

 

 

 

Natura Twoim pomocnikiem

Często widzę kombinacje kolorów w projekcie, które po prostu nie pasują do siebie. Dobrym przykładem jest przejście z koloru czerwonego do zielonego. Oba są bardzo jaskrawymi kolorami, których nigdy nie uświadczysz w naturze. Na niebie jest wiele różnych gradientów: pomarańczowo-purpurowy, purpurowo-czerwony, niebiesko-fioletowy, ale czy widziałeś niebo “zielono-czerwone” ? Innym trafnym przykładem tego, czego nie należy robić, jest “pomarańczowo-niebieski”, ponieważ nie występuje on w naturze razem. Zazwyczaj łącznikiem pomarańczowego z niebieskim są czerwienie oraz purpury.

 

 

 

Moim zdaniem największą inspiracją do poszukiwania wspaniałych naturalnych gradientów jest natura. W szczególności niebo. Spójrz na niebo o zachodzie lub wschodzie słońca. Praktycznie o każdej porze roku można zauważyć zupełnie inne barwy. Spójrz na niebo rano, w południe czy wieczorem. To co dzieje się na niebie i jakie przybiera ono wtedy kolory może być doskonałą inspiracją dla tworzenia gradientów.

 

 

Jednak natura to nie tylko niebo ale również zwierzęta, drzewa, zmieniające się pory roku, góry, morze. Zobacz jak wszystkie te elementy dają nam kolory, które z powodzeniem wykorzystasz przy tworzeniu gradientów.

 

 

 

Wykorzystaj gotowe palety gradientów. 

Wbrew pozorom stworzenie udanego gradientu, który nie będzie przytłaczający i przede wszystkim ustawienie w nim współgrających ze sobą kolorów jest trudnym zadaniem. Jednak receptą na to możę być skrozystanie ze stron, ktore oferują gotowce w postaci palet gradientów. Wystarczy je skopiować do programu i macie świetnie wyglądajace zestawy gradientów.