Hé ontwerpers, stuur je je ontwikkelaars pioniers gek?
De kans is groot dat je een aantal gewoonten hebt die niet bijzonder goed vertalen naar code, en het maakt het leven moeilijk voor de ontwikkelaar die met je aan projecten werkt. Wil je een betere collega (en vriend) worden?
Leer hoe u beter kunt communiceren en ontwerpen, zodat ontwikkelaars van u zullen houden. Het versnelt projecten en vergemakkelijkt het werkleven. En het is ook geen kwestie van snoep meenemen naar vergaderingen. Je kunt ontwikkelaars van je laten houden door kleine wijzigingen aan te brengen in de manier waarop je werkt.
Het grootste probleem tussen ontwerpers en ontwikkelaars is dat ze vaak in bubbels werken. De individuen of teams beginnen niet over een project te praten totdat de eerste versie van het ontwerp is voltooid. Dan is er een overdracht van de ontwerper naar de ontwikkelaar.
Zucht.
Dat is gewoon niet de manier om te werken. Ontwerpers en ontwikkelaars moeten vanaf het begin samen worden betrokken om te bespreken hoe een project zal samenkomen. Hoewel de ontwerper zich kan concentreren op kleuren, letterbeelden en afbeeldingen, kan de ontwikkelaar inzicht verschaffen in bruikbaarheid, functie en prestaties.
Ontwerpers en ontwikkelaars moeten een goed idee hebben van hoe de andere kant eruit ziet. Ontwerpers moeten voldoende code en bruikbaarheid begrijpen om met ontwikkelaars te praten en uitdagingen te begrijpen; ontwikkelaars moeten een beetje kennis hebben van ontwerptheorie zodat ze suggesties kunnen doen wanneer ontwerpideeën niet kloppen voor het web.
Een van de grootste dingen die een ontwerper kan doen, is om elke keer op dezelfde manier bestanden voor te bereiden en in te pakken.
Hoe vaak heb je een Photoshop-document geopend met honderden naamloze lagen? Geef dit type bestand niet aan een ontwikkelaar. Elke laag en stijl, ongeacht welke software u gebruikt, moet op de juiste manier worden benoemd.
Hoe vaak heb je een Photoshop-document geopend met honderden naamloze lagen?
Stijlen, kleurstalen en typografie moeten consistent zijn in het hele ontwerp. (Een knop moet er niet anders uitzien van pagina tot pagina.)
Geef bestanden en stijlen een naam voor elk project op dezelfde manier. Groepeer dezelfde elementen op dezelfde manier en gebruik een consistent mapsysteem. Op die manier hoeft de ontwikkelaar niet opnieuw te leren hoe delen en elementen te vinden bij elk nieuw project.
Een van de grootste uitdagingen voor ontwerpprojecten met gedrukte en digitale stukken is typografiebeheer. Gebruik geen desktoplettertypen voor afdrukprojecten voor web- of app-ontwerpen en ga er maar van uit dat ze zullen werken. (Vaak doen ze dat niet.)
Kies voor digitale projecten voor Google Fonts voor typografie. Dit betekent dat u wellicht een soortgelijk lettertype voor het web moet zoeken als overeenkomt met wat u gebruikt voor afdrukken. (Dat is geen probleem.)
Laat de ontwikkelaar dit niet voor u doen. Kies de vergelijkbare Google-lettertypen en gebruik ze vanaf het begin. U kunt zelfs afdrukken versus digitale lettertypen noteren in uw stijlgids.
De reden hierachter is simpel: het inbedden van lettertypen kan een beetje lastig worden. Bovendien zijn Google Fonts gratis en zorgen ze ervoor dat u geen extra projectkosten maakt. (Overweeg, terwijl u bezig bent, hetzelfde met pictogrammen te doen en een pakket te gebruiken zoals Font Awesome, waarmee de ontwikkelaar pictogrammen kan stylen met behulp van CSS, en niet een heleboel afbeeldingsbestanden kan importeren!)
Hoewel we het over image-assets hebben, is het exporteren en verpakken van bestanden super belangrijk. Terwijl een ontwikkelaar alle afbeeldingsbestanden kan openen en exporteren om aan hun behoeften te voldoen, kunt u vragen wat ze nodig hebben en het onderweg doen.
Dit zorgt ervoor dat u de gewassen krijgt die u op afbeeldingen wilt, terwijl u bestanden comprimeert om uw website snel te laden.
Probeer dit niet alleen te doen. Vraag de ontwikkelaar hoe bestanden moeten worden opgeslagen, benoemd en gecomprimeerd voor optimaal gebruik.
Er zijn zoveel apparaatmaten en beeldverhoudingen om aan te denken bij het ontwerpen van websites en mobiele apps. Als ontwerper moet u de canvasgrootte, marges, opvulling, enz. Kennen om een mockup te maken die daadwerkelijk bruikbaar is.
Praat met de ontwikkelaar voordat u begint met tekenen om ervoor te zorgen dat u weet hoe de ontwerpomgeving er uitziet voordat u begint. Er is niets erger dan een ontwerp dat er geweldig uitziet in Photoshop of Sketch en plat valt in de productie.
U moet deze dingen van tevoren weten:
Het is al een paar keer genoemd, maar communicatie tussen de ontwerper en de ontwikkelaar is echt de sleutel om al dit werk te maken. Communicatie kan projecten maken of breken, deadlines beïnvloeden en het ontwerp en de functionaliteit van het eindproject beïnvloeden.
Communicatie kan projecten maken of breken
Neem je ontwikkelaar mee naar de lunch. Leer ze kennen. Stel onderweg veel vragen. Als je niet zeker weet of iets wel of niet werkt, vraag het dan gewoon. Ontwikkelaars zijn geen enge mensen en het is een stuk eenvoudiger om een vraag al vroeg in het proces te beantwoorden dan het hele concept opnieuw te moeten overwegen.
Terwijl u met de ontwikkelaar in gesprek bent en vragen stelt, duikt u dieper. Leer enkele basisprincipes voor ontwikkeling als je deze vaardigheden nog niet in je ontwerparsenaal hebt.
Ontwerpers die werken aan digitale projecten moeten zichzelf verslaan in:
Misschien schrijf je nooit echt code, maar het leren van ontwikkelingsprincipes zal je een betere ontwerper maken omdat je de waarde van de tools en workflows zult begrijpen.
Het ontwerpproces strekt zich ook uit tot ontwikkeling. Ontwerpers, u moet erkennen dat de ontwikkelaar net zo belangrijk is voor het ontwerpproces als u.
Zorg met dat in gedachten voor een "levende" stijlgids die niet alleen kleuren en lettertypen maar ook componenten bevat. Iedereen moet toegang hebben tot het document en het document bijwerken wanneer het project tot leven komt.
Een goede stijlgids helpt iedereen die aan een project werkt, om consistentie met visuele elementen te handhaven, context te bieden voor ontwerpkeuzes, als een punt van samenwerking voor het project te dienen en standaardisatie van code te helpen. De gids met woonstijlen stelt iedereen in staat ideeën uit te wisselen en begeleiding te bieden tijdens een project. Het is niet alleen een document dat iemand maakt voordat een ontwerp live gaat.
Zet de volgende informatie in de stijlgids om er het beste van te maken:
Respecteer het rooster. Bij responsief websiteontwerp is het raster meer dan alleen een richtlijn voor het plaatsen van elementen op het scherm, het kan ook bepalen waar elementen op verschillende schermformaten gaan en hoe kolommen stapelen en in willekeurige volgorde afspelen.
Het raster kan u helpen bij het ontwerpen en onderhouden van de stroom. (De uitdaging is dat je ontwerpregels niet willekeurig kunt overtreden.)
Denk er zo over na: uw ontwerp heeft vier inhoudsblokken op een rij op het scherm (met gelijke gootbreedtes) op een desktopmonitor op het volledige scherm. Op een tablet verschuiven die blokken naar twee kolommen, met twee rijen. Op een mobiel apparaat verplaatsen ze zich naar een enkele kolom met vier rijen.
Inzicht in hoe het raster de grootte van objecten beïnvloedt en hoe objecten op verschillende apparaten worden verplaatst, is belangrijk omdat het kan bepalen hoe u ontwerpt voor de inhoud die u hebt. Denk opnieuw aan datzelfde scenario. Wat als je vijf inhoudsblokken had? Het zou een herontwerp vereisen om ervoor te zorgen dat u een consistent visueel overzicht creëert.
De echte sleutel tot het samen laten komen van projecten is om flexibel te zijn. Ontwerptechnieken en -standaarden voor het web veranderen de hele tijd. Terwijl sommige projecten je in staat stellen om voor details te zorgen en onbeweeglijk te blijven, werkt responsief ontwerpen niet echt zo.
De gouden regel als het gaat om het werken met ontwikkelaars is ... wees geen eikel.
Ontwerpers die gemakkelijk kunnen werken, verdienen meer respect en hebben betere relaties met ontwikkelaars. Dit zal leiden tot betere en meer succesvolle projecten. Het zou vanzelfsprekend moeten zijn, maar al te vaak is er veel onbehaaglijk gedrag. Val niet in die val.
Wees flexibel, open en praat met uw ontwikkelaar. Ze zullen van je houden.