Design tools bij Lemone

Concepts

 Pim, UX Designer 

Concepts is een teken-app op de iPad die we voor verschillende doeleinden inzetten. Op UX gebied gebruiken we dit voor wireframes (de blauwdrukken van onze websites en apps) en bij UI wordt deze app af en toe gebruikt voor het tekenen/schetsen van logo’s.

Als gebruiker begin je op een leeg canvas waar je kunt kiezen uit een heel aantal potloodsoorten, pennen en markers. Bij het eerste gebruik van de app zal voor menig gebruiker de besturing misschien nog ietwat onwennig voelen. Wanneer je echter weet waar je moet zijn kun je veel sneller te werk gaan. Met Concepts kun je jou ‘ontwerp-productiviteit’ aanzienlijk verhogen. Zoeken naar de beste oplossing voor een website of app is vaak een proces waarin je veel belangrijke keuzes moet maken. Door middel van de app kun je snel veel meer varianten maken op je ontwerpen wat helpt bij het maken van die keuzes. Door meer wireframes of logo’s te tekenen/schetsen in kortere tijd heb je meer keuzemogelijkheden en hoef je niet meteen akkoord te gaan met het eerste beste ontwerp wat je maakt. Dit zorgt er ook voor dat de websites en apps die we afleveren bestaan uit afgewogen oplossingsrichtingen waarbij we gebruikersgemak altijd vooropstellen.

Zelf ben ik als UX’er blij met iets simpels als een copy-paste, group of select functionaliteit. Dit is omdat ik vaak veel verschillende wireframes moet maken waarbij sommige elementen vaker moeten terugkomen. Je kunt gemakkelijk meerdere versies maken door herhalende elementen te selecteren, te groeperen en te kopieëren/plakken. De selecteer functionaliteit werkt ontzettend gedetailleerd en daardoor kun je met gemak ‘pixel-perfect’ wireframes maken, alleen door het gebruik van een stylus pen. Kleurgebruik en vorm zijn een ontzettend belangrijk onderdeel van de app. Concepts biedt ontzettend veel mogelijkheden om je wireframes hiermee tot leven te wekken. Het helpt om het gemakkelijk te communiceren naar onze relaties, waarin we onze keuzes eenvoudig kunnen toelichten en al in beeld kunnen brengen hoe wij de website of app voor ons zien.

Sketch

 Tim, Digital Designer

We maken gebruik van Sketch voor verschillende doeleinden, zoals het ontwerpen van websites, dashboards, app designs en social media uitingen. Sketch biedt een scala aan vooringestelde artboards, wat zorgt voor een gebruiksvriendelijke ervaring.

Sketch is een gemakkelijke tool om te leren en heeft een intuïtieve gebruikersinterface, vergelijkbaar met de UX van Apple. Alles is overzichtelijk georganiseerd en eenvoudig in gebruik. De vele functies, waaronder symbols, dragen bij aan een efficiënte werkwijze.

Mijn favoriete feature is het gebruik van symbols, waarmee je zorgt voor consistentie in het design en snel aanpassingen kunt maken. Met slechts één klik kun je bijvoorbeeld een kleur of tekst van het hele website ontwerp wijzigen.

Bij Lemone werken we al sinds de oprichting met Sketch en ik heb de mogelijkheid gehad om aan diverse projecten te werken. Een ontwerp waar ik enorm trots op ben is de recente portfolio website van een van onze stagiairs. Ik kreeg de opdracht om iets buiten mijn comfortzone te ontwerpen en het resultaat mag er zijn.

InVision

 Patrick, Digital Designer

Een tool die we bij Lemone al jaren gebruiken. InVision is ideaal voor het maken van klikbare prototypes en het presenteren van je designs. Collega’s intern maar ook de klant kunnen in deze online omgeving meekijken met het design proces en gericht feedback geven. Eigenlijk dus een tool die we dagelijks gebruiken en wat echt onderdeel is van onze werkwijze bij het ontwikkelen van projecten.

Ook al heeft InVision lange tijd dus een grote meerwaarde gehad, zie je toch dat tools als Sketch en Figma inmiddels vergelijkbare functies hebben toegevoegd. In de loop van dit jaar zullen we dan ook geleidelijk afscheid nemen van InVision en ons design werk gaan presenteren en overdragen aan team development via een cloud omgeving vanuit de design tool zelf.

Uiteindelijk is het als team het prettigst om zo min mogelijk verschillende tools te gebruiken. Daarom zijn we blij dat deze functionaliteiten geïntegreerd zijn in Figma en Sketch. Dit stelt ons in staat om nog efficiënter te werken en onze werkzaamheden binnen één platform uit te voeren.

Figma

 Pim, UX Designer

Figma is momenteel een van de grootste user interface design tools, met meer dan miljoenen gebruikers wordt het het al jaren gezien als hét alternatief voor Sketch. Bij Lemone gebruiken we de tool voor het ontwerpen van testbare high-fidelity prototypes met gedetailleerdere interacties.

De tool heeft over het algemeen veel weg van de interface van Sketch, maar is misschien net wat intuïtiever. De leercurve is klein terwijl je toch veel van de features van Sketch behoud. Figma heeft over het algemeen een grotere knowledge base om op terug te vallen wanneer je vastloopt. De creatieve vrijheid bij Figma is een groot pluspunt want je kunt als UX en/of UI Designer veel kanten op met vrij weinig beperkingen. Je hebt veel features binnen de tool waar je als ontwerper gebruik van kan maken en een groot deel hiervan met wat ‘trial and error’ al snel in de vingers kan krijgen.

Bovendien is Figma ook gratis, kun je via een browser ontwerpen (en hoef je dus niet per se de software te downloaden) en is het ingericht op multi-disciplinaire samenwerking binnen organisaties. Juist omdat de tool bepaalde features op de voorgrond niet laat zien resulteert in een wat beknoptere interface en kan je de rest van de tool stapsgewijs ontdekken.

Vanuit mijn rol als UX/Interaction designer ben ik het meest geïnteresseerd in de interacties die je binnen je prototype kan toepassen. Je kunt je (high fidelity-)prototypes tot leven brengen met allerlei micro-interacties en animaties, waarmee je de algehele gebruikerservaring aanzienlijk kunt verrijken. Figma is constant bezig met het uitbreiden van zijn prototyping-functionaliteiten en zo blijft het voor UX en UI designers een zeer relevante tool die een echte toevoeging kan zijn tot je ‘toolset’.

Adobe Creative Suite (Photoshop)

 Patrick, Digital Designer

Bij Lemone maken we gebruik van de Creative Suite van Adobe. Dit is een uitgebreid pakket van verschillende design tools waar we met name Photoshop en Illustrator van gebruiken. Dat kan zijn voor brand materialen zoals het maken van een logo, maar ook het bewerken van foto’s die we gebruiken bij online projecten.

Photoshop is een tool waar we alle jaren mee werken. Ik heb zelfs nog meegemaakt dat we daar onze websites in ontworpen (in pixels). Ook al is Photoshop niet meer voor online, is het nog altijd een van mijn favoriete tools om in te werken.

Met de komst van Sketch en Figma heeft Photoshop echter een andere rol gekregen. Het is nu meer een tool geworden om materialen voor te bereiden voor online projecten. In feite gebruiken we het steeds minder, omdat we liever materialen voor online direct in vectoren tekenen in Sketch of Figma. Vectoren zijn kleiner en flexibeler, waardoor ze bijvoorbeeld eenvoudiger te animeren of schalen zijn op een website.

Kortom, we omarmen nieuwe mogelijkheden, maar koesteren ook nog steeds de waarde en het gebruiksgemak van Photoshop in onze workflow.

Adobe Creative Suite (Illustrator)

 Tim, Digital Designer

Adobe Illustrator biedt een rijke gebruikservaring voor het maken van grafische ontwerpen en illustraties. Je werkt in vectoren en dat zorgt ervoor dat je in staat bent nauwkeurige designs te maken, zonder kwaliteitsverlies wanneer je deze gaat opschalen. Illustrator heeft een breed scala aan penselen, vormen en effecten waarmee gebruikers hun ontwerpen kunnen verfraaien en eigen kunnen maken. Het lagen paneel zorgt ervoor dat je gemakkelijk je design elementen kunt rangschikken, vergrendelen of verbergen. Dit alles wordt ondersteunt door Adobe Creative Cloud, waarmee je gemakkelijk al je bestanden kunt delen, assets kan synchroniseren en je workflow kunt verbeteren.

Er is één tool in Illustrator die ervoor mij uitspringt: de Shapebuilder-tool. Dit is een geweldige tool omdat het op een gemakkelijke manier complexe vormen creëert door simpelweg te slepen en combineren. Het biedt een snelle en flexibele manier om verschillende objecten samen te voegen waardoor je mogelijkheden tijdens het ontwerpen worden vergroot.

Met het gebruik van Illustrator heb ik uiteindelijk het logo van Bulletin ontworpen. Een uniek vormgegeven B die de identiteit van het merk weerspiegeld. Bovendien heb ik daarbij een passend lettertype gekozen waarmee ik de boodschap en uitstraling van Bulletin heb versterkt. Daardoor heeft Bulletin nu een professioneel en samenhangend logo, waar ze trots op mogen zijn.