Psykologi i brukervennlighet. Åtte gylne regler for frontend-utviklere

Psykologisk fakultet, Moskva statsuniversitet

Kollektiv, bevisst

Hvordan lage perfekt grensesnitt

Tenk deg at du er en designer og utvikler grensesnittet til en Internett-applikasjon. Hvordan kan psykologivitenskapen hjelpe deg? Selvfølgelig, med min forskning på problemet med menneskelig oppmerksomhet og dets rolle i prosessen med informasjonsoppfatning. Er det mulig å drive med webdesign uten å vite noe om disse studiene? Det er mulig, men mest sannsynlig vil det være tull. Derfor er det bedre å sette seg inn i hvordan oppfatningen av hjernen vår fungerer.


Slik kan du grafisk forestille deg Usability-metoden

Sheep"R"Us / Flickr

Menneskelig oppfatning er helhetlig og udelelig. Det er hovedsakelig begrenset av fysiologiske egenskaper, men psykologer identifiserer også trekk ved oppmerksomhet. Det er oppmerksomhet som velger en del av den fra miljøet, som er gjenstand for videre bearbeiding av hjernen. Denne seleksjonen er ikke vilkårlig - den er satt av stimuli som er signifikant for den oppfattende personligheten. En person kan rett og slett ikke håndtere flere oppmerksomhetsobjekter samtidig og samtidig opprettholde et gitt effektivitetsnivå. Dette betyr at menneskelig oppmerksomhet er begrenset, så grensesnittskapere må bli veiledet av noen grunnleggende regler for psykologien til informasjonsoppfatning.

Brukervennlighet og UX

La oss først se på det generelle standard prinsipper grensesnittdesign. En viktig faktor i utvikling av webdesign er å ta hensyn til forskning på psykologien til informasjonsoppfatning. Dette gjøres delvis ved hjelp av metoder Brukervennlighet(brukervennlighet) og Brukererfaring, eller UX ( Brukererfaring).

Vi må identifisere de mest karakteristiske egenskapene til UX og deres innhold. Men først må vi skille begrepene Brukervennlighet Og Brukererfaring og korrelere informasjonen mottatt med data om psykologien til hypertekstpersepsjon.

Brukervennlighet oftere brukes til å øke kjennskapen til og brukervennligheten til grensesnittet, øke hastigheten på oppgavefullføring, etc. Med andre ord, brukervennlighetsmetoden starter fra spørsmålet: "Hvor enkelt er det for brukeren å løse problemet?" Og hans hovedmålet- hold klienten på nettstedet eller applikasjonen.

Målet med den andre metoden, UX, er bredere enn enkel funksjonalitet. Den dekker aspekter som enkel oppfatning, kundeinvolvering og interessant bruk. Når du lager grensesnitt bruker UX-spesialister affektiv designtilnærming- dette betyr at de lager design ikke for brukere, men for folk som opplever følelser.

Produkter som spill eller sosiale medier, er rettet mot å fremkalle en viss følelse hos brukeren og gi ham glede. I dette tilfellet er grensesnittets bekvemmelighet ikke lenger nok, det må ha en viss estetisk verdi. UX-metoden søker å fremkalle positive følelser hos brukeren. Det er derfor, for bedre å forstå fagets visuelle preferanser, er det nødvendig å bruke forskningsdata fra persepsjonspsykologien.


Slik vil UX-metoden se ut

Takk for at du besøkte siden min / Flickr

For klarhetens skyld, la oss sammenligne disse to metodene ved å bruke eksemplet med å velge en rute: hva er forskjellen mellom å kjøre langs en betongmotorvei (brukervennlighet) og å kjøre langs en svingete fjellvei (brukeropplevelse, UX)? Å komme til målet ditt langs motorveien, du, uten å gjøre noe ekstra innsats, kjør maksimalt på rett vei angi hastighet. Brukervennlighet oppnår samme effekt - å veilede brukeren til det endelige målet på den enkleste og mest praktiske ruten. Men fjellveien er svingete, og det vil ta mer tid å overvinne den, men å kjøre langs den er mye mer interessant og hyggelig takket være naturen og fjelluften. Konseptet brukeropplevelse tar hensyn til akkurat de faktorene som kan gi glede.

Emosjonelt grensesnitt

Etter å ha forstått hvordan brukeropplevelse skiller seg fra brukervennlighet, la oss gå tilbake til psykologi og gå til grunnleggende prinsipper oppfatning av informasjon som følger med opprettelsen av et affektivt påvirkende grensesnitt .

Basert på resultatene av et eksperiment av Thomas Sanocki og Noah Sulman på identifiserende Forbindelser mellom kompatibiliteten til farger og evnen til folk til å huske det de nettopp så, kan flere nyttige konklusjoner trekkes for å lage det ideelle nettstedet:

  • prøv å ikke bruke mer enn tre farger;
  • skape kontrast mellom bakgrunnen og den oppfattede informasjonen;
  • bruk harmoniske kombinasjoner av nyanser.

Alle disse bestemmelsene kommer fra psykologien til oppfatning av farge, metning, form, volum, etc. Farge påvirker den menneskelige underbevisstheten, forårsaker visse assosiasjoner og følelser. Den berømte sveitsiske psykologen Max Lüscher studerte fargens følelsesmessige innvirkning på mennesker. Han avslørte at preferansen for visse farger gjenspeiler motivets orientering, humøret og eksisterende personlighetstrekk. Som et resultat utviklet Lüscher fargetesten, som er et av hovedverktøyene for å vurdere en persons tilstand. Forskning på formoppfatning viser at avrundede, glatte linjer er forbundet med sikkerhet og skarpe hjørner og brutte linjer oppfattes som en manifestasjon av aggresjon og forårsaker angst. Å kjenne egenskapene til menneskelig oppfatning vil hjelpe designeren til å lage et produkt som vil fremkalle positive følelser.

En annen måte å vise tekstinformasjon på er typografi. Eksperimentelle studier viste at det er nødvendig å fylle grensesnittet med en font som er kjent og forståelig for øyet, ta hensyn til kompatibiliteten til de forskjellige typene med hverandre, og også opprettholde nødvendig avstand mellom avsnittene.

Brukervennlig grensesnitt

For å forenkle oppfatningen av brukerinformasjon, det vil si for å sikre den funksjonelle siden av grensesnittet (dets brukervennlighet, som vi husker), bør vi referere til funnene fra følgende psykologiske eksperimenter.

Basert på teorien til Richard Gregory, er vår visuelle oppfatning av informasjon basert på at vi gjør visse antakelser om det vi ser basert på tidligere erfaring, vår kunnskap om emnet. For å lage arbeidsgrensesnitt vil følgende hjelpe oss:

  • støtte data med passende design;
  • "snakker" overskrift for å skape sentrale brukerforventninger;
  • ledsagende visuell informasjon med meningsfull tekst.

Vi må ikke glemme effekten av binokulær rivalisering, på grunn av hvilken vi ikke er i stand til å oppfatte en kombinasjon av forskjellige bilder samtidig. La oss legge til dette resultatene av en studie av oppfatningen av essensen av det holistiske bildet av et bilde avhengig av farge og dermed få følgende anbefalinger:

  • ikke overbelast grensesnittet med uviktig informasjon og ordne innholdet i riktig rekkefølge;
  • bruk tematiske, passende ikoner til å følge teksten;
  • fremhev viktig informasjon blant teksten.

Dermed bestemmer brukervennlighet den funksjonelle siden av interaksjon i menneske-teknologi-paret, og UX-forskning er rettet mot å analysere brukersiden av denne interaksjonen og skape innstillinger for en spesifikk følelse hos brukeren.

Victoria Baskakova

Anastasia Marincheva

Castelhano M.S., Mack M.L., Henderson J.M. Visningsoppgave påvirker øyebevegelseskontroll under aktiv sceneoppfatning //Journal of Vision. – 2009. – V. 9, 3. – S. 6-6.

Gregory R.L. Kunnskap om persepsjon og illusjon //Philosophical Transactions of the Royal Society B: Biological Sciences. – 1997. – V. 352, 1358. – S. 1121-1127.

Hassenzahl M., Diefenbach S., Göritz A. Behov, påvirkning og interaktive produkter – aspekter ved brukeropplevelse //Interaksjon med datamaskiner. – 2010. – V. 22, 5. – S. 353-362.

Hassenzahl M., Tractinsky N. Brukererfaring forskningsagenda //Atferd og informasjonsteknologi. – 2006. – V. 25, 2. – S. 91–97.

Larson K., Picard R. Lesingens estetikk //Vises i Human-Computer Interaction Consortium Conference, Snow Mountain Ranch, Fraser, Colorado. – 2005.

Saariluoma P., Jokinen J.P.P. Emosjonelle dimensjoner ved brukeropplevelse: en brukerpsykologisk analyse //International Journal of Human-Computer Interaction. – 2014. – V. 30, 4. – S. 303-320.

Sanocki T., Sulman N. Fargeharmoni øker kapasiteten til visuelt korttidsminne //Journal of Vision. – 2009. – V. 9, 8. – S. 322-322.

Tong F. et al. Binokulær rivalisering og visuell bevissthet i menneskelig ekstrastriate cortex // Neuron. – 1998. – V. 21, 4. – S. 753-759.


Og i dag vil vi berøre de psykologiske aspektene som påvirker brukerens brukervennlighet av nettstedet.

Ugly Duckling syndrom

Som praksis viser, er de aller fleste brukere sterkt knyttet til den første versjonen av utformingen av et bestemt prosjekt. Dette designet har blitt studert av dem i størst mulig grad. Følgelig oppfatter de påfølgende versjoner av nettstedet (eller lokale elementer), etter redesignet, gjennom prisme av hvordan en ny versjon lik den forrige. Dette er grunnen til at besøkende føler seg malplassert i begynnelsen.

Bannerblindhet

Essensen av bannerblindhet er at besøkende ignorerer alt som minner dem om reklame. Samtidig har de utviklet en tydelig algoritme for å surfe på siden, takket være hvilken brukere fokuserer på de blokkene der informasjonen som er mest nyttig for dem befinner seg. Derfor blir enorme bannere med fargerikt innhold i dette aspektet fullstendig ignorert.

Usikkerhetseffekten (Bluma Zeigarnik-effekten)

Av natur er mennesker intolerante overfor usikkerhet. Takket være henne prøver vi å finne svar på alle spørsmålene som dukker opp i hodet vårt. Samtidig så raskt som mulig.

Usikkerhetseffekten er basert nettopp på dette trekket ved menneskelig atferd. Oppdaget tilbake i 1927, etablerer effekten en form for følelsesmessig forbindelse med brukeren, leseren eller observatøren av produktet.

Basert på dette, videoer, ulike artikler, annet materiale som bruker dette prinsippet, har som regel noe underdrivelse og har en tendens til å stille spørsmål til brukeren i stedet for å svare på dem. Som et resultat blir folk som ser materialet oppfordret til å se etter svar og blir tvunget til å gjøre noe (for eksempel klikke på en lenke eller lese tilleggsmateriell).

Gestaltprinsipper

De representerer de grunnleggende, grunnleggende reglene for psykologi i sammenheng med design og menneskelig oppfatning gjennom en datamaskin.

Lov om nærhet sier at et sett med objekter er plassert mer enn hverandre fra hverandre nært hold enn andre objekter, klassifiserer brukeren dem som en gruppe.

Det er også lov om likhet, som kan formuleres som følger: en person grupperer ubevisst lignende objekter.

Pragmatismens lov sier - ett og samme element er i stand til å spille veldig viktig rolle i én visuell representasjon, og bli en del bakgrunnsbilde i en annen.

Et veldig tydelig eksempel på denne regelen er Macintosh-logoen, som inneholder flere visuelle felt. En ting til felles med et smilende ansikt, samt et glad ansikt presentert i profil.

Generelt sett er det symmetriske arrangementet av elementer, innrykk, etc. gjøre nettstedet ditt mer ryddig. Samtidig kan et brudd på symmetri forårsake en reaksjon hos en person - "noe er galt her."

Lov om nedleggelse indikerer at en person er tilbøyelig til å kombinere objekter som i virkeligheten ikke er en enkelt helhet.

Et eksempel er IBM-logoen, hvor det i realiteten bare er horisontale linjer, som varierer i lengde. Men mennesket tolker dem til bokstaver.

Effekt personlig erfaring . Fikk størst distribusjon innen skaperverket tekstinnhold på grunn av at den er i stand til å etablere en slags relasjon mellom leseren og forfatteren.

Produkttilfredshet er definert som "komfort og akseptabel bruk." Å bestemme tilfredshet er ganske vanskelig, siden det først og fremst er en følelsesmessig komponent. Følgende estimater ble introdusert:

  • Vurdering på en nytteskala for et produkt eller en tjeneste.

  • Vurdering på en skala for tilfredshet med funksjonaliteten til produktet.

  • Antall ganger brukeren følte seg sint eller misfornøyd med produktet.

  • Vurdering på skalaen av teknologisk effektivitet av oppgavehåndtering uten brukermedvirkning.

  • Vurdere hvor godt den teknologiske utførelsen av en oppgave møter brukerens behov.
Dermed brukes kriteriene ovenfor for å analysere brukervennligheten til et produkt eller programvare. De brukes til å analysere resultatene av brukervennlighetstesting og brukervennlighetsundersøkelse.

Brukervennlighetsregler og prinsipper

Det er flere grunnleggende regler og prinsipper for brukervennlighet, som du bør være oppmerksom på når du utvikler et nettsteddesign eller endrer strukturen.

Hovedpunkter som skal sjekkes for sånn som det er nå er følgende:


  • riktig visning av nettstedet i forskjellige nettlesereulike innstillinger skjerm;

  • relevans nøkkelinformasjon og informasjon om spesialtilbud;

  • enkel navigering på nettstedet;

  • enkel søking og bestilling av varer (tjenester).

  • grad av brukertilfredshet ved bruk av nettstedet ( brukervennlighetstesting med involvering av brukere fra målgruppe nettstedet)
Nettstedets brukervennlighetsanalyse er direkte relatert til scenen markedsrevisjon "Nettanalyse". Informasjonen innhentet som et resultat av brukervennlighetstesting brukes til å lage en fullstendig beskrivelse av nettstedets publikum og tjener til å utvikle anbefalinger for å forbedre effektiviteten av brukerinteraksjon med Internett-prosjektet.

Grunnleggende regler og prinsipperbrukervennlighet ble publisert i Smashing Magazine, 31. oktober 2007.

Følgende er et utdrag fra artikkelen:
"En profesjonell nettutvikler bør være den besøkendes advokat, beskytte interessene hans og sikre at uansett kompleksiteten til nettstedet, vil brukeren alltid kunne finne det han trenger. For å utføre disse oppgavene på en vellykket måte, må du være i stand til å effektivt forsvare dine ideer og løsninger i diskusjoner med kunder og kolleger. Din jobb er å korrigere dårlige ideer og feil konsepter, ikke blindt følge dem.

Selvfølgelig er en dyp forståelse av de grunnleggende prinsippene for brukervennlighet viktig for dette, men for å referere til dem i en diskusjon er det like viktig å vite hva disse begrepene kalles. Dessuten kan det å bruke presise definisjoner hjelpe deg med å forsvare synspunktet ditt i en diskusjon."

^ Regel 7±2

Hjernens informasjonsbehandlingsevner er ikke ubegrensede, ifølge forskning utført av George Miller korttidshukommelse kan samtidig inneholde fra 5 til 9 enheter. Dette faktum brukes ofte for å rettferdiggjøre behovet for å redusere antall elementer i navigasjonsmenyer til 7, som forårsaker het debatt, siden det ikke er helt klart hvordan denne regelen skal brukes på nettet. [ Millers studier ]

2 sekunders regel

Poenget er at brukeren ikke skal vente mer enn 2 sekunder på noen systemreaksjon, for eksempel å starte eller bytte en applikasjon. Verdien på 2 sekunder er vilkårlig, men virker passende nok. Generelt, jo mindre brukeren venter, jo bedre.

^ 3-klikks regel

En bruker vil ikke være fornøyd med å bruke et nettsted hvis han ikke finner informasjonen han trenger med tre klikk. Denne regelen understreker med andre ord viktigheten av klar og enkel navigering. I mange tilfeller er det ikke så mye antall påkrevde klikk som er viktig, men den generelle forståelsen av systemet; selv 10 klikk er ikke et problem hvis brukeren på hvert trinn tydelig forstår hvor han er og hvor han bør flytte neste gang .

^ 80/20-regel (Pareto-prinsippet)

Tanken er at 80 % av effekten kommer fra 20 % av handlingene. I virksomheten brukes denne regelen ofte i formen: "80 % av salget kommer fra 20 % av kundene." I webdesign og brukervennlighet fungerer denne regelen ikke mindre effektivt. For eksempel kan du forbedre effekten av et nettsted betydelig ved å identifisere 20 % av brukere, kunder, handlinger, produkter eller prosesser som genererer 80 % av overskuddet og være spesielt oppmerksom på dem under utviklingen.

^ Åtte gylne regler for frontend-utviklere

Som et resultat av sin forskning på menneske-datamaskin-interaksjon, kompilerte Ben Shneiderman et sett med regler som kan brukes til å designe mange typer grensesnitt. Disse prinsippene er relevante for både grensesnittutviklere og webdesignere.


  1. Streb etter logikk

  2. For avanserte brukere bør det være rask måte(forkortelser, hurtigtaster, makroer)

  3. Det skal være informative tilbakemeldinger

  4. Dialogen skal fullføres

  5. Feilhåndtering skal være enkel

  6. Det må være en enkel måte å angre handlinger på

  7. Brukeren skal føle at alt er under hans kontroll

  8. Hold korttidshukommelsen så lav som mulig
Passer regel

Publisert av Paul Fitts i 1954, en modell for menneskelig bevegelse kvantifiserer tiden som kreves for å raskt flytte til et målområde som en funksjon av avstand til mål og målstørrelse. Vanligvis brukes denne regelen når du vurderer musebevegelse fra punkt A til punkt B. Dette kan være viktig når du plasserer elementer som du ønsker å øke antall klikk på.

^ Omvendt pyramide

Den omvendte pyramiden er en skrivestil der hovedideen presenteres i begynnelsen av artikkelen. Artikkelen begynner med en konklusjon, etterfulgt av viktige punkter, og ender med den minst viktige informasjonen. Brukere ønsker å motta informasjon så raskt som mulig, så den omvendte pyramiden er perfekt for nettet. Brukervennlighetsguru Jakob Nielsen deler samme oppfatning. .

Tilfredshet

Brukere velger ikke den optimale banen når de søker nødvendig informasjon. De trenger ikke den beste og mest pålitelige løsningen, tvert imot er de ofte klare til å være fornøyd med en rask og ikke den beste løsningen som vil være "ganske akseptabel". I forhold til nettet beskrives tilfredshet nøyaktig av denne saken: brukeren fikk en "helt akseptabel" løsning på problemet - selv om alternative løsninger mer fullstendig dekke sine langsiktige behov.

^ Psykologi i brukervennlighet

Baby-and-syndrom

Brukere blir vanligvis knyttet til det første designet de lærer og bedømmer andre basert på hvor like de er det. Som et resultat foretrekker brukere systemer som ligner de de kjenner og ikke er veldig glad i andre. Dette problemet oppstår ofte under redesign, brukere som er vant til forrige versjon design, i ny struktur nettstedet føles ukomfortabelt.

^ Bannerblindhet

Brukere ignorerer alt som ser ut som reklame, og interessant nok gjør de det ganske effektivt. Selv om folk legger merke til annonsen, henne fortsatt alltid ignorert. Brukere har utviklet ganske klare mønstre som de følger når de utfører oppgaver på nettet. ulike handlinger: Når de søker etter informasjonen de trenger, fokuserer de på delene av siden der informasjonen kan finnes – brødteksten og hyperkoblinger. Store, fargerike, animerte bannere blir fullstendig ignorert i dette tilfellet.


^

Usikkerhetseffekten (Zeigarnik-effekten)


Mennesker kan ikke tolerere usikkerhet – vi prøver å finne svar på spørsmål som dukker opp så raskt som mulig. Usikkerhetseffekten er basert nettopp på dette trekket ved menneskelig atferd. Videoer, artikler og historier som bruker effekten av usikkerhet slutter vanligvis plutselig, uten å løse seg vanskelig situasjon og ikke svare på spørsmål som dukker opp. Denne effekten brukes ofte i reklame: ved å stille besøkende interessante og provoserende spørsmål, tvinger annonsører dem ofte til å lese materialet eller klikke på en lenke.

Oppdaget av Bluma Zeigarnik i 1927, bidrar effekten til å etablere en følelsesmessig forbindelse med leseren og er utrolig effektiv i markedsføring. Leserne vil bedre huske hva annonsen handlet om, og til og med små deler vil bli husket tydeligere og mer nøyaktig. Zeigarnik-effekten brukes også når du skriver tekster for nettet for å tiltrekke og interessere besøkende.
^

Gestaltprinsipper for formoppfatning


Dette er grunnleggende regler for menneskelig psykologi i sammenheng med design av grensesnitt mellom mennesker og datamaskiner.

^ Lov om nærhet sier at når vi ser en samling av objekter, gjenkjenner vi objektene som er nærmere hverandre som en gruppe.

Et ekte eksempel på loven om nærhet fra MTV Music Awards 2002.
^ Lov om likhet sier at en person ubevisst grupperer lignende objekter.

Loven om Prägnanz sier at samme objekt kan spille en viktig rolle i ett synsfelt og være en del av bakgrunnen i et annet.

I Macintosh-logoen kan du se både et normalt glad ansikt og et glad ansikt i profilen.
^ Symmetriloven sier at vi har en tendens til å oppfatte symmetriske objekter som et enkelt objekt.

Lov om nedleggelse sier at folk har en tendens til å kombinere objekter som faktisk ikke er forent.

^

Selvreferanseeffekten


Denne effekten er spesielt viktig når du lager tekster for nettet, da den kan forbedre forbindelsen mellom forfatter og leser betraktelig. Ting relatert til vår egen erfaring, husker vi bedre enn de som ikke er knyttet til oss. For eksempel, etter å ha lest en artikkel, husker folk bedre karakterer, historier eller fakta som de på en eller annen måte var knyttet til.

Fra forfatteren: I dag har vi et veldig viktig tema - prinsippene og reglene for nettstedets brukervennlighet. Det er skrevet mange bøker og artikler om dette. Menneskehetens største hjerner har utviklet sine egne formler for brukervennligheten til et nettsted. Det ser ut til, hvordan kan du glede alle Internett-brukere, fordi de er så forskjellige? Men som forskning viser, er det visse mønstre for brukeratferd på nettstedet som må tas i betraktning når du utvikler det. Selvfølgelig, hvis formålet med ressursen er å tiltrekke trafikk og tjene penger, og ikke å skremme med sure farger, blinkende bannere (eller enda bedre, med lyd) og mystisk navigasjon.

Prinsipper for brukervennlighet av grensesnitt

Mest hovedprinsipp, som skal gå som en rød tråd gjennom hele grensesnittet, høres slik ut: "jo enklere jo bedre." Dens betydning er at bruken standard teknikker websidedesign gjør livet mye enklere for brukeren.

Tross alt, hvis han allerede har sett lignende navigasjon et sted, plasseringen av knapper og menyelementer, vil han vite hvordan han bruker alt. Dette betyr at de vil føle seg trygge på nettstedet ditt. For enkelhets skyld delte jeg de gjenværende prinsippene for brukervennlighet på nettsider i flere semantiske grupper.

Prinsipp 1: Navigering. Horisontal og vertikal meny.

Grunnlaget for nettstedets brukervennlighet er praktisk og tydelig navigering. I horisontal meny Det bør være hovedseksjoner, og flere i den vertikale seksjonen. I I det siste Stadig oftere kommer jeg over nettsteder uten vertikal meny, altså forenklet til det ytterste. Men dette avhenger av egenskapene til ressursen og innholdet som er lagt ut på den.

JavaScript. Rask start

Hvis du, etter å ha blitt kvitt den vertikale menyen, ender opp med en kompleks og forvirrende horisontal, er det bedre å avstå fra denne teknikken. I tillegg er det fornuftig å duplisere hovedmenyen i bunnteksten. Hvis nettstedet ditt har kompleks struktur, gjør det for henne egen side, hvor i form av et tre, intuitivt klar liste vise en liste over alle kategorier og underkategorier.

Prinsipp 2: Ingen feil.

Tester og tester igjen. Hver dag. Ingen helger eller helligdager. Siden må fungere riktig, fordi hvert sekund av feil drift, hver lenke som fører til ingensteds, eller en knapp på ikke-eksisterende side vil koste deg besøkende og kunder. Ingen vil dvele på en ikke-fungerende side. Og ikke glem å designe 404-siden i stil med nettressursen din.

Prinsipp 3. Riktig utforming av sidehodet.

Det er på toppen av siden folk bruker blikket oftere og lenger. Noen mennesker er til og med for late til å rulle nedover siden. Jeg innrømmer at jeg også tilhører denne gruppen brukere. Hvis overskriften ikke inneholder informasjonen jeg trenger (meny, kontaktinformasjon, telefonnumre osv.), er det usannsynlig at jeg kaster bort tid på å lete etter den. Generelt forstår du - i overskriften plasserer vi alle dataene som vi ønsker å trekke kundenes oppmerksomhet til, først av alt.

Prinsipp 4. Ledig plass.

Du har sikkert kommet over nettsteder der hver ekstra centimeter ble "plugget" med noe - en slags bannere, ikoner, knapper, animasjoner. Kjedelig tekst, en haug unødvendig informasjon, brrrr. Slike nettsteder bør brenne i et spesielt helvete for de som ikke kjenner prinsippene for brukervennlighet og persepsjonspsykologien.

Ekte webdesignmestere vil alltid forlate ledig plass, og teksten vil bli formatert med normal linjeavstand for å gjøre det lettere for brukeren å puste og at informasjonen skal oppfattes lett og tilgjengelig.

Prinsipp 5. Kvalitetstekst.

Kvaliteten på teksten inkluderer ikke bare dens semantiske komponenten og fraværet av feil, men også riktig formatering. Om linjeavstand Jeg har allerede nevnt, det gjenstår å snakke om teknikker som kan tiltrekke mer oppmerksomhet til innholdet ditt. Dette:

tilstedeværelse av overskrifter og underoverskrifter;

tildeling søkeord Og viktig informasjon (med fet skrift, fotnoter, markører, etc.);

JavaScript. Rask start

Utforske Grunnleggende om JavaScriptpraktisk eksempel på å lage en nettapplikasjon

bruk av nummererte og punktlister;

dele teksten inn i avsnitt bestående av 3-4 setninger.

Prinsipp 6. Nettstedsøk.

Det ser ut til at det allerede er klart at en nettressurs bør ha et internt søk. Men nei - ganske ofte er det nettsteder som det ikke er antydning til dette vesentlig element brukervennlighet. Men de fleste brukere kommer til et nettsted med et klart mål: å finne litt informasjon raskt.

Etter å ha gjort søkelinje og filter, vil du gjøre både deg selv og potensielle kunder fornøyde. De vil finne det de trenger, du vil øke konverteringen din og kanskje få en vanlig kunde.

Prinsipp 7. Lastehastighet.

Fortsetter det tidligere kravet til nettstedets brukervennlighet - folk er veldig utålmodige, de kommer til Internett for informasjon og ønsker å få det så raskt som mulig. I følge undersøkelser fra Nielsen Norman Group bruker brukere i gjennomsnitt 27 sekunder på en nettside og ruller sjelden til slutten. Dette skjer fordi det er mye søppel og ubrukelig informasjon på Internett - hvis folk studerte hver ressurs i detalj, ville de blitt gale.

Derfor har du bare noen få sekunder til å fortelle besøkende om deg selv, interessere ham og oppmuntre ham til det ytterligere handlinger. Og hvis mesteparten av denne tiden som er tildelt deg tas opp ved å laste inn siden, er det ingen sjanse for å tiltrekke seg potensiell kunde du har praktisk talt ingenting igjen - det vil ganske enkelt gå til et annet nettsted. Dette spørsmålet, hvordan tiltrekke og beholde en besøkende, er hva brukervennlighet handler om.

Om brukervennlighet" url="http://marketnotes.ru/about-usability/usability-principls/">

Når jeg leste om heuristiske metoder for å vurdere design og brukervennlighet, la jeg merke til at alle refererer til noen allment aksepterte brukervennlighetsprinsipper, men ingen skriver hvilke. Det er to alternativer: enten er de så klare og naturlige at de ikke engang er verdt å snakke om, eller så vet ingen egentlig hva disse prinsippene er. Etter å ha analysert artiklene som lenker til dem, og rett og slett tenkt på begge deler søkemotorer, Jeg kom til en skuffende konklusjon: ingen vet egentlig noe, og alle artiklene er unøyaktige kopier av en av Jacob Nelsons artikler. Noen la til og med igjen en lenke til disse mest allment aksepterte prinsippene.

Akk, jeg fant ikke en eneste artikkel på russisk (eller ukrainsk) hvor de ble avslørt. Derfor bestemte jeg meg for at det var verdt å oversette og tyde de samme prinsippene litt.

Så, 10 generelt aksepterte brukervennlighetsprinsipper. La oss se på dem mer detaljert.

1. Synlighet av systemstatus.

Dette prinsippet betyr at brukeren ALLTID skal vite hva som skjer og hvor langs stien han stoppet. Hvis dette er en kompleks registrering, angi at dette er trinn 2 av 3. Hvis noe blir lastet ned eller noe skript kjører, vis % behandlet. Etc.

Et enkelt eksempel - jeg er sikker på at alle har støtt på en situasjon der du klikket på et ikon, men ingenting skjedde. Etter hvor aktivt skruen snurrer og monitoren blinker, er det fortsatt noe som skjer, og etter noen minutter åpnes for eksempel et programvindu (jeg åpner fortsatt IE på denne måten). Hva du skal gjøre på Internett når alt er lastet ikke på datamaskinen din, men på en server i et annet land. De fleste brukere klikker ganske enkelt på "send"-knappen flere ganger, laster opp de samme filene flere ganger osv. Og alt fordi det ikke er noen forbindelse mellom brukeren og systemet.

Det bør utvises forsiktighet for å sikre at systemet alltid klart og entydig reagerer på brukerhandlinger. Det er et slikt øyeblikk - det bør gå maksimalt 1 sekund mellom handling og reaksjon - dette er ikke et innfall av brukervennlighetseksperter. Det er vitenskapelig funnet at dette er nettopp det tidspunktet hjernen vår opprettholder et årsak-og-virkning-forhold, slik som ferdig-mottatt. Hvis reaksjonen på handlingen din skjer senere enn et sekund senere, oppfatter hjernen den som en separat handling, bare fjernt relatert til den forrige.

Og ett grensetall til - 10 sekunder. Brukeren må få det han vil ha innen 10 sekunder etter handlingen (for eksempel, mens han så søkeresultatene, åpnet brukeren vindu 5. Deretter ser han raskt gjennom hver av dem. Hvis han ikke gjorde det etter at han åpnet vinduet innen 10 sekunder gå tilbake dit - betrakt det som tapt for deg).

(Jeg har ikke sjekket tallene selv eller funnet opp, de er hentet fra en bok).

(dette er et eksempel fra Contact. Når du laster opp bilder ser du prosessen og anslår hvor mye tid som er igjen å vente).

Det neste prinsippet forteller oss at nettstedet ditt skal være laget for et spesifikt publikum, og du bør kommunisere med dem på deres språk, ved å bruke deres betegnelser og beredskapsnivå.

For bare et par dager siden så jeg på to nettsteder dataemner med en ganske lik struktur og design. MEN! En var dedikert til konfigurasjonsfunksjoner operativsystem, og andre - datakurs for nybegynnere.
Som du forstår, er dette to helt forskjellige målgrupper, og uttrykket "klikk linje 35 i registeret" vil være mer enn forståelig for publikum på det første nettstedet, men vil sjokkere 99% av brukerne av det andre nettstedet.

Ta derfor alltid hensyn til publikummet ditt og lag alltid en nettside for dem. Dette gjelder ikke bare tekster, men også struktur, assistanse, design, visuell oppfatning informasjon osv.

(det er tydelig ved første øyekast hvem informasjonen på denne siden er rettet mot. En nybegynner vil ikke engang lese hva som står der. Bare ved designet er det tydelig at det er for programmerere).

3. Brukerkontroll (valgfrihet)

Brukeren skal alltid ha kontroll over situasjonen, for å si det sånn, ha fingeren på pulsen (eller i det minste skal han ha et slikt inntrykk). Hva betyr dette i praksis? For eksempel, når du fyller ut et skjema, må det være en "tøm skjema"-knapp. Hvis skjemaet inneholder flere trinn, må brukeren gå tilbake til forrige trinn, eller omvendt, hvis mulig, hoppe over noen for å gå tilbake til det senere.

Denne situasjonen vil gi brukeren inntrykk av at det er han som er "ansvarlig"; ingen prøver å lure eller forvirre ham. Og komplikasjonen ved første øyekast av grensesnittet når riktig tilnærming vil bli en forenkling. Tross alt er det mye lettere for folk å gjøre 2-3 enkle trinn enn en kompleks (saken her er at mens brukeren fyller ut det andre trinnet, tror han fortsatt at han kan avbryte det første, men tenker allerede på det tredje).

(når du oppretter et prosjekt i Seolib, ser du hvilket stadium du er på, hvor mye som er igjen. Du kan også gå tilbake til forrige trinn, eller gå videre ved å hoppe over dette).

4. Konsistens og standarder.

Et annet prinsipp som virker åpenbart, men dessverre så sjeldent blir brukt i praksis. Fortell meg, du kan enkelt bruke hvilket som helst grensesnitt Office-program Microsoft kan lage nytt dokument? Lagre det? Sentre tekst? Men dette er ikke alltid så enkle operasjoner...

Saken er at Microsoft-kampanjen følger dette prinsippet i produktene sine (selv om det ofte bryter med mange andre). I alle produktene deres er de samme ikonene på de samme stedene og ser like ut.

Internett har allerede visse etablerte betegnelser og standarder (for eksempel typen vogn, kontakter i øverste hjørne etc.). Men hvis du ser på hvor mye forskjellige typer kurver (ved hjelp av Yandex eller Google-bilder), vil du forstå det avansert bruker kan for alvor gå seg vill blant alle disse vognene, elektroniske kurver, ultramoterike vesker, etc.).
Når det gjelder konsistens, etter å ha valgt en bestemt stil, følg den overalt. Dette gjelder fonter, bilder, tekst og layout.

Jeg har sett mange ganger hvordan produktoppsettet og sideoppsettet var forskjellig ulike seksjoner. Nettstedets skapere anser dette som en "kreativ funksjon". Hvis de gjør det for seg selv, kan du la det være slik, men hvis du gjør det for brukeren, hvordan skal du forklare ham hvorfor utformingen av siden når du velger en skriver skal være så forskjellig fra designet på valgsiden tilfeldig tilgangsminne(i samme butikk)?

(som du kan se i dette eksemplet, er alle ikonene nøyaktig like i Word, Excel og PP. Nytt produkt Microsoft-selskap, vil minst halvparten av funksjonene være umiddelbart klare for deg).

5. Forebygging av feil.

Dette prinsippet sier at det er lettere å forhindre en feil enn å rette den. Uansett hvor du kan forenkle valget og fjerne unødvendige, tilfeldige handlinger, bør du fjerne dem.
I praksis kan dette være: et hint når du skriver inn noe fra tastaturet (for eksempel by/land).

Dette gjelder også for knapper. ACCEPT gjøres for eksempel vanligvis større og lysere enn Clear Form. Hvis du vet noe om informasjonen som legges inn, spør brukeren (telefonformat eller regionskode) osv.

(V i dette tilfellet, kan brukeren ikke gå lenger før han forstår disse innstillingene og velger minst ett alternativ for å analysere nettstedet. Dette er mye mer praktisk enn å fortelle brukeren noe sånt som "velg minst ett alternativ, eller parametrene er satt feil.)

Forenkle brukerens liv så mye som mulig, gi ham hint, husk informasjonen han skrev inn tidligere (ikke bare på forrige side, men også fra hans tidligere besøk på nettstedet).
For eksempel, hvis du igjen har et flertrinns registreringsskjema, vis ham feltene som allerede er fylt ut hvis de kan være nødvendige i fremtiden.

Prøv også å minimere antall tekstfelt der brukeren må skrive inn noe selv. Gi ham alternativer (hint) slik at han kan velge blant de allerede tilgjengelige alternativene.

(et regionhint dukker opp når du skriver inn minst én bokstav. Og hvis brukeren ikke vet hvordan han staver byen riktig, klikker han ganske enkelt på et av de foreslåtte alternativene).

7. Fleksibilitet og effektivitet ved bruk.

En av de mest store problemer– hvordan kombinere enkelheten til grensesnittet og funksjonaliteten? Hvordan gjøre det samme grensesnittet klart og praktisk for både en profesjonell bruker og en nybegynner?

Dette prinsippet sier at grensesnittet skal være fleksibelt, tilpassbart og skreddersydd for publikum som råder. Fokuser på enkelhet med tanke på enkel bruker. Elementer for avanserte brukere kan gjøres mye mindre og plasseres i mindre merkbare deler av skjermen, pga han vil finne dem overalt.

Et slående eksempel er Site Map. Enig at en nybegynner ikke vil gå dit i det hele tatt, men en erfaren bruker vil finne dette "nettstedskartet" med liten skrift nederst på skjermen, eller et lite ikon et sted på siden.
Et annet eksempel er klikkere/typer. De. Hver side kan nås enten fra menyen ved å klikke på navigasjonen, eller ved å søke på nettstedet. Begge alternativene bør støttes og til slutt føre til samme resultat.

(vi ser et enkelt søk for de fleste brukere, samt et avansert for avanserte. Samtidig er de avanserte søkefunksjonene skjult ganske langt og kun en erfaren bruker kan finne dem, dvs. faktisk bare den ene hvem trenger det).

8. Estetisk og minimalistisk design

Dette prinsippet sier at grensesnittet ikke skal inneholde informasjon som brukeren ikke trenger eller som han i sjeldne tilfeller kan ha behov for. Tilsvarende i skjemaer: du bør ikke spørre brukeren om informasjon som du ikke trenger, eller trenger i enkelte unntakstilfeller.

Dessverre er det nesten ingen som bruker dette prinsippet. I 90 % av tilfellene ved registrering blir du spurt og hjemmetelefon, og mobil, og adresse og e-post, og til og med fødselsdato. Og alt for å gratulere deg med det nye året og bursdagen.

Du kan avklare all tilleggsinformasjon senere om nødvendig. Og først, når du registrerer deg, for eksempel, eller når du legger inn en bestilling, ber du bare om den informasjonen du virkelig trenger.

På samme måte, på et nettsted (eller i et program, er disse prinsippene universelle), bør du ikke vise til brukeren informasjon som han en dag kan trenge. La oss for eksempel ta det samme Microsoft Word. Fortell meg, hvor ofte bruker du "navigator"-funksjonen eller dato-tidsinnlegget? Og likevel er disse knappene alltid synlige i verktøylinjen (avhengig av versjonen kan knappene være forskjellige, men jeg er sikker på at hvis du ser på dem, vil du finne minst 40 % av ikonene du ALDRI har brukt , og vet ikke engang hva de lager).

(her er et typisk eksempel. Ved registrering spurte Ozon meg om både for- og etternavn. Samtidig er det eneste stedet hvor navnet mitt brukes, overskriften på bokstaven. Jeg har aldri sett etternavnet mitt brukt på alle. Og spørsmålet er - hvorfor trenger de disse dataene? Det er tross alt et kallenavn Det vil si at formen lett kan halveres...).

9. Hjelp brukeren å forstå og rette feilen.

Fortell meg hva databasefeilen på linje 433 betyr? Eller lange skumle feil i minnelinjen LXR-XXX-5438645?
Alle disse systemmeldinger må lagres i logger for nettstedet/systemadministratoren. Skriv til brukeren på vanlig språk hva feilen er. Dessuten er brukeren i hovedsak bare interessert i én ting: er det hans feil eller systemet? Og er det noe som kan gjøres?

Jeg er sikker på at du har støtt på situasjonen der du fyller ut et skjema, klikker på send, og som svar får du en slags databasefeil. Og du sitter og lider av to hovedspørsmål: hvem har skylden og hva skal du gjøre? Er skjemaet borte? Hvis ja, er dette all informasjonen? Eller prøve å sende på nytt?

Selv om de fortsatt er sånn alvorlige feil blir stadig mer sjeldne. Men det andre alternativet er enda mer irriterende - du fyller ut et ganske langt skjema, klikker på send og ser en rød inskripsjon (eller popup-vindu) - fyll nøye ut alle feltene merket med en stjerne.
Og igjen sitter du og tenker – hvilke felt? Hvilken stjerne? Det virker som jeg har fylt ut alt, sett nøye igjennom... og så viser det seg at telefonnummeret skal stå der med mellomrom, ikke bindestrek.