Satriecošs dizains savvaļā: Sevenly.org
Ik pa laikam es saskaros ar vietni, kurā ir viens vai divi patiešām iedvesmojoši dizaina un lietotāja interfeisa elementi, kas ir pietiekami labi, lai es par tiem varētu rakstīt. Vēl retākos gadījumos es atradu visu vietni, kas ir tik ļoti pārpildīta ar unikāli lieliskām dizaina idejām, ka man tā ir jādalās ar jums. Šis raksts ir par vienu šādu vietni.
Sevenly.org ir vietne, kas paredzēta labdarības organizāciju palīdzībai, pārdodot ierobežota apjoma pielāgotus t-kreklus. Papildus tam, ka es mīlu organizāciju un to, par ko viņi iestājas, mani aizrauj tas, ko viņi ir paveikuši ar vietni, un es domāju, ka tā kalpo kā mācību līdzeklis tīmekļa dizaineriem. Apskatīsim!
Izpētiet dizaina resursus
Iepazīstieties ar septiņiem
Septiņu misija ir vienkārša: “Izmantot mākslas un sabiedrības spēku, lai veidotu ilgtspējīgu izpratni un finansēšanas kustības, kas atbalsta labdarības organizācijas centienos mainīt pasauli.”
Praksē, kā tas izskatās, viņi pārdod superīgus produktus (t-kreklus, kreklus, ūdens pudeles utt.) Un ziedo 7 USD no katra pirkuma labdarībai, kuru viņi ir izvēlējušies atbalstīt šajā nedēļā. Līdz šim viņi ir nopelnījuši gandrīz 600 000 USD dažādām labdarības organizācijām.
Lielisks dizains
Atkal cēlonis un stratēģija nopelnīja klikšķi no manis Twitter, taču tieši tas dizains mani pamudināja un ieinteresēja. Kā redzat ekrānuzņēmumā iepriekš, mājas lapa ir diezgan pievilcīga.
Tas skaisti parāda produktus ar jaukām, lielām fotogrāfijām ar izskatīgiem, smaidošiem cilvēkiem, kas valkā ļoti pievilcīgi noformētu apģērbu. Mūra izkārtojums piešķir lapai organisku izskatu, un minimālais dizains / krāsu shēma patiešām pievērš jūsu uzmanību šīm lielajām fotogrāfijām.
Vietne vienā mirklī izskatās lieliski, bet, kad jūs sākat to izmantot, ir tikai tik daudz patīkamu pārsteigumu un lielisku mazu triku, ka es jutos zaudēts, spēlējot ar katru lapu vairākas minūtes. Apskatīsim dažus interesantus pieskārienus.
Hover Effects Galore
Es esmu milzīgs hover efektu ventilators. Es zinu, ka tie ne vienmēr ļoti labi pārveido skārienekrānus, taču jūs varat par to ņemt vērā. Darbvirsmā tie ir viens no galvenajiem veidiem, kā mēs mijiedarbojamies ar lietotājiem pamata līmenī.
Septiņi vienkārši ir pārpildīti ar vēsiem lidināšanās efektiem. Ik uz soļa jūs gaida slidenas, mazas animācijas. Tas sākas ar mājas lapas apģērbu priekšskatījumiem:
Pēc noklusējuma produkta nosaukums un cena ir paslēpti, bet, tiklīdz virziet kursoru virs attēla, tas slīd uz leju, lai atklātu šo informāciju. Pārlecot uz lapas malu, šeit ir trīs pogas, un katra no tām izplešas uz garu horizontālu joslu.
Pēc vienas un tās pašas tēmas par elementa lieluma mainīšanu, virzot kursoru, mazajām kopīgošanas joslām ir arī pogas, kas kļūst platākas, virzot peles rādītāju virs tām, mudinot uz visu svarīgo klikšķi.
Tīri ritināms Voodoo
Mana absolūtā mīļākā lieta šajā lapā ir ritināšanas maģija, kas notiek mājas lapā. Tas patiesībā ir patiešām vienkāršs efekts, bet tas ir tik labi pārdomāts, ka es nevarēju palīdzēt, bet esmu pārsteigts.
Pēc noklusējuma, ielādējot lapu, tas ir tas, ko redzat:
Likmes ir, ka jūsu pirmā reakcija būs ritināt lapu uz leju. To darot, tumšā sadaļa, kas apraksta vietni, kļūst īsāka un īsāka, līdz tā ir tikai maza navigācijas josla, kas paliek jums ritināšanas laikā.
Liela daļa ir tā, ka ar to neapstājas. Lai gan jūs, iespējams, nedomājat to darīt, patiesībā varat ritināt augšup pa sākotnējo sākuma stāvokli. Tas notiek pretēji tam, ko mēs redzējām iepriekš, un paplašina aptumšoto sadaļu, lai sniegtu jums vairāk informācijas par vietnes pašreizējo labdarību.
Tas ir tik elegants veids, kā nelielā telpā uzglabāt daudz informācijas un pakāpeniski to atklāt lietotājiem. Tas ir vienkārši pietiekami paslēpts, ka, ielādējot lapu, jūs neapbēdina, bet ir tikpat acīmredzams, ka jūs nevarat to palaist garām, ritinot atpakaļ uz lapas augšdaļu pēc sākotnējās izpētes.
Cipari un koplietošana
Ņemot vērā, ka šī vietne ir tik ļoti vērsta uz labdarību, noformējumam tika izvirzīti divi mērķi. Jūs varat pateikt, jo viņi vada visu izkārtojumu. Pirmais ir caurskatāmības un progresa līmenis, ko paziņo ar statistikas starpniecību. Šeit ir norādīts, cik daudz mēs līdz šim esam palielinājuši, lūk, kādas ir mūsu mērķa summas utt.
Otrais mērķis ir pēc iespējas cilvēciskāk mudināt dalīties, izmantojot sociālos medijus. Mājas lapā ir iebūvēta milzīga Facebook komentāru sadaļa, un ap šo vietni ir daudz citu sociālo pogu un joslu.
Personīgais pieskāriens
Dodoties garām mājas lapai, pārsteidzošais dizains neapstājas. Nākamā ir “Komandas” lapa, kur jūs varat satikt dažādus dalībniekus, kas iesaistīti projektā.
Tāpat kā iepriekš, šeit mēs redzam dažus jautrus lidināšanās efektus. Katram komandas loceklim tiek parādīts aplis ar tikai galvu. Tiklīdz jūs novietojat kursoru virs apļa, viņi iznāk uz skatu ar muļķīgu seju.
Apskatot šo lapu, es sapratu, ka tajā ir kārtējais pārsteigums: fons patiesībā ir video! Tas ir ļoti smalks, un jūs, iespējams, sākumā pat nepamanīsit, kāpēc tas ir tik jauki. Video ir izplūdis un tumšs, tāpēc tas nav pārāk uzmanīgs.
Stāstu grāmata
Pēdējā lieta, ko es gribētu parādīt, ir lapa “Mūsu stāsts”, kurā jums mazliet pastāstīts par to, kāpēc tika sākta programma Sevenly. Neuzņemoties neko darīt tā, kā jūs gaidījāt, Sevenly komanda nolēma jums uzdāvināt satriecošu infografiku, nevis garu, garlaicīgu stāstu.
Ievērojiet, kā šī infografika ir strukturēta: problēma un risinājums. Jūs redzat, ka šis formāts tiek izmantots citur visā vietnē, lai pastāstītu par katras labdarības organizācijas stāstu. Pirmkārt, viņi ļoti vienkārši izklāsta problēmu, pēc tam stāsta, kā viņi to palīdz atrisināt. Tas ir atsvaidzinoši vienkāršs un saprotams.
Ko tu domā?
Es gribētu paskaidrot, ka es nekad neesmu runājis ar Septiņiem cilvēkiem, viņi netuvojās man, lai uzrakstītu šo rakstu vai kaut kādā veidā mani uzrunātu. Es vienkārši ļoti novērtēju viņu paveikto gan kā cilvēks, gan kā dizainers.
Noteikti apmeklējiet Sevenly.org, kad nākamreiz jums būs nepieciešama pamatīga iedvesma. Ne tikai skatieties, mijiedarbojieties ar vietni un izbaudiet visus jaukos mazos dizaina pieskārienus, kas to padara tik izsmalcinātu. Turklāt, ja jūs meklējat dažus dizaineru statusam atbilstošus kreklus, jūs nevarat pārspēt satriecošos Sevenly dizainus.
