Als vormgever grijp je vrijwel altijd naar de bekende Adobe – pakketten als Photoshop of Illustrator. De vraag is alleen, zijn er alternatieven die zich kunnen meten met de Creative Suite tools. De makers van Sketch denken van wel, vooral als het gaat om het ontwerpen van vector – beelden voor bijvoorbeeld gebruikersinterfaces van websites of mobiele apps. Een combinatie van Sketch en Invision om het ontwerp klikbaar / clickable te maken is een perfecte start om verder te komen als interface designer.
Met de toenemende populariteit van retina displays en het groeiend aantal mobiele devices heb je als ontwerper te maken met allerlei verschillende formaten en resoluties. Nu betekent het nog vaak dat je bijvoorbeeld grafische elementen in de app opnieuw moet ontwerpen voor al die schermen. Dat kost behoorlijk wat tijd. Sketch biedt volgens de makers daar flexibiliteit door oneindig zoomen en het aanpassen van bijvoorbeeld afgeronde rechthoeken is volledig vector-based, waarbij je alleen maar de afmetingen in pixels in de gaten hoeft te houden.
Makkelijke export
Afbeeldingen voor het web exporteren kan vanuit Photoshop nogal eens omslachtig zijn, zeker als je de slicing tool gebruikt. Je moet dan de uitsnede maken met de slice tool, het bestandsformaat kiezen en dan via Save for Web de boel opslaan. Alle slices moeten dus stuk voor stuk worden opgeslagen en geëxporteerd. Het probleem was blijkbaar zo erg dat er zelfs een speciale app, Slicy, verscheen alleen voor dit proces.
Sketch lost dit op door de Export All feature. Omdat alles vector-based is, kan je exporteren in PDF, JPG, PNG en optioneel ook nog in twee formaten.
Code-vriendelijk vormgeven
Dit is een nieuw concept voor veel ontwerpers, maar het betekent niets meer dan dat alles wat je toepast in je ontwerp (schaduw, randen, verlopen) ook mogelijk is in CSS, de stylesheet. Waarom dat belangrijk is? Nou, het scheelt een hoop wanneer je front-end developers niet gek worden van al die complexe plaatjes met zes lagen effecten.
In Photoshop kan je bijvoorbeeld helemaal los gaan met de belichting, patronen en slagschaduwen die niet echt lekker vertaald kunnen worden naar CSS of mobiele toepassingen. Stijlen als Bevel & Emboss, Satin of Angles werken niet naadloos in een CSS, tenzij je bereid bent om heel veel beelden te gebruiken.
Niet zo vreemd, Photoshop is vooral een tool die ontworpen is voor beeldbewerking en complexe grafische montages en ontwerpen. Bij Sketch ligt de focus echt op het vormgeven van de user interface. Toch hebben de makers functies als oneindig gebruik van schaduws, randen, etc ingebouwd, in tegenstelling tot Photoshop waar je dat maar een keer kan gebruiken.
Ontwerpen met getallen
Sketch zorgt ook dat je bewust bent van de getallen, je gaat dus niet zomaar dingen verplaatsen, filters toepassen en allerlei creaties ontwerpen zonder dat je steeds rekening houdt met afmetingen, verhoudingen en de posities van elementen. Zaken die je iedere goede vormgever steeds in het oog moet houden.
3 tools in één
Als vormgever gebruik je voor interface design vaak drie verschillende tools. Photoshop voor het interface ontwerp, een tool als Omnigraffle voor wireframing en Illstrator voor vectors, logos en illustratie-elementen. Bij Sketch kun je dat allemaal samenvoegen in één tool, zonder dat je steeds heen en weer hoeft te importeren of exporteren.
Rasters
Vormgevers moeten tegenwoordig ook steeds meer rekening houden met rasters, waarbij het 960- raster veelgebruikt wordt voor Webdesign. Voor de diverse mobiele devices komen er steeds nieuwe rasters bij. In Sketch hebben de makers de mogelijkheid ingebouwd om rasters volledig aan te passen, zo kun je dus steeds werken op de juiste rasters voor alle verschillende apparaten.
Uitproberen?
Sketch kun je gratis uitproberen en bevalt het dan kost de tool 99 dollar…Een schijntje vergeleken met Photoshop of Illustrator…
http://www.bohemiancoding.com/sketch/
En natuurlijk kun je bij ons de tweedaagse cursus Visual design met Sketch en Invision volgen.
