Strašan dizajn u divljini: Sevenly.org
S vremena na vrijeme naiđem na stranicu koja ima jedan ili dva zaista nadahnjujuća bitova dizajna i korisničkog sučelja koji su dovoljno dobri da pišem o njima. Na još rjeđim slučajevima pronalazim cijelo mjesto koje je tako prepuno jedinstvenih divnih ideja dizajna da ga moram podijeliti s vama. Ovaj članak govori o jednom takvom mjestu.
Sevenly.org je web mjesto posvećeno pomaganju dobrotvornim organizacijama prodajom ograničenih izdanja prilagođenih majica. Osim činjenice da volim organizaciju i za šta se zalažu, odglumio me to što su učinili sa stranicom i mislim da ona služi kao sredstvo učenja web dizajnera. Pogledajmo!
Istražite dizajnerske resurse
Upoznajte se sedam
Misija Sevenlyja je jednostavna: „Usmjeriti snagu umjetnosti i zajednice za izgradnju održive svijesti i pokreta financiranja koji podržavaju dobrotvorne organizacije u njihovim naporima da promijene svijet.“
U praksi, kako to izgleda, prodaju super fantastične proizvode (majice, dukseve, boce s vodom itd.) I doniraju 7 dolara od svake kupovine u dobrotvorne svrhe koje su odlučili podržati u tom tjednu. Do danas su prikupili gotovo 600 000 USD za razne dobrotvorne organizacije.
Izvrstan dizajn
Još jednom, uzrok i strategija zaradili su me na Twitteru, ali upravo me je dizajn uvukao i zainteresirao. Kao što možete vidjeti na gornjoj snimci zaslona, početna stranica prilično je atraktivna.
Izdvaja proizvode lijepo s lijepim i velikim fotografijama lijepog osmijeha koji nose vrlo atraktivno dizajniranu odjeću. Zidani izgled daje stranici organski osjećaj, a minimalna shema dizajna / boja zaista gura vašu pažnju prema tim velikim fotografijama.
Stranica izgleda sjajno na prvi pogled, ali kako ga počnete koristiti, ima upravo toliko ugodnih iznenađenja i sjajnih malih trikova da sam se izgubila, igrajući se sa svakom stranicom nekoliko minuta. Pogledajmo nekoliko zanimljivih dodira.
Hover efekti Galore
Veliki sam obožavatelj lebdećih efekata, znam da oni uvijek ne prevode na dodirne zaslone baš najbolje, ali možete to objasniti. Na radnoj površini oni su jedan od primarnih načina na koji komuniciramo s korisnicima na osnovnoj razini.
Sedam je jednostavno prepuno hladnih efekata lebdenja. Glatke male animacije čekaju vas na svakom koraku. Sve započinje pregledima odjeće na početnoj stranici:
Prema zadanom su naziv proizvoda i cijena skriveni, ali čim pokažite miš iznad miša, ona se pomakne prema dolje kako bi otkrila ove podatke. Skočivši na bočnu stranu stranice, ovdje su tri gumba od kojih se svaki širi u dugačku vodoravnu traku iznad miša.
Slijedeći istu temu promjene veličine elementa na pokazivaču, mali trake za dijeljenje imaju i gumbe koji postaju širi kad pokažite mišem iznad njih, ohrabrujući taj važan klik.
Čisti klizanje Voodoo
Moje apsolutno najdraže na ovoj stranici je magija pomicanja koja se događa na početnoj stranici. To je zapravo vrlo jednostavan efekt, ali toliko je dobro osmišljen da nisam mogao a da ne zadivim.
Kada učitavate stranicu, prema zadanom, to je ono što vidite:
Kvote su, vaša prva reakcija bit će kretanje po stranici. Dok to radite, tamni odjeljak koji opisuje web mjesto postaje sve kraći i kraći sve dok ne bude samo mala navigacijska traka koja ostaje s vama dok se krećete.
Sjajni dio je što se tu ne zaustavlja. Iako možda niste pomislili da to učinite, zapravo se možete pomaknuti prema prvobitnom početnom položaju. To čini suprotno onome što smo vidjeli prije i proširuje zamračeni odjeljak kako bi vam pružio više informacija o trenutnoj dobrotvornosti web mjesta.
To je tako elegantan način da pohranite tonu informacija u mali prostor i postupno ga otkrijete korisnicima. Dovoljno je skriven da vas ne preplavi prilikom učitavanja stranice, ali dovoljno očito da ga ne možete propustiti kad se pomičete prema gore do vrha stranice nakon početnog pregleda.
Brojevi i dijeljenje
S obzirom da je ovo mjesto toliko usredotočeno na dobrotvornu pomoć, za dizajn su postavljena dva cilja. Možete reći jer oni pokreću cijeli izgled. Prvi je stupanj transparentnosti i napretka, koji se komuniciraju statističkim podacima. Evo koliko smo dosad pokupili, evo koji su nam ciljni iznosi itd.
Drugi je cilj potaknuti dijeljenje što je više moguće ljudskim putem korištenjem društvenih medija. Postoji ogroman odjeljak za komentare na Facebooku ugrađen pravo na početnu stranicu i mnoštvo drugih gumba i traka s društvenim mrežama oko stranice.
Osobni dodir
Prelazeći mimo početne stranice, zadivljujući dizajn ne prestaje. Sljedeća je stranica „Tim“ na kojoj možete upoznati razne članove koji su uključeni u projekt.
Kao i prije, vidimo kako se i ovdje primjenjuju neki zabavni efekti lebdenja. Svaki član tima prikazan je u krugu s ispruženom glavom. Jednom kada pređete iznad kruga, iskoče iz vida s blesavim licem.
Pregledavši ovu stranicu shvatio sam da je održalo još jedno iznenađenje: pozadina je zapravo video! Vrlo je suptilan i možda na početku možda ni ne primijetite, zbog čega je tako lijepo. Videozapis je zamagljen i mračan, tako da nije previše zbunjujući.
Storygraphic
Posljednje što bih želio istaknuti je stranica "Naša priča" koja vam malo govori o tome zašto je Sevenly započeo. Ne zadovoljan što će učiniti bilo što na način koji očekujete, ovdje je ekipa Sevenly odlučila dati vam fantastičnu infografiku umjesto duge, dosadne priče.
Primijetite način strukturiranja ove infografije: problem u odnosu na rješenje. Vidite ovaj format koji se koristi drugdje na cijelom web mjestu za prenošenje priče iza svake dobrotvorne organizacije. Prvo navode problem na vrlo jednostavne načine, a zatim prenose kako oni pomažu u njegovom rješavanju. Osvježavajuće je jednostavan i jasan.
Što misliš?
Želio bih vam pojasniti da nikada nisam razgovarao sa Sedam ljudi, nisu mi prišli da napišem ovaj članak niti su mi se obratili na bilo koji način. Jednostavno cijenim ono što rade, i kao ljudsko biće i kao dizajner.
Obavezno posjetite Sevenly.org sljedeći put kada vam treba čvrsta inspiracija. Ne samo pogledajte, već komunicirajte s web-lokacijom i osjetite sve lijepe male dizajnerske dodire koji čine da se osjećate tako rafinirano. Također, ako imate na tržištu neke majice koje odgovaraju vašem statusu dizajnera, ne možete pobijediti fantastične modele Sevenly.
