Splendid kuvitettu verkkosivujen kokoelma
Kuvitettu lisäys verkkosivustoihin voi lainata jopa selvimmän teeman ylimääräisen visuaalisen kiinnostuksen ja monimutkaisuuden.
Kuvat vaihtelevat suuresti yhdestä paikasta toiseen. Jotkut näyttävät käsin piirretyiltä (riippumatta siitä, ovatko ne vai eivät), kun taas toiset ovat tietenkin digitaalisesti muotoiltuja.
Alla on yli kolmekymmentä suurta verkkosivujen malleja, joissa on kuvituksia.
Yleisimpiä ovat kuvakkeet otsikoissa ja taustoissa, usein sivuston maskotteista tai merkkeistä.
Mutta kuvituksia käytetään myös muilla tavoin. Jos sinulla on suosikki kuvitettu sivusto, jota ei ole mainittu täällä, ilmoita meille huomautuksissa.
Digitaalisten kuvitusten kohteet
Näillä sivustoilla on luonnollisesti digitaalisia kuvia. Sileät viivat ja kirkkaat värit ovat tämän tyylin tunnusmerkkejä, mutta kaikki alla kuvatut ominaisuudet eivät vastaa näitä standardeja.
F5
F5-sivustolla on oivallinen digitaalinen kuva taustastaan. Kirkkaat värit ja sarjakuvahahmot ovat tyypillisiä digitaalisille kuvituksille. Mitä ei näy tässä, on se, että kuva jatkuu sivua alaspäin paljastaen eri kerrokset.
Wireframe Plus
Wireframe Plus käyttää monokromaattista taustakuvaketta sivustoilleen. Se on hienovarainen, mutta todella lisää ylimääräistä ulkoasua ja tekee sivustosta erottuvan, vaikka värimaailma ja typografia ovat melko tavallisia.
Tom Bradshaw Design
Tom Bradshaw Design käyttää havainnollista tyyliä koko sivustolla sekä sarjakuvahahmoja, joka näkyy sivun jokaisessa osassa (se on yhden sivun sivusto).
Mediocore
Tällaisia kiiltäviä digitaalisia kuvioita ei näy kovin usein ja erottuvat muilta sivuilta. Tämä erottuu entistäkin enemmän, koska se on sijoitettu mustalle taustalle ja käyttää vain kirkkaita värejä sivulla.
htmlMafia
Kuvissa on eräänlainen sekoitus digitaalisten ja käsin piirrettyjen tyylejen välillä, vaikkakin käytettävät kaltevuudet tuovat heidät lujemmin digitaaliseen luokkaan. Tämä on hieno esimerkki siitä, miten kuvitukset herättävät sivuston ja antavat dramaattisen vaikutelman.
CreativeSwitch
Tässä kuvattu robotti on itse asiassa animoitu verkkosivustolla itsestään, vaikkakin hienovaraisesti. Muita kuvia käytetään koko sivustolla.
690 Suunnittelu
Linkkien liittäminen verkkosivuston kopioon on loistava strategia. Täällä tekstissä teksti käsittelee harmoniaa, ja kuvassa käytetään orkesterin johtajaa.
kipu
Yksinkertaiset, vektori-tyyliset kuvitukset ovat erittäin rohkeita. Käyttämällä niukempiä väripaletti niitä varten, kuten edellä, tekee niistä sekoitus saumattomasti muuhun sivustoon.
Syrjäys 1
Nämä merkit ovat toinen esimerkki digitaalisista kuvista, joilla on käsin piirretty tunne heille. Yhdessä värimallin kanssa nämä kuvat antavat verkkosivustolle rentoa, ystävällistä tunnetta.
PixelBaecker
Tässä vektori-tyyppisessä kuvassa on paljon tapahtumia, sillä kaverit työskentelevät reikään maan alla linnun puuhun. Stylistisesti se on melko tyypillinen vektorikuva, vaikkakin toteutus on ihanaa.
Pieoneers
Kuvitteiden käyttäminen hyödyistä puhuttaessa tai muiden tietojen tarjoaminen ilman, että se muuttuu info-graafiksi, on loistava strategia. Se on hauska ja mielenkiintoinen tapa välittää tietoa, joka todennäköisemmin vie kävijöitä. Plus, yhdistelmä piirakka ja lentävä lautanen tässä on vain erinomainen!
Jacob Lee
Tässä kuvattu pingviini näyttää melkein käsin piirrettyinä, mutta se on vain hieman liian kiillotettu ja sileä. Vihainen valkoinen väritys (tai sen puuttuminen) todella erottuu värikkään taustan vasten.
Treehouse editointi
Kuvitettu tausta vaihtuu sivulta sivulle, ja siinä on hienoja animaatioita. Mutta se on kaunis taideteos, joka on toisen näköinen.
Koodi Crunchers
Yleisimmät digitaaliset kuvat ovat yksinkertaisia merkkejä tai hirviöitä, kuten tämä. Ja maskotti, se toimii täydellisesti sivuston nimen kanssa.
Forrst
Tämän kaltaiset taustat ovat yleistyneet. Täydellinen integraatio sisällön ja taustan välillä on se, mikä tekee siitä todella erottuvan.
Coo / Coo Core
Tällöin enemmän abstrakteja kuvioita antavat sivustolle nykyaikaisen tunteen. Tämä on vain riittävän abstrakti niin, että se on vielä tunnistettavissa puuna.
Joystick Generals
Perusmerkin toistaminen otsikon taustalla lisää ylimääräistä visuaalista mielenkiintoa suhteellisen yksinkertaiseen kuvaan. Käytetty värimalli on yksinkertainen, mutta yhdistettynä grungy-taustaan näyttää upealta.
Tee elokuvatyö
Kuvat näkyy harvemmin grunge-tyyppisissä sivustoissa, luultavasti siksi, että se aiheuttaa riskin visuaalisen sekavuuden luomisesta. Mutta yksinkertainen kuva täällä, sen mykistynyt värimalli ja hienovarainen rakenne, toimivat hyvin minimalistisemmassa grunge-suunnittelussa.
Solid Studios
Toinen hyvä esimerkki yksinkertaisista digitaalisista hirviöistä, joita käytetään suunnittelussa. Nämä kaverit ovat rentoja ja hauskoja, ja tekevät sivustosta tuntuvan samalla.
Olive Crush
Yläosat ovat yksi houkuttelevimmista alueista, joilla kuvitusta käytetään. Luovalla pudotusvarjojen käytöllä tämä otsikon kuva näyttää melkein 3D: ltä.
Sara Tusar
Toinen hieno esimerkki hirviöistä, tällä kertaa otsikkosuunnittelussa. He ovat hienovaraisia, kaikuvat värejä muusta verkkosivustosta, mutta antavat henkilökohtaisemman kosketuksen.
Arbel-Designs
Arbel-Designs-sivusto käyttää monikerroksista kuvitettua taustaa, joka alkaa sivun yläosassa olevasta avaruudesta ja etenee syvään vedenalaiseen. Tämä kuvitettu taustakuva toimii hyvin yhden sivun sivustoilla.
Minding hirviöt
Nämä ovat joitain yksinkertaisimpia vektorihahmoja tässä viestissä. He ovat kuitenkin erittäin söpöjä ja ovat täysin mukana sivuston suunnittelussa. Itse asiassa ne ovat koko sivuston kohta.
Sivustot, joissa on käsin piirrettyjä kuvituksia
Käsin vedetyt kuvat ovat harvinaisempia web-suunnittelussa, mutta siellä on vielä hienoja esimerkkejä. Ne vaihtelevat hieno-piirustuksista piirustustöihin ja kaikenlaisiin piirteisiin.
Steve Schoger
Tällaiset yksinkertaiset luonnokset toimivat hyvin mille tahansa sivustolle, mutta varsinkin kun ne korvaavat tyypillisen (tai ammattimaisen) valokuvan. Ne ovat myös hyvä vaihtoehto niille, jotka ovat kammottavia! Tekniikan taustakuvan antaminen ihon sävyn antamiseksi on mukava kosketus.
Kenny Meyers
Esimerkki supersankarista siitä, mikä on muutoin melko vähäinen sivusto, voi auttaa lisäämään luottamusta kävijöihisi turvautumatta "yritys" -kykyiseen sivuston suunnitteluun. Kaikuvat värit muualta sivustolta varmistavat, että kuva yhdistyy saumattomasti.
Andy Ward
Havainnolliselle on vain järkevää sisällyttää kuvituksia sivuilleen. Andy Ward käyttää diaesitystä kuvistaan otsikossaan, mutta ne on sisällytetty niin, että ne tulevat osaksi itseä.
Kilian Muster
Muodollisempi, hienomustekuvainen viivapiirustus, kuten tämä, tarjoaa nyökkäyksen perinteelle; tässä tapauksessa perinteiset lajittelumenetelmät. Se on yksinkertainen, mutta tarpeeksi rohkea todella vaikuttamaan.
DNA Darwinille
Toinen suuri esimerkki sivustosta, joka käyttää virallisia piirustuksia historiallisen tunnelman luomiseen. Kerrokselliset kuvat tekevät siitä mielenkiintoisemmaksi.
Rusetti
Satunnaisempi käsin piirretty sivusto, jossa on käsin piirrettyjä hirviöitä (vai onko ulkomaalainen?). Sivusto käyttää monikerroksista taustakuvaa, joka alkaa avaruudessa ja päättyy mereen.
xhtmlCafe
Käsin piirretty kuva yhdistettynä vesiväriin luo fantastisen ja informatiivisen otsikon xhtmlCafe-sivustolle. Maalauksen piirretyt elementit antavat sille enemmän tyyliteltyä tunnetta kuin suoralla akvarellilla.
Web-hyökkäys
Millainen kuva kuvitetuilla verkkosivuilla olisi ilman esimerkkiä sarjakuva-tyylistä kuvaa? Kaikki viivojen paksuus ja kuvioitu väritys muistuttavat suosikki sarjakuvaasi tai graafista romaania.
Janko at Warp Speed
Yksinkertainen kuva otsikossa on hienovaraista ja aliarvioitua, mutta lisää valtavan määrän esteettistä houkuttelevuutta sivuston suunnitteluun.
Kirjoitettu yksinomaan WDD: lle Cameron Chapman .
Jos sinulla on muita suosittuja verkkosivustoja, ole hyvä ja jaa kommentit!