Kolekcja wspaniałych zilustrowanych stron internetowych
Zilustrowane dodatki do stron internetowych mogą nadać nawet najczystszej tematyce dodatkowy poziom wizualnego zainteresowania i złożoności.
Ilustracje różnią się znacznie w zależności od miejsca. Niektóre wyglądają ręcznie (bez względu na to, czy są, czy nie), podczas gdy inne są oczywiście cyfrowo renderowane.
Poniżej znajduje się ponad trzydzieści wspaniałych projektów witryn z ilustracjami.
Najczęściej są to ilustracje w nagłówkach i tła, często maskotek lub postaci.
Ale ilustracje są również wykorzystywane w inny sposób. Jeśli masz ulubioną ilustrowaną stronę, która nie jest tu wymieniona, daj nam znać w komentarzach.
Witryny z ilustracjami cyfrowymi
Witryny te mają ilustracje, które są oczywiście cyfrowe. Gładkie linie i jasne kolory są cechami charakterystycznymi tego stylu, chociaż nie wszystkie poniższe elementy odpowiadają tym standardom.
F5
Strona F5 używa kapryśnej cyfrowej ilustracji dla ich tła. Jasne kolory i kreskówkowe postacie są typowe dla cyfrowych ilustracji. To, co nie jest tutaj widoczne, polega na tym, że ilustracja przesuwa się dalej po stronie, ukazując różne warstwy.
Model szkieletowy Plus
Wireframe Plus wykorzystuje monochromatyczną ilustrację tła dla swojej witryny. Jest subtelny, ale naprawdę dodaje trochę wizualnego oomph i sprawia, że strona się wyróżnia, mimo że kolorystyka i typografia są dość standardowe.
Tom Bradshaw Design
Tom Bradshaw Design wykorzystuje ilustrowaną typografię na całej stronie, a także maskotkę z postaciami z kreskówek, która pojawia się w każdej sekcji strony (jest to strona jednostronicowa).
Mediocore
Błyszczące cyfrowe ilustracje, takie jak ten, nie są często widywane i wyróżniają się na innych stronach. Ta wyróżnia się jeszcze bardziej, ponieważ jest umieszczona na czarnym tle i używa tylko jasnych kolorów na stronie.
htmlMafia
Ilustracje są tutaj mieszanką stylów cyfrowych i ręcznie rysowanych, chociaż zastosowane gradienty sprawiają, że są bardziej kategoriami cyfrowymi. To doskonały przykład tego, jak ilustracje ożywiają stronę i dają bardziej dramatyczne wrażenie.
CreativeSwitch
Robot zilustrowany tutaj jest rzeczywiście animowany na samej stronie, choć subtelnie. Dodatkowe ilustracje są używane na całej stronie.
690 Design
Wiązanie ilustracji z kopią strony to fantastyczna strategia. W tym miejscu tekst z napisem omawia harmonię, a do ilustracji służy dyrygent orkiestry.
Kipu
Proste, wektorowe ilustracje mają bardzo odważny wpływ. Używanie bardziej wyciszonej palety kolorów, jak wyżej, sprawia, że płynnie łączą się one z resztą witryny.
Siringa 1
Te postacie są kolejnym przykładem cyfrowych ilustracji, które mają dla nich pociągające uczucie. W połączeniu z kolorystyką te ilustracje sprawiają, że strona internetowa jest wyluzowana i przyjazna.
PixelBaecker
Na tej ilustracji w stylu wektorów dzieje się dużo, od facetów pracujących w podziemnej dziurze do ptaka w drzewie. Stylistycznie jest to dość typowa ilustracja wektorowa, choć wykonanie jest wspaniałe.
Pieoneers
Używanie ilustracji do mówienia o korzyściach i oferowaniu innych informacji, bez przekształcania go w grafikę informacyjną, to świetna strategia. To ciekawy i interesujący sposób na przekazanie informacji, które z większym prawdopodobieństwem przyciągną uwagę użytkowników. Poza tym połączenie pie i latającego talerza jest po prostu znakomite!
Jacob Lee
Przedstawiony tutaj pingwin prawie wygląda ręcznie, ale jest nieco zbyt wypolerowany i gładki. Ostra biała kolorystyka (lub jej brak) naprawdę wyróżnia się na tle kolorowego tła.
Edycja Treehouse
Zilustrowane tło zmienia się z jednej strony na drugą i ma subtelne animacje. Ale to piękne dzieło sztuki, godne drugiego spojrzenia.
Kod Crunchers
Najczęstsze cyfrowe ilustracje to proste postacie lub potwory takie jak ten. I jako maskotka doskonale pasuje do nazwy strony.
Forrst
Zilustrowane tła, takie jak ten, stają się coraz częstsze. Pełna integracja treści z tłem to właśnie to, co wyróżnia ten produkt.
Coo / Coo Core
Bardziej abstrakcyjne ilustracje, takie jak ta, nadają witrynie bardziej nowoczesny charakter. Ten jest na tyle abstrakcyjny, że można to zrobić, a jednocześnie można go rozpoznać jako drzewo.
Generatory joysticków
Powtarzanie podstawowej postaci w tle nagłówka dodaje dodatkową warstwę wizualnego zainteresowania do tego, co jest stosunkowo prostą ilustracją. Użyty tutaj schemat kolorów jest prosty, ale w połączeniu z grungy tłem wygląda fantastycznie.
Nakręć film
Ilustracje są rzadziej spotykane na stronach w stylu grunge, prawdopodobnie dlatego, że stwarzają ryzyko tworzenia bałaganu wizualnego. Ale prosta ilustracja z wyciszoną kolorystyką i subtelną teksturą doskonale sprawdza się w bardziej minimalistycznym stylu grunge.
Solid Studios
Kolejny świetny przykład prostych cyfrowych potworów używanych w projekcie. Ci faceci są zwyczajni i zabawni, i sprawiają, że strona czuje się tak samo.
Olive Crush
Nagłówki są jednymi z najbardziej odpornych na błędy obszarów do wykorzystania ilustracji. Poprzez twórcze wykorzystanie cieni, ta ilustracja nagłówka prawie wygląda na 3D.
Sara Tusar
Kolejny świetny przykład potworów, tym razem w projekcie nagłówka. Są subtelne, echo kolorów od reszty strony internetowej, ale nadają bardziej osobisty charakter.
Arbel-Designs
Strona Arbel-Designs używa wielowarstwowego ilustrowanego tła, zaczynającego się w przestrzeni u góry strony i rozwijającego się głęboko pod wodą. Ten styl ilustrowanego tła działa świetnie na stronach z jedną stroną.
Minding Monsters
To jedne z najprostszych postaci wektorowych w tym poście. Są jednak bardzo urocze i w pełni włączone do projektu strony. W rzeczywistości to cały punkt witryny.
Miejsca z ręcznie rysowanymi ilustracjami
Rysunki ręczne są mniej powszechne w projektowaniu stron internetowych, ale wciąż istnieją fantastyczne przykłady. Obejmują one od rysunków artystycznych do doodli i wszystkiego pomiędzy.
Steve Schoger
Proste szkice, takie jak ten, doskonale sprawdzają się na każdej stronie, ale zwłaszcza gdy zastępują typowe zdjęcie projektanta (lub innego profesjonalnego). Są także świetną alternatywą dla tych, którzy są nieśmiali! Pozwalanie przejrzeć teksturę tła, aby nadać odcieniu skóry, jest miłym akcentem.
Kenny Meyers
Ilustracja superbohatera, który w przeciwnym razie jest dość minimalistyczną witryną, może pomóc zaszczepić zaufanie odwiedzających, nie odwołując się do "korporacyjnego" projektu strony. Wyraźne kolory z innych miejsc na stronie zapewniają płynną integrację ilustracji.
Andy Ward
Dla ilustratora jest sensowne umieszczanie ilustracji na swojej stronie. Andy Ward korzysta z pokazu slajdów swoich ilustracji w nagłówku, ale są one włączone w taki sposób, że stają się częścią samego projektu.
Kilian Muster
Bardziej formalny, stylowy rysunek linii, jak ten, jest ukłonem w stronę tradycji; w tym przypadku: tradycyjne metody składu. Jest prosty, ale na tyle odważny, aby naprawdę wywrzeć wpływ.
DNA do Darwina
Kolejny świetny przykład witryny wykorzystującej formalne rysunki liniowe do stworzenia poczucia historii. Warstwowe ilustracje sprawiają, że jest jeszcze bardziej interesujący.
Muszka
Bardziej zwyczajna, ręcznie rysowana strona, z ręcznie rysowanymi potworami (a może obcym?). Witryna wykorzystuje wielowarstwową ilustrację tła, zaczynającą się w przestrzeni kosmicznej i kończącą się w morzu.
xhtmlCafe
Ręcznie rysowana ilustracja połączona z akwarelami tworzy fantastyczny i informacyjny nagłówek na stronie xhtmlCafe. Szkicowane elementy w obrazie nadają mu bardziej stylizowane uczucia niż zwykła akwarela.
Atak sieci
Czym byłby post na ilustrowanych stronach internetowych bez przykładu ilustracji w stylu komiksu? Wszystko, począwszy od grubości linii do kolorystyki teksturowanej, przypomina ulubioną komiks lub powieść graficzną.
Janko at Warp Speed
Prosta ilustracja w nagłówku jest subtelna i dyskretna, ale dodaje ogromnej estetyki do projektu strony.
Napisany wyłącznie dla WDD przez Cameron Chapman .
Jeśli masz inne ulubione ilustrowane strony internetowe, podziel się nimi w komentarzach!