Bekvämt och intuitivt gränssnitt. Artyom, du håller med om att det intuitiva gränssnittet bara är på bröstvårtor, alla andra behöver studera

Facebook.

Gränssnittet är en speciell programvara som utför den grafiska utgångsfunktionen och låter dig utbyta data mellan en användare och en dator eller annan teknisk enhet.

Vad är gränssnittet?

Det enklaste exemplet på gränssnittet är fjärrkontrollen. Detta tekniska medel hjälper till att interagera och "kommunicera" TV och man. Andra exempel kan betjäna instrumentpaneler i bilen, hävstångar i planet etc. Trots den ganska omfattande sfären, när du ställer in problemet: "Vad är gränssnittet?" I de flesta fall har människor föreningar med datorer, mobiltelefoner och andra tekniska anordningar av denna typ.

Gränssnittet är en kombination av olika element som själva kan också ha en komplex multi-level-struktur. Visningsskärmen innehåller till exempel fönster som består av vissa paneler, knappar, etc. Den huvudsakliga egenskaperna för programvara och hårdvara är effektiviteten och enkelheten av användningen. Baserat på detta är gränssnittet ofta placerat som ett bekvämt, vänligt, förståeligt, intuitivt, etc.

Huvudkomponenter

För att förstå vad som är ett gränssnitt, måste du ta itu med sina huvudelement. Deras uppsättning beror på vad personen använder. Om detta är till exempel ett datorprogram, innehåller det en mängd olika virtuella paneler, knappar, fönster och andra liknande komponenter. Dessutom kan gränssnittet vara interaktivt, det vill säga att påverka en person med en mängd olika ljud, signaler, glödlampor, vibrationromotorer etc. som för användaren direkt kan det interagera med gränssnittet som det kan med olika switchar, hävstångar, knappar eller till och med vissa gester och röstkommandon.

Konceptkonstruktion

Mycket ofta under gränssnittet förstår utseendet på programmet. Det här är inte så fallet, eftersom det förutom visuella egenskaper, innehåller detta tekniska koncept en uppsättning ytterligare funktioner och element. Nedan är några av dem:

Informationsteknik.
Datautgångsmetod.
Användarens uppgifter.
Olika objekt som låter dig hantera programmet.
Respons.
Navigeringselement mellan olika strukturer och komponenter i programmet.
Team Graphic Display betyder.

Väsentliga element

I de flesta fall består standardgränssnittet för den tekniska enheten av följande element:

Knapp. Kanske dual, flagga, etc.
Ikon eller ikon.
Normal eller hierarkisk lista.
Redigeringsfält.
Menyn som kan vara huvud, sammanhang och fallande.
Olika paneler.
Flikar, etiketter och popup-tips.
Windows, i synnerhet dialoger.
Scroll Bar, Slider, etc.

Ytterligare element

Förutom de ovanstående grundläggande komponenterna kan gränssnittet också ha ytterligare föremål som inte används i alla tekniska anordningar.

Nivåindikator. Gör att du kan spåra ett visst värde.
Sekventiella uppsättning element.
Olika räknare.
Visar information ovanpå alla andra komponenter.
Dolda gränssnittselement som försvinner när de inte används, etc.

Klassificering

När det gäller typologi, beroende på vissa kriterier, skilja mellan olika typer av gränssnitt. Samtidigt varierar och förbättras nästan varje år och förbättras. Nedan är de vanligaste typerna.

Command Interface.Detta tekniska verktyg är baserat på införandet av vissa kommandon och deras sekvenser. Ett speciellt fönster visas på enhetsskärmen, där användaren går in i ett visst kommando och får motsvarande resultat. Denna typ av gränssnitt är mindre bekvämt för en vanlig användare, eftersom det kräver kunskap om kommandon och processen för deras inmatning.
Gränssnittsmeny.I det här fallet visas exempel på kommandon och en meny med specifika åtgärder på skärmen Teknisk enhet. För att välja önskat kommando, ta bara markören till en viss symbol och bekräfta dina handlingar. För närvarande är det det mest populära sättet att kommunicera mellan datorn och användaren. Denna typ av gränssnitt kräver ingen särskild kunskap, och även ett barn kan fungera på ett liknande sätt.
Talgränssnitt.Gör att du kan byta mellan kommandon och vissa åtgärder genom röstinstruktioner. Den mest praktiska och lovande typen av datakommunikation och användare. För närvarande finns det fortfarande en liten prompt, närvarande främst i dyra tekniska enheter.

Användargränssnitt

Detta koncept innehåller en integrerad uppsättning element som användaren ser på skärmen och med vilken den interagerar med datorn. Från hur långt det är lämpligt för användning beror resultatet av mänsklig aktivitet. Baserat på detta, är alla världsföretag som är engagerade i datateknik, särskilt uppmärksamhet, inte bara för behandling av program, men också att optimera behoven hos specifika användargrupper. Designers, artister och jämn psykologer arbetar på gränssnittsenheten, och det utvecklas med hänsyn till de speciella kraven för människor, fysiska möjligheter, deras hälsa och så vidare.

Begreppet ett parallellt och seriellt gränssnitt

För datorer och andra liknande anordningar spelas en viktig roll av uppgiften för dataöverföring i ett visst belopp. För att överföra data till bitargruppen finns det två metoder för konstruktionen och organisationen av gränssnittet:

Parallell gränssnitt. I denna utföringsform används din egen signallinje för varje bit från gruppen, och de överförs alla tillsammans vid en angiven. Som ett exempel kan du ringa skrivarens anslutningsport.
Seriellt gränssnitt. I det här fallet används endast en signallinje, och bitarna njuter av sig i sin tur, var och en av dem ges en viss tid. Ett exempel är en seriell USB-buss.

Var och en av ovanstående gränssnittstyper har sina fördelar och nackdelar. Trots det faktum att användningen av ett parallellt alternativ är en enklare och snabb lösning, kräver det en stor mängd ledningar och kablar. Sändningsgränssnittets sändningslinjer har en mer komplex struktur, men det är mycket billigare. Följaktligen, om linjen behöver sträckas under ett långt avstånd, är det mycket lönsamt att dra kabeln av seriell gränssnitt än flera parallella ledningar.

Istället för förskola

Gränssniktet utför således rollen som en mellanhand mellan en dator eller annan teknisk enhet och användare. När det gäller hur mycket det är bekvämt och lätt att använda beror kvaliteten på arbetet med denna utrustning. För att äntligen förstår vad som är gränssnittet bör det också undersökas genom klassificering, grundläggande begrepp och grundläggande komponenter. Med varje år kommer gränssnitten för olika tekniska anordningar att förbättras, tillvägagångssättet till deras struktur och grundläggande funktioner förändras.

Publiceringsdatum: 05/12/2008

Människor använder många olika enheter och system för att utföra sitt arbete. Efter utseendet på datorer, mest av tiden ägnar vi interaktion med programgränssnitt. Och en dag uppfanns termen "intuitivt gränssnitt" ...

Men vad man ska ringa ordet "intuitivt"? De flesta gränssnitt är byggda på metaforer, d.v.s. På användningen av redan bekanta föremål och tekniker. Det är av den anledningen att ikonerna är drogs liknar riktiga föremål. Men metaforerna är inte alltid och långt ifrån alla begrepp kan användas. Låt oss säga att magnifierarens bild kan innebära både sökfunktionen och förhandsgranskningsfunktionen före utskrift. Och i fallet när det inte finns någon lämplig metafor eller det är tvetydigt, eller använd kryckor i form av popup-tips, eller uppfinna nya bilder i den verkliga världen.

Så snart som något nytt och okänt förekommer, försvinner all intuitivitet - krävs träning Och så visas en sådan sak som träningskurva Direkt relaterad till gränssnittets kvalitet. Det mer komplexa gränssnittet, ju längre det är att behärska det och de mindre människorna kommer att komma till mållinjen, vilket innebär att många kommer att dömas att ineffektivt använda programmet.

Men vad ska vara ett komplext eller enkelt gränssnitt? Svaret är långt ifrån så enkelt och beror på komplexiteten hos den uppgift som löses. Gränssnittet, först och främst, bör vara tillräckligt till uppgiften! Problem uppstår vid det ögonblicket när vi antingen för att komplicera uppgiften, eller för att förenkla. Komplikationen hittas vanligtvis mycket oftare.

Oavsett hur smart du är, men om du inte har kunskap inom ett visst område, låt oss säga i organisk kemi, är programmet för att dra kemiska formler osannolikt att det verkar intuitiva. Och här närmar vi en mycket viktig konsekvens - gränssnittet ska hjälpa till att använda kunskap, men inte att ersätta dem.

Varje program är utformat för att lösa en specifik uppgift och förutsätter att användaren har vissa färdigheter. Under den här funktionen kan du allokera professionella och konventionella program. Gränssnittet är först, vanligtvis ganska komplicerat och involverar speciell preliminär utbildning. Sådana program inkluderar: Adobe Photoshop, Autodesk AutoCAD, olika språk och programmeringsmiljöer. Uppgifterna är löst komplex och därför är gränssnittet för sådana program också komplicerat, men att vara en gång behärskar det börjar med professionell Dina utdelningar genom att accelerera arbete.

Å andra sidan finns det mycket mer generella klasser, som innebär inte några speciella krav för användaren. Sådana program använder oftast uttrycket "intuitivt förståeligt gränssnitt" i deras beskrivning. Och i själva verket är allt mycket värre och det användarvänliga gränssnittet betalas betydligt mindre än i professionella program. Uttryck "Användaren gör inga speciella krav" bör uppfattas som det faktum att varje mjukvaruproducent i sin tolkning av användarens grundläggande färdigheter.

Konceptet om bekvämligheten av gränssnittet, faktumet att använda knappar, dropplistor, kryssrutor och andra element i det grafiska gränssnittet i operativsystemet är mycket ofta. Alla program är utformade för att utföra en helt specifik uppgift, så innan den är nödvändig för att utforma gränssnittet, måste den här uppgiften bestämma och inse. Men trots allt löses samma uppgift av olika människor på ett helt annat sätt - beroende på deras kunskapsnivå.

Säg att du kan göra nästan perfekt kodning i MP3-format, med många olika tekniska inställningar som presenteras i codec, men i 95% av fallen behöver du användare koka bara det här ljudet I normal kvalitet. Och allt de behöver för detta - bara ett program med en stor "Skapa MP3-fil" -knapp. Men innebär det att ett sådant program inte är lämpligt för professionell användning? Nej, bara ett gränssnitt bör vara så att dölja en onödig komplexitet. Om du tar ovanstående exempel med kodning till MP3, är lösningen på denna uppgift anmärkningsvärt implementerad med användning av profilmekanismsom innehåller optimala inställningar för en eller annan kodningskvalitet. Och att det här programmet blir mer professionellt är det tillräckligt att ge en mekanism för redigering av dessa profiler.

Problemet med att skapa gränssnittsprogrammerare är att de huvudsakligen styrs till deras kunskapsnivå och färdigheter. Men trots allt är programmeraren inte en genomsnittlig användare av programmet och nivån på kunskapen är mycket mer. Dessutom är vissa som till synes triviala handlingar inte alls för alla andra. Av denna anledning, när man utvecklar program, är det nödvändigt att involvera "vanliga användare" för att testa dem och noggrant titta på hur och vad de gör. För att lösa problemet med att skapa ett bekvämt gränssnitt, fördelar stora företag många miljoner dollar och någon, riktigt framgångsrik, lösningen som hittats snabbt kopieras snabbt av alla.

Gränssnittet är en viss "bro" mellan användaren och systemet. Med hjälp av gränssnittet kommer användaren att kunna förklara systemet, som han vill ha av det, och systemet kommer att utföra. Men vad händer om denna förståelse mellan bilen och mannen inte kommer att uppnås? Användaren kommer bara att gå från webbplatsen. Så här beter sig internetanvändare från online-marknadsföringsinstitut:
- 85% kan komma bort från webbplatsen om de inte gillar gränssnittsdesignen;
- 83% kommer att lämna platsen om de är tvungna att göra många klick för att hitta vad de behöver;
- 40% kommer aldrig att återvända till webbplatsen om det var svårt för dem att använda den för första gången.

Principerna för gott gränssnitt är desamma för webbplatser och för program och för tjänster. Jag samlade 17 stora (såväl som i slutet kommer du att vänta på en liten översikt över metoderna för att testa ett gränssnitt till användbarhet).

Från artikeln lär du dig:

Ett bra gränssnitt ska:

1. Att vara intuitiv.

Användargränssnittet är det som borde vara den mest förståeliga majoriteten av människor. Om en person, öppnar applikationen eller går till webbplatsen, förstår inte hur du använder den, då när du pinner i flera sekunder för olika knappar, kommer det att bli besviken och lämna resursen. Mest sannolikt för alltid.

Ett intuitivt gränssnitt är det där:
1) Alla element är byggda på principerna för elementär logik.
Ta till exempel webbplatsen med textinnehåll (artiklar). Dess logiska gränssnitt blir så här:
- Webbplatsnamnet ligger högst upp på sidan, under det - en kort beskrivning av resursen;
- Menyn är belägen under sektionen.
- Blockera med kontakter och feedback på den översta delen av menyn;
- Artiklar är ordnade för att lägga till dem på webbplatsen.
- I slutet av varje artikel finns knapparna "Nästa" och "tidigare";
- Kategori Knappar bör alltid komma ihåg så att du kan gå till ett annat avsnitt när som helst.
- Platsregler, detaljerad kontaktinformation, data om utvecklare etc. Beläget i sidfoten, eftersom det alltid är där och letar efter.

Förvirra inte användaren med den vanliga platsen för de vanliga blocken och använda beprövade principer. Heidi Cohen Marketer Blog är strukturerad och logisk:

Här är ett exempel från programgränssnittet. Även där märken inte är undertecknade är det helt klart att de kan betyda. Knappar finns i logikens ordning - trots allt är det klart att efter att knappen "paus" ska följa "Stop" -knappen etc.

2) Knapparna är tilldelade för begripliga beteckningar.
Undvik knappar, den bild som kan vara vilseledande användaren. Inget behov av att återuppfinna cykeln. Ett stort frågetecken berättar omedelbart användaren om att han gömmer någon vägledning eller hjälp. Förstoringsglas är alltid en sökform på webbplatsen.

Men vad skulle du tänka när du ser på webbplatsen eller i programknappen, till exempel med en korsad kvadrat? Mest sannolikt kommer många användare inte ens att riskera att pressa det, eftersom det kommer att bli oförståeligt för vad denna åtgärd kommer att leda till.

Och för en ännu bättre förståelse för användarna av sina handlingar kan du använda signaturerna till knapparna. De visas när de svävar markören.

3) Det finns hjälpanvändare om han "gick vilse".
Om användaren kom till 404-sidan, ge honom omedelbart en kort instruktion som han kan göra nästa. Till exempel, uppmanar det att återgå till föregående avsnitt och söka efter nödvändig information där.

Eller en sådan situation. Du har en webbutik. Om det är fel att ange varans parametrar, ser användaren ett meddelande med ett fel. Skriv omedelbart att han ska göra för att beskriva varorna korrekt. Om de önskade varorna inte visade sig vara i lager - skriv om hur användaren kan få ett meddelande om utseendet på denna produkt.

Och ett visuellt exempel:

2. Var förutsägbar.

I andra situationer kan förutsägbarhet vara en tråkig och ointressant egenskap, men inte bara om gränssnittet. Användaren, som tittar på detta eller det elementet i gränssnittet, bör omedelbart förstå hur han beter sig vid interaktion. Om objektet ser ut som en meny, ska det uppträda som en meny, om den ser ut som en skjutreglage, måste det följaktligen flyttas. Kreativitet av tänkande är naturligtvis bra, men inte i det här fallet.

Exempel på utformningen av spelarens programgränssnitt. De övre knapparna ("Föregående" - "Spela" - "Nästa") måste utföra dessa funktioner, och skjutreglaget ändrar volymen.

Några fler exempel. Om du gör de volymetriska knapparna, kommer de att se mer ut som knappar, så du kommer att bli mer benägna att klicka på dem:

Och på / av-brytaren söker när det är gjort så här:

En av de största rädslorna för designers är att de kommer att betraktas som icke-original. Och därför undviker de ofta användningen av den tekniker som länge har testats för effektivitet och arbete, för att skapa ett "något nytt och kreativt". Att göra öppna plagat, förstås inte. Men att använda gränssnittskonstruktionsmodellerna är redan bekanta med användarna ett säkert sätt att göra det förutsägbart. Vilka resurser använder din målgrupp? Facebook, LiveJournal, Twitter, Amazon, YouTube? Använd en liknande stil och i ditt gränssnitt så att de kan känna sig i den vanliga inställningen. Till exempel, om du fokuserar på YouTube, gör huvudmenyn vertikal och placera den till vänster på sidan och placera söksträngen i mitten ovanifrån.

3. Att vara minimalistisk.

I ett försök att placera i gränssnittet som många kategorier, menyer, knappar, etc., kommer du bara att tillämpa stor skada. För rörligt gränssnitt är ett stort hinder för hans förståelse av användaren. Allt som kan beskrivas med en fras bör inte beskrivas i tre. Extra element och underkategorier på huvudsidan, för ingenting. Bestämma vilken "extra", och vad nej, testar testning dig (om hur det kan hållas i slutet av artikeln). Men det är inte värt att offra något väldigt viktigt - om du vet det utan någon förklaring (Prompts kommer att vara mer nedan) Eller en extra knapp till användaren är svår att räkna ut den, lägg den i gränssnittet, men gör det maximalt loacing.

Söt, men samtidigt ganska kortfattat designgränssnittsapplikation. Det finns inget överflödigt och förvirrande - bara det nödvändiga och i fallet.

4. Ladda snabbt.

Den långsamma nedladdningen av gränssnittet kommer att vara irriterande och repelleras av användaren, vilket leder till den ökande fientligheten mot resursen. Kontrollera att nedladdningshastigheten är optimal för sin bekväma användning. I stor utsträckning beror det till föregående stycke - trots allt, desto mindre på platsen för de "tunga" elementen, desto snabbare kommer det att laddas.

För att snabbt göra din webbplats, använd dessa tips: 8 sätt.

5. Visa alla viktiga alternativ.

Använd rullgardinsmenyn och menyerna är bättre bara där det är omöjligt att undvika. I andra fall, försök omedelbart visa användaren alla dess kapacitet. Om en del av den möjliga åtgärden är dold kan användaren inte gissas, där han behöver klicka för att göra en viss åtgärd. Och om dessa åtgärder är riktade ("Köp varor", "gör en order"), kan de inte döljas i rullgardinsmenyn, men tvärtom göra en speciell accent på dem.

Ett exempel på hur rullgardinsmenyn kan ha rätt till liv. Underdelningarna i menysektionerna är öppna när du svänger markören, och det är ganska bekvämt. Men till exempel är knappen "Kontakter" synlig omedelbart, utan ytterligare vägledning.

Knappar för önskade användaråtgärder måste fördelas mot andra bakgrund. Här är knappen "Lägg till i varukorgen".

6. För att kunna kommunicera med användaren.

Det är att användaren måste förstå vad dess åtgärd för närvarande behandlas av systemet. Processen att skicka meddelandet måste åtföljas av utmatningen på skärmfrasen "Meddelande skickat", och slutet av denna process - "Meddelande skickat". Om ett system misslyckas, måste användaren också bli underrättad om detta, liksom orsakerna till felet och vad det kan göra i den här situationen. Om resursen förutsätter att du laddar stora mängder information, måste du placera framstegsstänger så att användaren kan övervaka systemets tillstånd.

För experimentet nedan fyllde jag bara två första registreringsformulär grafer, lämnade en tom linje med ett e-postmeddelande och specifikt inmatat fel lösenord. Systemet angivna omedelbart fel (markerat i rött). Så här ska något bra gränssnitt bete sig.

7. Har olika stilar för knappar med olika typer av åtgärder.

I alla gränssnitt har varje knapp sitt eget syfte: Gå någonstans, öppna menyn, öppna i ett nytt fönster, ladda ner och så vidare. För att inte förvirra användare, följa sådana regler:

1) Klickbara och icke-klientelement måste vara annorlunda. Den kan separeras med färg, teckensnitt, storlek. Användaren ska omedelbart se vilka knappar den kan klicka och gå någonstans, och som helt enkelt är närvarande för information.
2) Välj menydelen med färg eller stil, där användaren är placerad för närvarande.

På den här sidan är det omedelbart klart att vi är i avsnittet "Tjänster" och det är belysat i rött. Återgå till punkt 5, jag noterar att målåtgärden är ett köp, så "Köp" -knappen är markerad mot resten av resten och är volymetrisk.

8. Var attraktiv.

Funktionalitet och bekvämlighet är bra, men det finns också en elementär "vacker / inte vacker." Alla användare kommer att bli mycket trevligare för att hantera gränssnittet, som till allt är nöjd med ögat.

Men glöm inte att den vackra designen är en subjektiv sak. Gör det lika vackert för alla du inte kommer att fungera, oavsett hur svårt du försökte. En är överens om att när du utvecklar en resurs för gymnasieelever och resurs för revisorer, måste du ta olika designlösningar. Därför fokuserar först och främst på din målgrupp och dess behov.

Enligt min åsikt är dessa exempel attraktiva. I det första fallet var de ursprungligen gjorda ikonerna och volymen av bilden mest nöjda, i den andra - färglösningen och placeringen av elementen.

9. Ge möjlighet att anpassa.

Anpassning är förmågan att ställa upp något "för dig själv." Oftast finns den här funktionen i program, tjänster och applikationer. Användaren kan exempelvis förändras, färgen på teckensnittet, ikonens stil, bakgrundsbilden, textblockets storlek som han gillar det (väljer från de föreslagna alternativen, naturligt).

I Trello-tjänsten kan du ändra bakgrunden till en annan färg eller bild.

Men det gör det möjligt för dig att anpassa ditt Twitter-konto:

10. Att vara lojal mot användarfel.

Och ändå kommer användarna alltid att vara som inte kommer att kunna förstå omedelbart en eller annan när du arbetar med gränssnittet. De kommer att göra felaktiga handlingar, och då är uppgiften att göra uppgiften framför gränssnittet så att dessa fel snabbt kan korrigeras. Om användaren av misstag raderade den information du behöver, ska den vara försedd med återställningen. Den användare som vandrade inte till sidan borde snabbt kunna återvända till föregående sida eller avsnitt genom att trycka på "Back" -knappen. För att förhindra felaktiga åtgärder, bör gränssnittet fråga användaren om han verkligen vill göra det. Till exempel, "När du stänger den aktuella sidan, kommer filbelastningen att avbrytas. Vill du verkligen göra det? ". Men överdriv inte det med sådana frågor, annars börjar det irriterande.

Två exempel från applikationer: När du tar bort eller spara data frågar systemet om du verkligen vill göra det här. Tilldela gränssnittet av detta slag är bättre i det fall då användaren vill göra en åtgärd som kan innebära irreversibla konsekvenser (ta bort uppgiften - i det första exemplet), eller om det är möjligt meningslöst handling (spara en grupp utan deltagare - på det andra exemplet).

11. Prata på användarens språk.

Hela texten i gränssnittet måste alla beteckningar skapas för resursens målgrupp. Allt är uppenbart här: Om du gör en träningsplats för förskolebarn, måste gränssnittets text skrivas på "Barnens" -språket. Om du har ett program för avancerade webbansvariga kan du säkert använda specifika villkor utan förklaring - målgruppen och så känner de dem. Och om det här är en tjänst för nybörjare, måste språket vara så enkelt som möjligt.

12. Ange det optimala antalet urvalsalternativ.

De mer åtgärdsalternativ du erbjuder användaren, desto mindre sannolikt kommer han att begå någon av dem. Om det finns många alternativ, och det är omöjligt att skära dem (till exempel produktkatalogen), använd sedan rekommendationsfunktionen. Till exempel erbjuder du på en sida tio versioner av varorna, men en eller två markerar "Vi rekommenderar" kategorin. Klienten kommer att uppmärksamma dessa varor som kan lindra honom ett val.

Detta kan också implementeras med hjälp av "Sales Hits" -blocket, som visas i exemplet.

13. Ge mjuka tips.

Popup-tips är mycket bra. De hjälper användaren att förstå vad han inte kunde räkna ut sig själv. Huvudfrågan är fortfarande hur man gör sådana uppmaningar effektiv och icke-ansträngning. Kom ihåg assistentpappersklämmorna från tidiga versioner av Microsoft Word? Företaget inaktiverade den här funktionen eftersom det orsakade många negativa känslor från användare och kritiserades.

Så att användarna är lojala mot anvisningarna, följ dessa stunder:
- Skriv inte för mycket text i dem;
- Anslut inte uppmaningar till varje knapp och begränsa endast de där användaren verkligen kan ha svårigheter.
- Låt användaren stänga snabb eller helt inaktivera den snabba funktionen.

14. Dämpa bakgrunden under modala fönster.

Modalfönstret blockerar användarens arbete tills det stänger det här fönstret eller gör inga åtgärder i den. Det här fönstret måste på något sätt allokera i den övergripande bilden. Det är bäst att göra detta genom att dämpa bakgrunden, som är under den. Ju mörkare det kommer att bli en bakgrund, desto starkare betoning på modalfönstret kommer att göras, och användaren kommer att förstå att han behöver göra några åtgärder i den.

På vissa platser träffade jag att bakgrunden under modalfönstret blev helt mörkt och inte läsbart. Det här är bara ett exempel på den felaktiga användbarheten, eftersom du har alls på någon annan sida. Exemplen nedan visar hur du kan välja det modala fönstret, ringa bakgrunden, men lämna den samtidigt läsbar.

15. Har korta former av registrering.

Gör en användare att registrera är en viktig och en av de mest komplexa uppgifterna i gränssnittet. Vanligtvis försöker människor att undvika register där de inte kommer att gå in regelbundet, eller ännu inte säker på det. Och ofta vägrar även att köpa i nätbutiken, om det kräver en obligatorisk registrering och gå för att leta efter dina varor på andra webbplatser. Så att användarna inte har upplevt motvilja för registreringsprocessen är det nödvändigt att göra det så snabbt som möjligt och enkelt. Använd inte långa former av registrering, där du behöver ange all din biografi. Begränsa endast de mest nödvändiga raderna:

Och om du fortfarande av någon anledning är tvungen att erbjuda användarna en lång form med en mängd påfyllningspunkter, bryt den sedan i separata delar.

Titta på exemplet. Formuläret till vänster visar omedelbart alla linjer som fyller och ser därför besvärligt ut. Jag vill inte fylla en sådan form. Och i form av rätten kan det finnas exakt samma antal frågor, men de är uppdelade i "steg", därför orsakar inte irritation.

16. Har enkla principer att fylla i fälten.

Nästan varje webbplats erbjuder användare att fylla något på det. Förutom att registrera på webbplatsen kan det vara beställningsformuläret för varorna, vänligen lämna dina kontaktuppgifter eller skicka någon undersökning. Om du gör formen av fyllning för komplicerad eller ansträngning, kommer ingen att fylla den. Härifrån finns det flera viktiga tips:

1. När den fylls med olika fält ("City", "Street", "födelsedatum"), skulle det vara trevligt att ge uppmaningar till användaren med en rullgardinsmeny (nedrullningsmeny) så att han inte behöver komma in Allt manuellt, men bara välj önskat alternativ från listan.

2. Om användaren fortfarande behöver manuellt ange data, använd sedan linjen för att kontrollera systemet för att fylla i formuläret. Det kommer inte att tycka om någon om systemet efter varje fyllningsfel kommer att återställa alla rader som är fyllda tidigare.

3. Namnen på fälten är bättre placerade ovanför de inmatade raderna. Detta beror på mänsklig visuell uppfattning. Det är lättare för en person att uppleva information från topp till botten eller botten överst, än vänster till höger eller vice versa.

4. Ta bort sannolikheten för felaktig fyllning som möjligt.
Föreställ dig situationen. Du börjar ange ditt telefonnummer i fältet. Efter den första fyllningen säger systemet dig: "Telefonnumret måste anges i ett 10-siffrigt format." Du går in igen, och systemet ger dig: "Telefonnumret ska inte innehålla bindestreck." Och här börjar du vara nervös och mentalt förbannar den här webbplatsen (och kanske inte mentalt). Den ideala formen av ingång är när användaren kan skriva i det någonting, och systemet kommer inte att berätta för honom "fel". Naturligtvis kommer databehandling att vara något svårt, som en del av de önskemål du måste hantera manuellt. Men ditt huvudmål är att acceptera ordern, och inte att försegla otåliga kunder.

17. Ge alternativ för bekväm hantering.

Om vi \u200b\u200bhuvudsakligen använder musen på platserna (med undantag för standard "kopiera / klistra in", etc.), så i program och applikationer är det ofta lämpligt att styra tangentbordet. Låt förmågan välja vilken typ av kontroll som de kommer att tycka om och visa vilken funktion som nyckelkombinationen matchar.

Hur testa användargränssnittet?

Som lovat i början av artikeln kommer jag att berätta lite om att testa gränssnittet. Varför är det så viktigt?
- Först, när du utvecklar ett gränssnitt, kan fel blåsas i det som påverkar hela programmets arbete eller resurs.
- För det andra kommer du aldrig att kunna gissa med det optimala designgränssnittet, vilket är perfekt uppfattat av de flesta användare.
- Tredje kan gränssnittet normalt visas på en enhet (eller i webbläsaren) och inte helt kompatibel med den andra.

Testning kommer att kunna lösa alla dessa problem. Hur kan jag bära ut det?

1. Manuellt.

För att genomföra sådan testning kommer det att ta många tillfälliga och fysiska resurser, eftersom hela processen kommer att förvaras av en person. Men i denna och plus manuell testning. För dess genomförande behövs en testare, vilket gradvis kommer att kontrollera hur systemet svarar på en viss användaråtgärd. Det är lämpligt att göra ett speciellt bord som alla data kommer att göras. Till exempel är detta:

2. Automatiserad metod.

Denna testmetod utförs med hjälp av speciell programvara, som, som om det efterliknar en levande persons handlingar under manuell provning. För sådan testning krävs inte mänskligt deltagande, så hastigheten på utförandet ökar, och kostnaden för kontantkostnader minskas. Det finns en stor "men". Automatiserad testning kan inte ge 100% datorer, eftersom den endast utförs av formella funktioner (de som driver in i programmet) och ger inte förmågan att hitta defekter av användbarhet, vilket endast kan uppfattas av en person (till exempel , Färgområde av gränssnitt).

3. Använd fokusgrupper.

Enligt min mening är den bästa testmetoden när det gäller priseffektivitetsförhållande. Det utförs enligt följande:
- Flera fokusgrupper som består av dina målanvändare rekryteras. Du kan dela grupper av olika funktioner: registrerade / oregistrerade, permanenta / sällsynta användare, liksom av olika demografiska indikatorer (som passar in i din CA);
- Varje grupp tillhandahåller uppgifter för att göra vissa åtgärder på din webbplats / service / program. Du måste säga ämnet att de måste göra, men säg inte hur. Detta är kärnan i testningen - att se, med vilka åtgärder som användare kommer att uppnå sitt mål.
- Efter allt detta analyserar du exakt hur ämnena utförde sina uppgifter - där de pressades, med vilka länkar de gick, oavsett om de önskade, etc. hittades.

Det finns speciella tjänster som du enkelt kan hitta personer att utföra sådan testning. Till exempel, Askusers, Wois Test, Usabilla.

Visuellt exempel på användargränssnittstestning

Användare som inte använder Yelp lockas till test användbarhet. De fick vissa uppgifter (till exempel reservera ett bord i en restaurang, välj ett hotell för övernattning när de reser, etc.), varefter deras handlingar analyserades. Här är några testresultat:

1. Som det förtydligades föredrar användarna ofta att använda sökfunktionen för att hitta sin institution och inte leta efter det i kategorier. Därför bestämdes det att söka på nyckelfunktionen på sidan. Av den här sidan:

Det visade sig detta:

2. Undersökningen av testanvändare har visat att nästan var och en av dem anser att sidopanelen på tjänsten är mycket fylld och obekväma för användning. Ursprungligen var sidan så här:

Men layouten på den nya sidan:

Se den fullständiga versionen av resultaten av detta test.

Sammanfattningsvis.

När du utvecklar ett gränssnitt, kom ihåg att överdriven uppmärksamhet på en egenskap kan skada den andra. Ta bort några element, som försöker uppnå minimalism, kan du skapa problem med användargränssnittsförståelsen. Förbättra egenskapen hos en attraktiv design riskerar du omarrangemang och gör gränssnittet för tungt för snabb nedladdning. Därför är det viktigaste (och svåraste) i all denna historia att följa den perfekta balansen mellan alla egenskaper hos gränssnittet, och då kommer det att bli verkligt användarvänligt.

Hur interagerar en person med en dator, smartphone och annan processortekniker? I den här vanliga användarna hjälper gränssnittet.

Ofta kan du höra eller läsa uttrycken: "förståeligt gränssnitt", "komplext gränssnitt", etc. Låt oss räkna ut det i betydelsen av detta ord och förstå, i vilka fall det används.

Ord "gränssnitt" lånas från engelska, där bokstavligen betyder "Mellan personer". Används i värden: "interaktion, separation, utseende." I den moderna IT-sfären kallas gränssnittet Unified Communication Systems, som ger informationsutbyte mellan olika föremål.

Detta koncept används oftast i datateknik, men används ofta i andra tekniska områden, såväl som i ingenjörspsykologi, vilket innebär olika sätt att kommunicera mellan mannen och maskinen.

Gränssnittet är ett kommunikationssystem mellan olika noder och block av komplex utrustning, såväl som mellan teknik och användare. Det uttrycks i ett logiskt (informationspresentationssystem) och fysiska (egenskaper hos informationssignaler).

Således är logiskt datorgränssnitt komplexa matematiska system baserade på koncepten av mjölkalgebra, och fysiskt är det en kombination av chips och andra elektroniska delar, koppartrådar och elektriska strömpulser.

I allmänhet säkerställer datorgränssnittet datorns funktion - anslutningen av processorn med RAM, utskriftsenheter, etc., samt utbyte av information med andra datorer (på Internet) och med en person.

Grovt talande, utan gränssnitt, är operationen av datoranordningar helt enkelt omöjligt. Idag använder datatekniken olika typer av gränssnitt som är nödvändiga för programmets professionella arbete och att använda konventionella personer med datorer.

Det grafiska gränssnittet kallas en av typerna av ett anpassat datorgränssnitt, som istället för bokstäver och siffror använder grafiska bilder - ikoner, knappar, etc. Till exempel är Windows-operativbordet elementen i ett grafiskt gränssnitt som låter dig köra program med ett enkelt klick på musen.

Jämfört med att komma in i kommandon via kommandoraden är det grafiska gränssnittet betydligt enklare och förstått, och det är ofta nödvändigt att använda, de behöver inte särskild kunskap. Det kallas ofta vänligt och intuitivt.

En signifikant nackdel med det grafiska gränssnittet är en stor mängd minne som krävs för att representera datorkommandon i grafisk form. I tillfälliga datorsystem övervinns denna nackdel framgångsrikt, eftersom deras minnesvolymer har ökat varje par år.

Det grafiska gränssnittet är dock komplicerat varje år: det blir tredimensionellt, förvärvar nya former och uttrycksmetoder, blir bekvämare och spektakulära.

En kombination av programkontrollelement med vilka användaren utför olika åtgärder kallas programgränssnittet. Talar med enkla ord är programgränssnittet de knapparna och fönster som du använder för att säkerställa att programmet behöver de steg du behöver.

Så när du vill titta på en film ringer du ett Media Player-program, med hjälp av en speciell rad, ange önskad fil och börja visa genom att trycka på knappen på skärmen. Om du behöver ändra volymen, pausa displayen eller slå på krediterna, använder du media Player-gränssnittsfunktioner - knappar, motorer och fönster som är speciellt utformade för att styra.

Spelgränssnittet är möjligheten att hantera karaktären, samspelet mellan karaktärerna med varandra, kommunikation av spelarna bland dem, etc. Nästan alla spel har ett komplext gränssnitt som låter dig hantera tecken med olika sätt - mus, virtuella knappar på skärmen, etc.

De viktigaste åtgärderna i speltecken implementeras med standardmetoder, samma för alla spel. Ofta kan spelaren ändra gränssnittsinställningarna så att det är bekvämare och mer bekant. Samtidigt, med användning av pekskärmar, framträdde nya metoder för kontroll med fingrarna av fingrarna.

Jag är mycket intresserad av ämnet intuitivt gränssnitt i samband med hushåll och professionell förståelse. Jag samlar ens åsikter från olika designers på det här ämnet :)

Låt mig ta med några citat från min samling.

Viktor Papapaneck:
Design är medveten och intuitiv ansträngningar för att skapa en meningsfull ordning.

Ordet "intuitivt" Jag tyckte det var nödvändigt att lägga till min definition endast de senaste åren. Medvetandet innebär intellektualisering, hjärna, forskning och analys. I den ursprungliga definitionen fanns det inte tillräckligt med känslor / känslor av den kreativa processen. Tyvärr är intuition svår att bestämma som en process eller förmåga. Men dess inflytande på designen är väldigt viktigt. När allt kommer omkring, precis tack vare intuitiv insikt kan vi föreställa oss hur de intryck, idéer och tankar interagerar, som omärkligt ackumuleras på det undermedvetna, omedvetna eller preliminära nivåerna. Mekanismen för intuitiv reflektion i konstruktionen är svår att analysera, men kan förklaras av exemplet. Watson och Creek ansåg intuitivt att strukturen hos DNA-molekylen är mest elegant uttryckt av en spiral. Med detta intuitiva gissade började de sin forskning. Instinktiv proentering var motiverad: DNA - verkligen spiral!

Vlad Golovach:
Vlads åsikt kan läsas i min blogg
http://valiullin.livejournal.com/14635.html
Jag tog inte med det här eftersom det finns ett sammanhang.

Alan Cooper:
När objekt är formade, tydligen lämpliga för direkta manipuleringar med ben eller händer, förstår vi inte vad du borde göra med det. Förstå hur man hanterar verktyget, vars form motsvarar formen av den mänskliga handen är ett utmärkt exempel på intuitiv gränssnittsförståelse.

Jeff Raskin:
En av de mest lovande termerna som används i förhållande till gränssnitt är ordet "intuitivt". Vid närmare undersökning försvinner detta koncept så helt som en boll i frostare och ersätts av en enklare term "bekant".

När användarna säger att något gränssnitt är intuitivt, menar de att det fungerar såväl som någon annan metod eller ett program som de är bekanta med.

Nyligen hittade jag uttalandet av Li Bruce Edigiger (Bruce Edigiger), då Steve Jobs (författaren kunde inte bestämma):
Det enda "intuitiva" gränssnittet är nippeln. Efter att det är allt lärt sig.
Det intuitiva gränssnittet är bara vid bröstvårtorna. Alla andra behöver studeras (min gratis översättning).

Det verkar för mig att medvetenheten om det är begreppet ett intuitivt gränssnitt - en viktig omständighet för gränssnittsdesignern.

I detta avseende ville jag lära mig av dig Artem, vad tycker du om intuitiva gränssnitt?

Att döma med ditt svar, du är nära Alan Cooper. Men jag är närmare Jef Raskin med en liten bokning av Ediger-jobb, om nippeln.