Sketch slokt snel zijn concurrentie op en staat klaar om Photoshop in te halen als de go-to interface-prototyping-tool, tot het punt dat veel ontwikkelaars er nu de voorkeur aan geven dat ontwerpers Sketch-bestanden overhandigen in plaats van gelaagde Photoshop-bestanden.
In tegenstelling tot Photoshop is de grafische software Sketch vanaf de basis opgebouwd voor het ontwerpen van interactieve interfaces.
Het creëert live composities zodat klanten een voorbeeld kunnen zien van wat er gebeurt wanneer ze op uw ontwerp klikken, vegen of tikken op hun desktop, laptop, tablet of telefoon.
Vanwege dit alles willen ontwerpers die Photoshop gebruiken om gebruikersinterfaces voor desktops en mobiele apparaten te maken, Sketch misschien van dichterbij bekijken.
Sketch, afkomstig uit Nederland, is een vectorontwerpprogramma voor Mac, met de nadruk op het maken van interactieve prototypes van web- en app-ontwerpen.
Het soort werkend ontwerp dat Sketch produceert, geeft uw klanten een beter idee van hoe alles eruitziet en reageert.
Dat stelt hen op hun beurt in staat om meer bruikbare feedback te geven over de functionaliteit (gebruikersinterface of UI) en gebruikerservaring (UX), en bijgevolg is geïnformeerde goedkeuring voorafgaand aan de ontwikkelingsfase mogelijk, waardoor frustratie wordt beperkt en tijd en geld wordt bespaard.
Sketch's relatief recente (2008) conceptie was gericht op collaboratief ontwerp voor schermen, dus het heeft een voorsprong op Photoshop, dat dertig jaar eerder debuteerde, toen het woord scherm had te maken met het meten van de dichtheid van halftonen.
Ontwerpers begonnen te leunen op Adobe Photoshop ($ 9,99 / maand bij Adobe) om interface-ontwerpbestanden te organiseren en over te dragen, omdat dit de beste tool in de doos was om de klus te klaren - niet omdat het een tool was die speciaal voor dat doel was gebouwd.
Sketch is echter niet de enige in de UX-ontwerpruimte.
Adobe XD (XD staat voor Experience Design), uitgebracht in 2016 als onderdeel van Adobe's Creative Cloud voor Windows en Mac, is ook een vectorgebaseerde tool voor wireframing en het produceren van interactieve doorklikprototypes.
Een tweede op vectoren gebaseerde concurrent, aangeprezen als "de krachtigste schermontwerptool ter wereld", is Studio van het zware ontwerpsysteembeheerplatform, InVision (gratis voor één prototype, $ 25 per maand voor een onbeperkt aantal prototypes).
In tegenstelling tot Sketch en XD heeft Studio een ingebouwde geavanceerde animatiemodule.
Werk dat in Sketch wordt gedaan, kan worden gesynchroniseerd met het InVision-platform met behulp van hun eigen Craft Manager-plug-in.
Adobe biedt een gratis XD-startersplan met beperkte (2GB) opslag en gebruik van een deel van de Adobe Fonts-collectie.
De volledige versie van XD is beschikbaar als onderdeel van het Adobe Creative Cloud (CC) -abonnement, vanaf $ 20,99 per maand voor de enkele app of vanaf $ 54,99 per jaar voor alle Creative Cloud-apps, inclusief Illustrator ($ 19,99 bij Adobe), InDesign en Photoshop.
Sketch gebruikt een variant op een abonnementsmodel, dat $ 99 per jaar per apparaat (een computer of mobiel) kost voor individuen.
Dit omvat een jaar aan updates en Sketch Cloud (voor online delen en samenwerken), waarna u uw huidige versie voor altijd kunt behouden en gebruiken of kunt verlengen voor $ 69 per jaar om regelmatig updates en cloudvoordelen te herwinnen.
Volumelicenties variëren van $ 64 per jaar per apparaat voor twee tot negen apparaten tot $ 49 voor elk voor 50 of meer apparaten.
Het is vermeldenswaard dat wanneer u een licentie aanschaft, u recht heeft op slechts één seat (voor gebruik op slechts één computer).
Als je meerdere Macs gebruikt, zoals een desktop en een laptop, heb je pech en moet je twee stoelen kopen.
Veel op abonnementen gebaseerde apps staan ??twee stoelen per licentie toe, wat een goede beurt is voor die hardwerkende creatievelingen die op hun desktop op kantoor en thuis op hun laptop zwoegen.
Een bijkomend ongemak is dat als u Sketch op een nieuwe Mac wilt gebruiken of als u uw schijf opnieuw moet formatteren, u Sketch van uw oude computer / schijf moet afmelden en vervolgens opnieuw moet registreren.
Aan de slag
Sketch is in een handomdraai te downloaden vanaf de site van het bedrijf (sketchapp.com); er is een gratis proefperiode van 30 dagen, zonder creditcard.
Sketch vereist MacOS 10.13.4 (High Sierra) of hoger.
Het bedrijf waarschuwt dat als u werkt met complexe documenten van meerdere pagina's met honderden tekengebieden, een van de krachtigere Macs met RAM-geheugen wordt aanbevolen.
Ik heb Sketch 53.2 getest op een MacBook Pro 2018 met een 2,9 GHz Intel Core i9-processor, 32 GB RAM en een Radeon Pro 560X grafische kaart.
Sketch biedt direct op de downloadpagina een beginnershandleiding, uitgebreide documentatie, tutorials en tips, en links naar de sociale media en ontwikkelaarsgemeenschappen, blogs en chats en Dribble.
Het is uitnodigend en inspirerend om een ??lijst te zien van bijeenkomsten en evenementen van wereldwijde designgemeenschappen.
Bovendien biedt de site een veelvoud aan gratis en premium Sketch App UX / UI-bronnen, waaronder wireframe-kits, mobiele UI-kits, sjablonen, mockups, dashboards, concepten en pictogrammen.
Interface en canvas
Sketch geeft het goede voorbeeld en biedt een schone, contextuele gebruikersinterface met drie hoofdsecties - en (door het ontwerp) geen zwevende panelen.
Als je al een Mac-gebruiker bent, zul je de Sketch-gebruikersinterface bekend vinden, omdat deze is gemodelleerd naar de interfaces van Apple-apps zoals Pages, Numbers en Keynote.
Met deze nieuwste versie wordt de donkere modus van Apple nu ondersteund.
Aan de linkerkant van het scherm vindt u de Paginalijst met een inventaris van uw lagen, individuele inhouditems op die lagen en tekengebieden, en de genoemde inhoud daarop.
Aan de rechterkant is de Inspector waar je kunt spelen met de eigenschappen van de inhoud op welke laag je ook hebt geselecteerd.
Bovenaan heb je de werkbalk met tools en acties.
Het middelpunt is je canvas waar je de magie creëert.
De Paginalijst maakt het gemakkelijk om lagen te organiseren, toe te wijzen of te wijzigen, en geeft u de mogelijkheid om inhoudsitems een naam te geven, te groeperen, te selecteren en te dupliceren, zodat uw workflow efficiënt is.
U bent in topconditie als het tijd is om bestanden aan een ontwikkelaar over te dragen.
Sketch verbetert uw workflow door veelvoorkomende taken te vergemakkelijken of te automatiseren met eenvoudig te maken bibliotheken, tekst- en laagstijlen, symboolinstanties en voorinstellingen.
Bovendien zijn er honderden tijdbesparende UI-kits, sjablonen en plug-ins beschikbaar die de functionaliteit van Sketch op talloze manieren verder uitbreiden.
Tekenen en zetten in Sketch
Zoals een cheetah is om te rennen, is Sketch om te prototypen.
Een cheetah kan zeker lopen, maar waarvoor hij is geëvolueerd, is rennen.
Evenzo kun je absoluut tekenen in Sketch, en dat is oké, maar het bijzondere aan Sketch is de prototyping.
Toch is het de moeite waard om een ??overzicht te krijgen van wat u kunt doen met de tekentools van Sketch.
Het maken, importeren en samenstellen van alle inhoud begint met een klik op de vervolgkeuzelijst Invoegen.
Daar vindt u de verwachte vorm-, teken- en teksttools.
Handig aan de rechterkant zijn de rangschikkingshandelingen zoals naar voren brengen, uitlijnen en distribueren; en niet-destructieve basis Booleaanse tools zoals Union, Subtract, Intersect en Difference.
Met de intuïtieve en efficiënte vectortools kunt u vormen, hun punten en Bezier-curven maken en bewerken.
Hoewel Sketch essentiële tekentaken aankan, is het geen Illustrator - en dat zou het ook niet moeten zijn.
Basistypografie in Sketch is eenvoudig, met vertrouwde Microsoft Word-achtige functies en decoratieve opties voor schaduwen, vullingen en randen.
Het opmaken van letterblokken kan enige handmatige inspanning vergen in Sketch, dat bijvoorbeeld geen tabben ondersteunt - u moet de spatiebalk gebruiken om het gewenste effect te simuleren.
Dat is prima, want elke complexe typografie is voor niets bij het ontwerpen van responsieve lay-outs: alles wat typografisch (grootte, regeleinden, woordafbreking, enzovoort) wordt weergegeven op de apparaten met verschillende formaten.
Prototyping en responsief ontwerp
In tegenstelling tot andere tekenprogramma's (maar heel erg zoals Adobe XD), vergemakkelijkt Sketch het bouwen van een interactief prototype.
Om het pad van uw site of app (UI) te simuleren, en hoe de ervaring (UX) eruit zal zien, kunt u bepaalde gebieden toewijzen als scrollend of niet-scrollend, link- en crosslinkmenu's, symbolen, secties, pagina's en instanties en definieer hotspots (klikbare gebieden).
U kunt niet alleen een voorbeeld van uw inspanningen bekijken vanuit de app, maar u kunt ook Sketch Mirror gebruiken (meer over die functie hieronder).
Een nieuwe eigenschap in Sketch is dat je prototypetekst- en vormvelden kunt vullen met dynamische realistische gegevens in plaats van vast te zitten aan de gebruikelijke Lorum Ipsum-verveling.
Aan geselecteerde tekst- of vormlagen kunt u een bronbestand toewijzen waaruit u tekst of afbeeldingen kunt importeren.
Sketch speelt heel goed met anderen, en niet alleen in de app.
Het was een genot om te ontdekken dat ik een pictogram dat in Illustrator was gemaakt, kon kopiëren en plakken.
Bij het importeren creëerde Sketch een gegroepeerde laag voor mijn kunst, en van daaruit kon ik het pictogram gebruiken zoals het is, het toevoegen aan een bibliotheek of een symbool maken, net zoals je kunt met elke kunst die in de app is gemaakt.
In de huidige markt moet elk goed doordacht, schermgericht ontwerp responsief zijn.
Dit betekent dat de inhoud op een app-scherm of webpagina automatisch wordt verkleind en verschoven, afhankelijk van het weergaveapparaat (desktop, laptop, mobiel, tablet).
Dus het formaat van tekst, regeleinden veranderen en afbeeldingen verkleinen, vergroten of verbergen, afhankelijk van wat er het beste uitziet op elk apparaat.
In Sketch moet u handmatig variantlay-outs en vereenvoudigingen van de verschillende hoogte-breedteverhoudingen maken door elk element of elke groep te kopiëren en te plakken.
Ik zou echter willen dat er een slimme aanpassingsoptie was voor responsieve lay-outwijzigingen vergelijkbaar met Responsive Resize in XD of zelfs InDesign's functie Lay-out aanpassen.
Hoewel Lay-out aanpassen bijna nooit een perfecte oplossing oplevert, bespaart het zeker tijd en biedt het een betere plek om te beginnen dan een lege pagina.
Om een ??voorbeeld van uw Sketch-ontwerpen in realtime op uw apparaten te bekijken, is er de gratis Sketch Mirror voor iOS, evenals verschillende apps om dit te doen op Android-apparaten.
In alle gevallen hebben apparaten wifi of een USB-verbinding nodig.
Het nemen van weloverwogen ontwerpbeslissingen komt ieders workflow ten goede, en daarom is het een zware aanwinst om uw aanpassingen, bijsnijden en tekstgrootte live te kunnen zien met Sketch Mirror op het daadwerkelijke apparaat.
Output en samenwerking
Wanneer uw werk klaar is voor feedback van klanten of teamsamenwerking, zijn er verschillende manieren om te delen.
De primaire methode is om uw document naar Sketch Cloud te uploaden.
Na het uploaden krijgt u een URL en kunt u kiezen wie u wilt uitnodigen om het document te bekijken, en een van de drie toegangsniveaus instellen: Reageren, Downloaden of Gebruiken als bibliotheek.
Iedereen met de link kan de ingebouwde tools voor opmerkingen gebruiken en als ze de pagina op een tablet of telefoon openen, kunnen ze een voorbeeld van het tekengebied (en) in volledige resolutie bekijken, zolang er maar een lay-out is voor hun ..
.
