Deze tools maken mijn leven als UX’er een stuk makkelijker

In de loop der jaren heb ik flink wat tools uitgeprobeerd om mijn werk makkelijker te maken. Een aantal is blijven hangen en hebben zichzelf inmiddels wel bewezen. Van die tools heb ik hieronder een opsomming gemaakt.

Plannen in Trello (Gratis)

Met trello maak je eenvoudig boards waarop je lijstjes kan bijhouden. Items van die lijstjes kan je makkelijk slepen van het ene naar het andere lijstje. Veel bureaus gebruiken trello om support tickets bij te houden, ik gebruik het om overzicht te creëren.  Ik ben namelijk van nature een redelijke chaoot. Als ik in mijn hoofd probeer te onthouden of bij te houden ontstaat er een warboel waar zelfs Houdini niet meer uit zou komen. Dus ben ik een aantal jaar geleden begonnen Trello te gebruiken om overzicht te krijgen in wat er loopt, wat er aan zit te komen en wat is afgerond (en dus gefactureerd mag worden). Inmiddels zijn daar ook wat kolommen bijgekomen en zie de opbouw van de rijtjes er nu als volgt uit:

• Prospects (zodat ik niet vergeet dat ik er achteraan moet gaan als ik een tijdje niks hoor)
• Offerte uitgebracht/mogelijk Next up (concrete voorstellen gedaan)
• Wachten op (projecten die lopen maar waar de bal even bij de klant ligt)
• In te plannen (projecten waarop een go is gegeven, maar die nog geen plekje hebben in mijn planning)
• In de planning (projecten die dus wel al ingepland zijn, meestal niet langer dan een aantal weken vooruit)
• Nu lopend
• Te factureren (fijne kolom dit)
• Gefactureerd
• Periodiek (projecten die doorlopen, zoals de Service Abonnementen)
• Eigen projecten (een overzicht van de side-projects. Als ik dit niet bijhoud bestaat de kans dat ik ze simpelweg vergeet)

https://trello.com/

Uren bijhouden in Toggl (Gratis)

Uren bijhouden. Ik heb er een graftakkenhekel aan. Maar als ik het niet doe, kan ik mijn uren ook niet verantwoorden naar klanten toe. Bovendien geeft het inzicht in waar te veel tijd in is gaan zitten. Behoorlijk belangrijk dus. Toggl is hiervoor perfect. Je kan er eenvoudig uren mee bijhouden (druk op play als je begint, en op stop als je klaar bent), kan er ook handmatig uren mee invullen (handig als je vergeten bent op play te drukken) en je krijg een mailtje als je vergeten bent op stop te drukken. Bij een aantal klanten factureer ik op uurbasis, en dan is het superfijn dat je met Toggl eenvoudig reports kan maken (per klant, per project, over een bepaalde periode, etc). Oh ja, ze hebben ook een app die prima werkt. En dat allemaal voor noppes.

https://toggl.com/

Schetsen en notities met ReMarkable (€499)

Je kent het vast wel. Je begint aan een nieuw project en reserveert in je schets/notitieboekje alvast een paar pagina’s. Enthousiast ga je aan de slag, totdat je er achter komt dat je het aantal benodigde bladzijdes iets te zuinig had ingeschat, en je dus al een nieuw project bent gestart op pagina’s die je eigenlijk nu nodig hebt voor dit project. Balen.
Ander voorbeeld. Je schetst er lekker op los. In de loop der jaren ontstaat er een archief van meerdere schetsboekjes. Een klant waar je al eerder voor gewerkt hebt wil toch nog eens voortborduren op dat ene schetsje wat je ooit hebt laten zien. Maar in welk boekje stond dat ook alweer? En had ik dat boekje laatst niet weggegooid, omdat ik dacht dat ik het toch nooit meer nodig zou hebben?

Komt dit je bekend voor? Dan is een Remarkable echt iets voor jou.

De Remarkable is een soort tablet met een e-ink schermen (je weet wel, van de e-readers) en voelt aan als papier. De reactietijd is supersnel, waardoor je er echt op kan schetsen er ook geen vertraging is bij het schrijven. Je hebt beschikking over een aantal verschillende diktes pennen, potloden en stiften. Natuurlijk allemaal in grijswaarden, want het is geen kleurenscherm.

Ik gebruik de ReMarkable voor logo schetsen, wireframes, aantekeningen en als e-reader. (Lees je veel boeken, dan is dit niet de beste e-reader op de markt hoor. Daarvoor moet je hem niet kopen)

Grootste nadeel: de prijs. De prijs was 699, is nu 499. Ik heb hem destijds voor de helft kunnen kopen (early bird). Als hij nog een keer in de aanbieding komt: zeker kopen!

https://remarkable.com/

Prototyping in ProtoPie (€99)

Als het gaat om prototypes bouwen, heb ik flink wat geprobeerd. Principle, InVision, Marvel (gebruik ik nog steeds voor simpele dingen en om design feedback te krijgen) en natuurlijk Framer. De stijl van Framer spreekt me erg aan, en er is flink wat documentatie beschikbaar. Maar de mix van design en code was voor mij in de praktijk vaak te lastig. Dingen die ik in Design Mode maakte kreeg ik niet lekker geanimeerd in Code Mode en meerdere interacties (chained) waren best lastig om even snel te bouwen. Leuk dat het in coffeescript is, maar ik was vooral bezig met uit te zoeken hoe ik iets kon maken ipv even snel iets in elkaar te klikken. Framer was het dus niet echt voor mij, maar alternatieven zijn schaars. Dus bleef ik Framer gebruiken. Totdat ik ProtoPie tegenkwam. Sindsdien heb ik Framer niet eens meer opgestart. Met ProtoPie maak je heen snel eenvoudige klikmodellen. Wil je meer, zoals het animeren van verschillende onderdelen in het scherm, bijvoorbeeld bij het inladen, dan kan je deze animaties eenvoudig bij elkaar klikken. Heel gaaf zijn de chained events: als A zoveel pixels naar rechts schuift, schaal en verplaatst dan B. Ook scrolls en pages (waar je doorheen kan swipen) zijn eenvoudig te realiseren. En je hebt voor alle animaties en interacties ook nog eens een tijdlijn, waardoor het ineens visueel is. Je prototypes zijn online en op mobiel te bekijken, en je kan desgewenst een filmpje maken van je prototype.

Oh ja, sketch import? Check! En vrij goed ook. Van groepen worden layers gemaakt. Weet je van te voren dat je bepaalde dingen wil animeren, bijvoorbeeld tekst, dan kan je die onderdelen soms beter in ProtoPie namaken.

Een nadeel: je hebt voor de interface wel wat ruimte nodig. Mijn setup (Macbook voor me, met daarachter een groot scherm) is dan ideaal: op het grote scherm heb ik de interface staan, op mijn macbook de preview. Werk je met alleen een macbook, dan is het soms wat puzzelen met de ruimte.

Ben je visueel ingesteld, niet zo dol op programmeren maar wil je wel goede prototypes kunnen maken, voorzien van animaties die ook daadwerkelijk gebouwd kunnen worden: koop ProtoPie. Echt. Je gaat me op je blote knietjes bedanken.

https://www.protopie.io/

Design in Sketch

Vroeger – hoor nu, Opa spreekt – maakte je het ontwerp voor een site nog gewoon in Illustrator. Of in InDesign, net zo makkelijk. Toen het allemaal wat serieuzer werd, stapten wij designers over op Photoshop. Altijd geklooi met lettertype rendering en het fijne feit dat het nooit pixel perfect werd. Een enkeling maakte een zijstapje naar Dreamweaver (foei!), maar photoshop bleef lange tijd Koning Interface Design Tool. Snel even je assets genereren? Vergeet het maar. Meerdere pagina’s maken voor je site design? Vergeet het maar. Bepaalde delen hergebruiken, zoals een header of een footer? Vergeet het maar. Maar we zijn inmiddels een paar jaar verder. Photoshop kan nu wel makkelijker assets genereren, kent meerdere artboards en heeft duidelijk geluisterd naar een aantal wensen van Interface Designers. Maar wat was ik blij toen ik Sketch ontdekte. Sketch, gemaakt puur voor Interface Design. Sketch, vector based. Sketch, vol slimme features zoals assets genereren, meerdere artboards en herbruikbare symbols. Alleen al de manier waarop guidelines en grids werken is zoveel intuïtiever dan Photoshop. Als je Sketch eenmaal kent, ga je nooit meer terug naar Photoshop.

Grootste voordelen: snel assets genereren (PNG/JPG/SVG, 1x, 2x, 3x, allemaal zo gefixed). Vector, dus strak. Handige guides, waarbij de snapping (is dat een woord?) ook heel prettig werkt. Meerdere artboards met presets voor veel voorkomende formaten. En.. (nested) symbols. Hiermee kan je een slimme set aan onderdelen van je interface bouwen die je vervolgens door heel je design heen kan gebruiken. Een button maak je als symbol; wil je hem later toch anders dan hoef je niet je hele design door om alle buttons aan te passen, maar pas je simpelweg die ene symbol aan en …poef! Alle buttons aangepast. Nested symbols zijn handig als je bijvoorbeeld een inputveld als symbol hebt gemaakt waarbij je soms een icon erin wilt hebben. Door dat icoontje als symbol dan in je inputveld symbol te zetten, kan je het vervolgens in je design ook uitzetten. Of bijvoorbeeld een ander icoontje gebruiken. Snap je het nog? Kan me voorstellen van niet, maar ik laat het je graag eens zien.

https://www.sketchapp.com/

Andere handige tools voor een freelance UX Designer

Plannen, ontwerpen, presenteren, acquisitie, factureren… Als je freelance werkt als UX designer komt er best een hoop bij kijken. Je bent niet alleen maar de hele dag mooie dingen aan het maken. Dit zijn de tools ik verder vaak nog gebruik:

Mail en Agenda: G-Suite. Kost iets van 3 euro per maand en daarvoor kan je gebruik maken van de Google apps met je eigen domein. https://gsuite.google.com

Offertes en facturen: Moneybird. Mijn boekhouding loopt via Informer, maar daarbij vond ik de layout van facturen en offertes niet goed genoeg. Moneybird werkt voor offertes en facturatie perfect. En met de bank koppeling kan ik ook meteen zien of iets al betaald is of niet. Verder fijn aan moneybird: goede interface, periodiek factureren, snel klanten en facturen opzoeken, goede filtermogelijkheden. https://www.moneybird.nl/

Presenteren (en feedback verzamelen): Marvel. In Marvel maak je eenvoudig (vanuit Sketch) een overzicht van je designs. Daar kan je vervolgens ook nog een klikmodel van maken waar je klant doorheen kan klikken. Bij iedere pagina kunnen er comments geplaatst worden zodat je makkelijk feedback kan verzamelen. Marvel kost 12 dollar per maand. Daarvoor kan je dan ongelimiteerd projecten aanmaken. Ter vergelijking: bij InVision ben je dan 25 dollar per maand kwijt. https://marvelapp.com/

Vond je dit leuk? Geef een applausje!

Ontvang tips en maak kans op het boek Online Invloed

Kan jij wel wat kennis gebruiken? Ik geef het boek Online invloed gratis weg.  Het enige wat ik van je vraag is even aangeven dat ik je mag mailen met tips. Je ontvangt dan op onregelmatige basis  UX / Design / Conversie tips en ik betrek je graag in korte gebruikersonderzoeken van mijn eigen projecten (hoef je niet aan mee te doen, mag).

Onder de inschrijvers verloot ik het boek, als bedankje voor jullie support.