Wat zijn UX en UI, en waarom zijn er geen UX-ontwerpers

De uitdrukking "UX / UI-ontwerper" is absurd. Gebruikerservaring (of UX) is net zo relevant voor ontwerp als contextuele marketing. Dat is contextueel adverteren is een van de vele marketingtools. En ontwerp, inclusief UI-ontwerp, is een van de vele factoren die de gebruikerservaring of UX vormgeven.

  • Wat is het verschil tussen UX en UI?
  • Wie is in feite een UX-ontwerper en waarom heeft hij geen Figma en Photoshop nodig?
  • Welke rol spelen een marketeer, manager en eigenaar van een onderneming bij het vormgeven van de gebruikerservaring?

Laten we bespreken.

Waarom UX / UI-ontwerpers niet gebeuren

Om deze vraag te beantwoorden, analyseer de concepten.

Wat is een gebruikersinterface of gebruikersinterface

UI of gebruikersinterface van de site (Eng. gebruikersinterface) - een verzameling elementen waarmee de bezoeker de webpagina gebruikt. Deze omvatten:

  • Menu.
  • Modale vensters.
  • Form.
  • Button.
  • Referenties.
  • Content.

Om een ​​gebruiker bijvoorbeeld een product aan het winkelwagentje toe te voegen, is er een knop 'Kopen' in de interface van de online winkel. Om ervoor te zorgen dat de bezoeker meer materiaal over het onderwerp te zien krijgt, zijn er ook de vakjes "Lees ook" in de interface van onze blog (zie hieronder).

Wat is UX of gebruikerservaring?

UX of gebruikerservaring - gebruikersperceptie en reactie op de interactie met de dienst, dienst of product. UX omvat emoties, verwachtingen, voorkeuren, persoonlijke percepties, fysieke, mentale en gedragsmatige reacties die vóór, tijdens en na de interactie plaatsvinden.

Deze definitie is een vertaling van ISO 9241-210: 2010 Ergonomie van interactie tussen mens en systeem.

Nu in eenvoudige woorden. Gebruikerservaring vorm niet alleen de elementen van de site. De UX-client van een online winkel wordt beïnvloed door:

  • Het assortiment.
  • Prijzen.
  • Beschikbaarheid van handige betaalmethoden.
  • Beschikbaarheid van handige bezorgmethoden.
  • Verzendkosten.
  • De kwaliteit van de goederen.
  • Verpakkingskwaliteit bij verzending.
  • De mogelijkheid om goederen te retourneren of te ruilen.
  • Stem van de operator van het callcenter.

De lijst is verre van compleet. Het laatste punt benadrukt dat niet alleen objectieve factoren UX beïnvloeden. Gebruikersperceptie, emoties, verwachtingen, voorkeuren, fysieke en mentale reacties zijn enkele van de subjectieve factoren die de gebruikerservaring bepalen.

Een eenvoudig voorbeeld in de illustratie toont de afstandelijkheid van UX om te ontwerpen.

Op de website van de online winkel kost het product 900 roebel, bovendien is het niet beschikbaar. In de groep van een privéverkoper in het netwerk "VKontakte" kost hetzelfde product 600 roebel. Aandacht, vraag: wat heeft de ontwerper ermee te maken?

Wie kan eigenlijk de ontwerper van UX worden genoemd

De ontwerper in de gebruikelijke betekenis van het woord heeft de UX niet volledig onder controle. Aanvullende kleuren zijn nutteloos als u een product van lage kwaliteit verkoopt. Met de hulp van "Photoshop" kan geen directe handen van de bezorgdienst werknemers trekken die slecht fragiele items verpakken. De ontwerper, zelfs als hij een UX-prefix op zijn badge heeft gekregen, kan de gebruikerservaring niet volledig vormen.

Dan Makoski, hoofd van het ontwerp bij Lloyds Banking Group, zegt dat UX-ontwerp niet bestaat. Ervaring is een subjectieve ervaring die de ontwerper niet kan beheersen. De specialist kan alleen de gebruikerservaring beïnvloeden.

Niettemin beïnvloedt de ontwerper via de interface en het visuele ontwerp van de site de gebruikerservaring. Andere professionals beïnvloeden ook de gebruikerservaring:

  • De auteur en redacteur helpen de bezoeker om de nodige informatie op de site te vinden.
  • Een webontwikkelaar verandert ontwerpopstellingen in live webpagina's.
  • De werknemer in de fabriek maakt een kwaliteitsproduct, waarvoor de gebruiker naar de site komt.
  • Een verkoopmanager helpt een klant precies te begrijpen welk product hij nodig heeft.

U kunt deze lijst alleen voortzetten, aangepast aan de omvang van de activiteiten van het bedrijf en de eigenaardigheden van het webproject.

Wie kan een designer of user experience designer worden genoemd? Wie plant, implementeert en controleert de interactie van klanten met het bedrijf? Wie kan de kromme handen van de verpakkers rechttrekken, de leveranciers van een karig assortiment wijzen, de goede manieren van de snappers uit het callcenter leren?

Afhankelijk van de schaal van de onderneming zijn dit topmanagers en -eigenaars.

De topmanager of de eigenaar van de onderneming is verantwoordelijk voor de gebruikerservaring of de ervaring van de interactie van de consument met het bedrijf. Zijn eerste assistent is een marketeer of hoofd marketing. Hier zijn de echte ontwerpers of ontwerpers van UX.

Hoe UI-ontwerp de gebruikerservaring verbetert

Hierboven staat dat de directe handen van packers, het goede hart van callcenter operators en het scherpe oog van de redacteur UX beïnvloeden. UI-ontwerp heeft ook invloed op de gebruikerservaring. De onderstaande voorbeelden bevestigen dit. Maar eerst moet je een ander patroon breken.

Het is een feit dat er geen universeel aanvaarde definitie is van het begrip en de verantwoordelijkheid van de webontwerper in het algemeen en de UI-ontwerper in het bijzonder. We hebben een webdesigner, ontwerpers van webpagina's. Deze experts ontwerpen de interface, maken een prototype en geven de lay-out aan de webontwikkelaar. Een webontwikkelaar implementeert ontwerp met behulp van HTML, CSS, JavaScript en andere hulpmiddelen.

In burzhunete webdesigner - een specialist die webpagina's ontwerpt en implementeert. Bekijk de cursus Responsive Web Design op freeCodeCamp. Dit zijn de basisprincipes van HTML en CSS. Dezelfde aanpak wordt gevolgd door de educatieve informatiebron 'Hekslet'. In de eerste les van de cursus over HTML en CSS, leggen leerkrachten uit waarom het beter is om webontwerpers te bellen die lopers in runet worden genoemd.

De tweede benadering is logischer, omdat de UX niet alleen wordt beïnvloed door het project van de webpagina als geheel en de webinterface in het bijzonder, maar ook door de juistheid van de implementatie van dit project. De onderstaande voorbeelden bevestigen dit.

Het alt-attribuut is van cruciaal belang voor de UX van mensen met een visuele beperking.

Dit is het meest triviale voorbeeld van hoe een gebruikersinterface de gebruikerservaring beïnvloedt. Wanneer een gewoon persoon op een landingspagina belandt, ziet hij prachtige foto's van het product. Wanneer een persoon met een visuele beperking op een bestemmingspagina terechtkomt, ziet hij de foto niet.

Het alt-attribuut van de img-tag lost het probleem op. Als je de trefwoorden niet hebt gepropt, maar de afbeelding hebt beschreven, begrijpt een blinde de inhoud van de foto met behulp van een schermlezer.

Het controleren van de juistheid van het invullen van formuliervelden verbetert UX

Je staat vast voor een onaangename situatie: vul een lang formulier in, probeer gegevens te verzenden en ontvang een foutmelding. Het implementeren van een UI met HTML5-standaarden beschermt tegen dit probleem en verbetert UX.

Probeer getallen of tekst in te voeren in het onderstaande vak E-mailadres. Als u een onjuiste waarde invoert, wordt dit onmiddellijk weergegeven op het formulier. Hiervoor heeft de webontwerper het gegevenstype opgegeven voor het formulierveld (invoertype = "e-mail").

Zie de Pen Email validatie door Dmitriy Dementiy (@ dmitriy-dementiy) op CodePen.

Autofocus bespaart reistijd

Besteed aandacht aan de illustratie. Nadat de gebruiker naar de inlogpagina is gegaan, kan deze onmiddellijk een telefoonnummer invoeren. Het is niet nodig om de cursor in het formulierveld te plaatsen.

Webontwerpers hebben hun gebruikerservaring verbeterd met het kenmerk autofocus.

Auteurs kunnen UX verbeteren met informatieve ankers.

Ankers zoals "hier", "lees meer" of "tyts" verminderen het gemak van de gebruikersinterface en verslechteren de gebruikerservaring. De meeste gebruikers zullen dit overleven, omdat ze de omringende tekst kunnen lezen en contextueel kunnen begrijpen waar de link naartoe leidt.

Mensen met een visuele beperking moeilijker. Schermlezers hebben navigatie op de links op de pagina. Blinde mensen horen ankers, maar zien de omringende tekst niet. Daarom is het belangrijk om informatieve ankers te gebruiken. Hier is bijvoorbeeld een link naar de Yandex.Direct-oplossing.

Asynchrone scriptbelasting verbetert de UX

Externe code kan het laden van pagina's blokkeren. Aandacht voor de afbeelding.

Om problemen met UX te voorkomen, heeft de webontwerper het laden van asynchrone scripts geconfigureerd. In dit geval wordt de pagina-inhoud geladen, zelfs als het externe script tijdelijk of permanent niet beschikbaar is.

De meeste services, waaronder Google AdSense, YAN en anderen, bieden gebruikers standaard een code met asynchroon laden. Soms weigeren site-eigenaren deze optie wegens onervarenheid. Dit kan de gebruikerservaring negatief beïnvloeden.

Aanbevelingsblokken verbeteren UX en verbeteren de prestaties van de site

Het toevoegen van een reeks aanbevelingen aan de site-interface is een eenvoudige en effectieve manier om de gebruikerservaring te verbeteren. Dit is zowel relevant voor inhoudsprojecten als voor e-commercesites. Online winkels met behulp van referentieblokken als "Zie ook" of "Met dit product kopen ze" verhogen de conversie en verhogen de gemiddelde factuur.

U kunt een reeks aanbevelingen toevoegen aan de site-interface met behulp van services zoals Relap of myWidget en de hulpprogramma's van de geselecteerde CMS gebruiken.

Om de gebruikerservaring te verbeteren, verwijdert u de zijbalk

Apple Design Director Jonathan Ive zegt dat er geen onnodige elementen in een goede gebruikersinterface zouden moeten zijn. Zijbalkafwijzing is een eenvoudige en effectieve manier om een ​​extra element uit de site-interface te verwijderen en UX te verbeteren. In dit geval wordt de verbetering van de gebruikerservaring omgezet in een toename van de efficiëntie van de site. Dit wordt bevestigd door onderzoeken waarover we schreven in het artikel over de bruikbaarheid van de zijbalk.

Visuele respons animeert de interface en maakt de gebruiker blij.

Visuele reactie-interface-elementen helpen de bezoeker om de pagina te gebruiken en de UX te verbeteren. voorbeelden:

  • Verander knop wanneer u zweeft.
  • De kleur van het veld wijzigen of een andere visuele bevestiging van de juiste formuliervulling.
  • Een voortgangsbalk die verandert terwijl u door de pagina bladert.

De "lucht" op de pagina maakt de interface handiger

Vrije ruimte benadrukt interface-elementen, helpt gebruikers bij het zoeken naar de gewenste inhoud of functionaliteit. Om de UI en UX te verbeteren, voegt u lucht toe aan de pagina.

De voorbeelden hierboven zijn voldoende om de invloed van de gebruikersinterface op de gebruikerservaring te tonen.

Ik moet vaststellen dat Dmitry overweegt om met gebruikerservaring in brede zin te werken, vanuit het oogpunt van bedrijfsprocessen, van en naar. Deze aanpak is relevant als het bedrijf in de staat zijn eigen specialisten heeft die zich met deze problemen bezighouden. Ons bureau houdt zich ook bezig met gebruikerservaring, maar we doen dit als onderdeel van het promotiewerk, d.w.z. de processen die wij als contractant kunnen beïnvloeden: analyse van de doelgroep, analyse van gedrag met behulp van statistische systemen, focusgroepenquêtes, enz. Maar in het kader van ons werk werpt UX-design zijn vruchten af ​​en is het een belangrijke factor in een hoogwaardige zoekmachineoptimalisatie.

UI - part, UX - integer

Gebruikerservaring gaat veel verder dan de competentie van de webontwerper. De ontwerper kan de UX beïnvloeden via de gebruikersinterface. Maar om een ​​specialist te bellen bij het maken van webpagina's, is de gebruikerservaring van de ontwerper niet. Het is hetzelfde als een kassier in een winkel in de buurt van het huis aanwijzen als verantwoordelijke voor het financiële resultaat en van hem dezelfde verkoopvolumes eisen als in de hypermarkt.

UX is niet beperkt tot de site. De gebruikerservaring wordt beïnvloed door de werknemer bij de machine, de lader, de leverancier, de verkoper, de ontwerper en de ontwikkelaar van de site, de auteur en de redacteur, de accountmanager, enzovoort. En het orkest wordt geleid door het hoofd van het bedrijf en zijn marketing rechterhand.

Kortom, het is gepast om Steve Jobs te citeren, die een echte UX ontwerper of user experience designer was.

Design is niet hoe een ding eruit ziet. Ontwerp is hoe het werkt.

Bekijk de video: Lisa Battle: Designing Great Dashboards for SaaS and Enterprise Applications (Oktober 2019).

Laat Een Reactie Achter