30 Essentiële UX-hulpmiddelen
Wanneer ontwikkelaars websites bouwen, richten ze zich vaak op de lay-out en technische functies, maar verwaarlozen een zeer belangrijk aspect - hoe de gebruiker de site ervaart. Als gebruikers moeite hebben om uit te zoeken hoe ze hun doelen kunnen bereiken, zullen ze elders zoeken en niet terugkomen. Een prettige gebruikerservaring daarentegen kan een gunstige en blijvende indruk wekken die een site onderscheidt van de concurrentie.
Daarom is het zo belangrijk om goed na te denken over wat gebruikers ervaren als ze uw website bezoeken. Je moet jezelf afvragen: geeft deze pagina de informatie die de gebruiker verwacht? Zoals met veel dingen, kunnen de kleinste details het grootste verschil maken in de gebruikerservaring.
In dit bericht zal ik 30 uitstekende tools en services introduceren voor het maken van websites met een betere bruikbaarheid.
Mindmappen, stroomdiagrammen en sitemaps
De basis van een bruikbare website is een goed plan. Als je geen idee hebt waar je project heen gaat, is het onwaarschijnlijk dat je op de juiste plaats aankomt. Mindmaps, stroomdiagrammen en sitemaps zijn effectieve hulpmiddelen voor het maken van de diagrammen die u nodig hebt. Mindmaps zijn geweldig voor het genereren en organiseren van ideeën, terwijl stroomdiagrammen helpen bij het visualiseren en plannen van de stappen in een proces. Sitemaps kunnen worden gebruikt om de navigatiestructuur van een website te identificeren. Hier zijn enkele toepassingen die u kunnen helpen met deze taken:
XMind (gratis)
XMind is een opensource mind mapping-programma voor Windows, Mac OS X en Linux.
ConceptDraw Office (vanaf $ 199)
Een krachtig diagramgereedschap, ConceptDraw Office biedt ondersteuning voor stroomdiagrammen en mindmaps op Windows en Mac.
OmniGraffle ($ 69,99)
Mac OS X- en iPad-gebruikers kunnen kiezen OmniGraffle om stroomdiagrammen, organigrammen en vele andere soorten diagrammen te maken.
Gliffy (gratis)
Gliffy is een webgebaseerde diagramtoepassing met ondersteuning voor stroomdiagrammen en sitemaps.
Wireframes en prototypen
Voordat de eigenlijke codering begint, is het vaak logisch om prototypen te doen. Met prototypen kunt u met verschillende ideeën spelen en mogelijke problemen opsporen zonder veel tijd te besteden aan coderen en ontwerpen. U kunt beginnen met low-fidelity wireframes in grijstinten en later visuele mockups en high-fidelity functionele prototypen maken.
PowerMockup (vanaf $ 59,99)
Gebruik PowerMockup om wireframes te maken met PowerPoint.
Potlood (gratis)
Beschikbaar op verschillende platforms, deze open-source software biedt GUI prototyping.
Mogups (vanaf $ 9 / maand)
Moqups is een online wireframing- en mockup-tool.
Justinmind Prototyper (vanaf $ 19 / maand)
Deze applicatie voor wireframing werken web- en mobiele apps op Windows en Mac OS X.
FileSquare (gratis)
FileSquare is een webgebaseerd hulpmiddel voor het maken van doorklikbare prototypen door geüploade mockupafbeeldingen aan elkaar te koppelen.
Handwerk (vanaf $ 19 / maand)
Handgemaakt is een collaboratieve HTML / CSS / JavaScript prototyping tool.
Gebruikerstests en feedback
Zodra u iets concreets te zien krijgt, moet u het voor de echte gebruikers weghalen, feedback verzamelen en ernaar handelen. De onderstaande toepassingen en services helpen u bij het uitvoeren van bruikbaarheidstests en het organiseren van gebruikersfeedback.
IntuitionHQ (gratis)
Deze service voor testen op gebruik op afstand kunt u verschillende gebruikerstests uitvoeren op uw ontwerpen en direct feedback krijgen.
Verifiëren (van $ 19 / maand)
Deze online applicatie verzamelt en analyseert gebruikersfeedback op schermen en mockups.
Polldaddy (gratis)
Polldaddy is een webtoepassing voor het maken en publiceren van enquêtes en peilingen.
Concept Feedback (gratis)
Bezoek deze online community om feedback op ontwerpen uit te wisselen.
Fivesecondtest (gratis)
Deze service verzamelt feedback door gebruikers te vragen de elementen van een website terug te roepen nadat ze deze slechts vijf seconden hebben gezien.
PickFu (vanaf $ 20)
Deze crowdsourcing-service biedt snelle feedback via eenvoudige A / B-peilingen.
UserTesting (vanaf $ 49)
UserTesting laat u "over de schouders kijken" van mensen die op uw website browsen.
UsabilityTools (vanaf $ 39 / maand)
Deze verzameling gereedschappen biedt gebruikersonderzoek aan, inclusief enquêtes, kaartsortering en feedbackformulieren.
Morae (vanaf ongeveer $ 402)
Deze desktop software registreert gebruikersinteracties (toetsenbord / muisinvoer, eye-tracking, audio, enz.) en analyseert de resultaten.
BugHerd (vanaf $ 29 / maand)
BugHerd is een online bug-tracker speciaal ontworpen voor webontwikkelingsprojecten.
A / B splitstests
A / B-testen is eenvoudig: u maakt twee variaties (A en B) van een pagina en bepaalt vervolgens welke resultaten beter worden gemeten in termen van aankopen, aanmeldingen voor nieuwsbrieven of andere factoren die u op prijs stelt, die een betere gebruikerservaring weerspiegelen . Deze twee services kunnen u daarbij helpen:
Optimizely (van $ 17 / maand)
Deze A / B split-testtool kan u helpen de meest effectieve manier te vinden om de conversies op uw website te verhogen.
Visual Website Optimizer (gratis)
Zoals Optimizely, Visual Website Optimizer biedt ondersteuning voor A / B-testen, multivariate tests, gedragsgerichtheid en meer.
Analytics
Webanalyses bieden waardevolle inzichten in hoe mensen uw website gebruiken. Ze kunnen u vertellen hoe bezoekers doorgaans door de website navigeren, hoe lang ze op elke pagina blijven, wanneer ze de site verlaten en nog veel meer. Deze informatie kan zeer nuttig zijn voor het identificeren van bruikbaarheidsproblemen en de oorzaken ervan.
Crazy Egg (vanaf $ 9 / maand)
Deze webanalyseservice visualiseert gebruikersgedrag met warmtekaarten, schuifkaarten en confetti-rapporten.
Inspectlet (gratis)
Nog een webanalysetool, Inspectlet biedt warmtekaarten, realtime analyses en schermopnamen van bezoekersgedrag.
Mixpanel (van gratis)
Mixpanel is een analyseplatform voor het bijhouden van aangepaste gebeurtenissen in mobiele en webapplicaties.
Validatie, linkcontroles en snelheidstests
Voor een positieve gebruikerservaring is het ook belangrijk dat de technische kant van een website werkt zoals bedoeld. Niets is frustrerender dan links die verwijzen naar niet-bestaande pagina's, websites die voor altijd worden geladen of pagina's die worden verbroken vanwege HTML- en JavaScript-fouten.
W3C Markup Validation Service (gratis)
Deze online service controleert om te bepalen of de code van een webpagina geldig is (X) HTML.
Dr. Link Check (gratis)
Deze web-app controleert een site op verbroken en links op de zwarte lijst.
Pingdom-test voor volledige pagina (gratis)
Gebruik deze tool om te testen en te analyseren hoe lang het duurt voordat uw webpagina wordt geladen.
Google PageSpeed (gratis)
Deze Google-service analyseert een webpagina en doet suggesties voor het verbeteren van de laadtijd.
CrossBrowserTesting (van $ 29,95 / maand)
Deze service biedt virtuele machines voor het testen van een website in verschillende browsers op verschillende besturingssystemen.
Gebruik je een van deze tools? Hebben we iets gemist waar je op vertrouwt? Laat het ons weten in de comments.