Utforsker Human-Centric Web

For en tid siden publiserte jeg en artikkel som beskriver en arbeidsflyt som støtter og understreker menneskelig sentrisk tenkning i webdesign. I denne artikkelen vil vi undersøke nettsteder som bruker denne metoden og se hvordan menneskelig sentrisk design har bidratt til deres suksess.


Ser tilbake

Først av alt, her er en påminnelse om hvordan menneskelig sentrisk tenkning kan brukes på nettet.

  1. Utforskning: Et nettsted er et medium som ofte brukes til å løse noe, både for målgruppen og for klienten. Leting handler om å forstå interessenter, selv de som ikke er åpenbare.
  2. Design: Menneskelig sentrisk design handler ikke om å skape det perfekte produktet, det handler om å finne den beste løsningen, som ofte er et kompromiss.
  3. Gjennomføring: Hver oppdatering følges av en læringsyklus. Iterere og forbedre.

Case Studies

La oss kritisere noen kjente nettsteder.

Square

Squarespace har som mål å gjøre prosessen med å skape et nettsted tilgjengelig og vakkert. De utmerker seg i å forstå problemene til de involverte interessenter. De gir et produkt for den lille fotografen som bygger sin nettportefølje, nettbutikk-eieren som leter etter en bærekraftig plattform og ekspertutvikleren på jakt etter full kontroll. De undersøkte de vanlige problemene folk møter når de oppretter en online tilstedeværelse og gir en løsning.

Denne filosofien gjenspeiler designen. Squarespace destinasjonssiden består av forskjellige historier, da hvert nettsted har en annen personlighet og hensikt. I stedet for å ha en tom løsning som brukeren kan tilpasse, viser de forskjellige tilpasninger, noe som utløser brukeren lettere ettersom de oppdager mulighetene for produktet.

Ta en titt på skjermbildene nedenfor og se hvordan de bruker design intelligent.

Squarespace viser brukerne de forskjellige trinnene de må ta. Vær oppmerksom på filteralternativene for malene. Kjører du en bedrift? En restaurant? Eller er du ute etter en portefølje? Dashbordet for å administrere nettstedet ditt er enkelt nok for alle å forstå. Denne prissiden gir mening og viser brukerne forskjellene mellom alternativene på en åpenbar måte.

Shopify

Shopify er et annet godt eksempel. De har gjort prosessen med å starte en e-handel nettside mer tilgjengelig, holder brukerens hender som de tar seg av alle nødvendige skritt.

Shopify hjelper brukerne ved å gjøre de utfordrende delene av å administrere et e-handelsnettsted så enkelt som mulig. En av de beste annonseringssidene jeg noensinne har sett. Kortfattet og strukturert.

artsy

Å bringe fysisk kunst til et digitalt rom er et utfordrende mål. Artsy-teamet forstår hvordan kunst er veldig visuelt, og dette gjenspeiles i utformingen av deres nettside.

Både for eksperter og ikke-eksperter, det er tilgjengelig for å filtrere gjennom kunstverk. Det er mulig å filtrere på emne, medium og teknikk, stil og bevegelse, pris og kategori. Alternativet "View in Room" er et perfekt eksempel på menneskelig sentrisk designtanking.

Artsy har omfattende filtreringsalternativer. Torget øverst til venstre i det lilla vinduet gir brukeren et inntrykk av hvor stor kunstverket er sammenlignet med et menneske. Alternativet 'View in Room' gir brukeren en perfekt ide om hvor stort et kunstverk ville være hvis de kjøpte det.

De har klart å gjøre det samme nettstedet enkelt å bruke både for eksperter og de med en liten nysgjerrighet i kunsten. Ta en titt og undersøke dens flyt- og designvalg.

tumblr

Hvis du noen gang har mulighet til å jobbe med en plattform som støtter innhold opprettet av et fellesskap, tenker det primært fra brukerperspektivet ditt produkt enormt.

Det er mange nettsteder som anser samfunnet som deres primære interessent (Tumblr, Twitter og Instagram for eksempel). Uten brukere er deres forretningsmodell ingenting.

Tumblr utforsker måter å gjøre bruken av plattformen enkel for brukerne. Dette viser i brukergrensesnittet.

Eksempel på Tumblrs tilgjengelige brukergrensesnittdesign.

I tillegg er det interessant å sammenligne hvordan Tumblr og Facebook jobber med annonser. Mange føler at Tumblr ikke forstyrrer brukerflyten med annonser, like mye som Facebook gjør, noe som kan være like mye et designvalg som et forretningsvalg.

Tumblr er mindre åpenbare reklame.

Damp

Dette er sannsynligvis et overraskende nettsted for å se på. Selv om det kan være utdatert visuelt, spikret de konseptet om å tilby et e-handels- og fellesskapsside som er elsket av millioner.

Den kontinuerlige utviklingen, tilbudene og støtten til ulike typer utviklere har tiltrukket seg et stort fellesskap. Nylig har de lagt til vurderinger for spill, noe som gjør det enklere for folk å ta smarte beslutninger når de kjøper et nytt spill. Inkludert antall timer spilt til en spillanmeldelse øker troverdigheten. Dette er både gunstig for brukere, samtidig som det sikres at utviklerens spillvurderinger er rimelige. Det er et lite designvalg som har stor innflytelse på brukerens e-handelsadferd.


Du kan bruke denne ideen til ditt neste e-handelsnettsted ved å legge til en tag i brukerens profil hvis de har kjøpt produktet når de vurderer det.

Så mye som Steam støtter spillere, har utviklere også mulighet til å samhandle med samfunnet som er knyttet til deres spill, eller dampsamfunnet som helhet for å få støtte for sitt neste prosjekt.

Threadless

Har #threadpics eller #teestyle ring en klokke? Trådløs er et godt eksempel på hvordan du kan lage et e-handelsnettsted med fokus på å beholde og utvide et fellesskap, mye i stil med Steam.

Designet er strømlinjeformet for å støtte både kjøpere og skapere.


Å finne denne balansen kan være en tøff utfordring. Når du jobber med et slikt prosjekt, er det enkelt å sørge for at du beholder denne balansen, ved å lage et reisekart for brukeren. Dette vil markere potensielle svake punkter i navigasjonsflyten når de er inkonsekvente og forvirrende for den målrettede typen bruker.

Skriv ut designene på nettstedet ditt, bruk en markør for å lage faktiske tilkoblinger og tenk på dine designbeslutninger. Faktisk involvere potensielle brukere og la dem samhandle med en prototype. Hvilken tilbakemelding mottar du?

Tuts+

Den siste inkarnasjonen av Tuts + (referert til kjærlig som "navet") er resultatet av sentralisering og forbedring av eksisterende Tuts + nettsteder, og forståelse, igjen av interessentene. Disse interessentene inkluderer deg, leseren, forfatterne og annonsørene.

Utgivelsen av Tuts + -kurs er et eksempel på hvordan hvert produkt eller tjeneste gjennomgår en læringssyklus med hver utgivelse, og alltid gjenkjenne muligheten for forbedring.


Når du sammenligner de individuelle Tuts + nettstedene og det nye navet, vil du legge merke til et par forskjeller. Det nye navet er responsivt, organisert i emner som er relevante for din interesse, og gir et renere grensesnitt for lesere og annonsører. Som forfattere har vi bedre synlighet, og den relaterte innleggsseksjonen gir oss muligheten til å vise frem mer av vår skriving.


Konklusjon

Når jeg undersøker nettsteder som Trådløs, Tumblr og Artsy, blir jeg kontinuerlig minnet om hvordan det er helt mulig å designe noe som er fantastisk for alle typer brukere, alt samtidig som de ikke-synlige interessentene er fornøyd.

Hva bør du huske på?

  • Forstå dine ulike typer brukere og finn den beste balansen når det gjelder å designe for de brukerne: grensesnitt, merkevarebygging, funksjoner. Det er ingen singel perfekt løsning, kun det beste mulige kompromisset.
  • Sammenlign annonseringsteknikkene til Facebook og Tumblr. Spør deg selv hvordan deres designvalg gjør en åpenbar forskjell for brukerne og annonsørene. Hva er bedre for hvem og hvorfor? Hva kan du lære av dette i ditt neste prosjekt med annonsører?
  • Brukere vil bli utløst lettere når de kjenner til produktet ved å vise tilpassede eksempler, Squarespace og #threadpics er et godt eksempel..
  • Små men smarte designvalg kan ha stor innflytelse. Viser antall timer spilt i gjennomgang av et dampspill er et godt eksempel. Hva er brukere (eller andre interessenter) nysgjerrige på? Gi hva brukerne anser verdifulle, selv om de selv ikke gjenkjenner det enda.
  • Respekter at alt du lager, har mulighet til å forbedre basert på hvordan interessenter interagerer med produktet ditt.
  • Utforsk, designe, implementere. Gjenta.