Fronteers — vakvereniging voor front-end developers

Hallo frontenders, hier spreekt een ontwerper

Maaike de Laat deed tijdens de Jam Sessions van het Fronteers-congres namens ontwerpers een oproep aan front-enders. Deze presentatie heeft ze met Marrije Schaake uitgeschreven tot dit artikel. Haar talk, 'A Call To Arms', in het Engels, is terug te kijken bij de Jam Session video's.

Hallo Frontenders

Ik heb een verzoek aan jullie, namens de grafisch ontwerpers. Nou ja, ik heb het ze niet allemaal gevraagd, maar ik denk dat veel ontwerpers het wel met me eens zullen zijn.

We hebben jullie hulp nodig. Jullie kunnen ons helpen om webontwerp beter te maken, om het naar het volgende niveau te tillen. Ik zal het zo uitleggen, maar kijk eerst eens naar dit plaatje:

Benz Motowagen

Dit is de Benz Motorwagen. Hij werd ontworpen door Karl en Bertha Benz in 1886, en hij wordt door veel mensen beschouwd als de allereerste auto. Dat wil zeggen – er waren eerder ook al wel auto-achtige voertuigen, maar dat waren gewoon koetsen waarbij de bouwers het paard weghaalden en er een motor voor terugplaatsten.

Deze auto was de eerste die echt ontworpen is om gebruikt te worden met een motor. Maar toch lijkt hij nog erg veel op een koets! Koetsen waren wat de mensen kenden. Het duurde een tijdje voordat de auto-ontwerpers bedachten welk soort ontwerp het beste werkt voor een automobiel. En voordat handelaars nieuwe toepassingen bedachten voor de auto.

Horseless Carriage Syndrome

In de jaren zestig van de twintigste eeuw noemde Marshall McLuhan dit het ‘Horseless Carriage Syndrome’ (het ‘paardloze koets-syndroom’): nieuwe technologieën beginnen altijd met het imiteren van wat er eerder was. Dat hoeft niet per se een probleem te zijn: mensen vinden het makkelijker om iets te begrijpen als het lijkt op iets dat ze kennen. Maar na verloop van tijd wordt het een beperking.

Een Apple Macintosh desktop uit begin jaren tachtig

Kijk bijvoorbeeld eens naar de eerste GUI's (Graphical User Interfaces) van computers. De metafoor van het bureaublad was nuttig: het hielp mensen te begrijpen wat een PC allemaal kon. Op het bureaublad van de PC bevonden zich mappen met documenten erin, een rekenmachine, een prullenbak... Net zoals bij een echt bureau. Maar inmiddels kunnen computers heel veel dingen die niets te maken hebben met echte bureaus – en dan wordt de metafoor een last.

Laten we nu eens naar webontwerp kijken. Toen ik begon als ontwerper, eind jaren negentig, was het heel hip om achtergronden met een structuurtje te gebruiken in websites. Je kent ze vast nog wel, een mooi gekreukeld papiertje, of een kek houtnerfje. Ik heb zelfs een ontwerp gevonden waar ze allebei inzitten!

Een screenshot van een prachtige jaren-negentig website

Mooi, toch?

En het is niet zo gek dat we dit deden, want in die tijd hadden veel webontwerpers een traditionele grafisch-ontwerpachtergrond. En als je drukwerk ontwerpt is het heel belangrijk om rekening te houden met de eigenschappen van het materiaal dat je gebruikt. Je kunt kiezen uit allerlei soorten papier, variërend van glad en glanzend tot heel grof, en dit heeft letterlijk veel invloed op de look & feel van je ontwerp. Maar computerschermen zijn altijd hetzelfde: koud en hard. Dat was even wennen voor ons ontwerpers! En misschien ook voor ons publiek.

Zoals je vast wel weet, heet deze gewoonte om een website of een interface te laten lijken op een fysiek object ‘skeuomorfisme’. En waarschijnlijk hadden we dit allemaal een beetje nodig, terwijl we langzaam gewend raakten aan digitaal ontwerp. De afgelopen jaren is er natuurlijk veel gedebatteerd over skeuomorfisme, en het lijkt nu wel aan zijn einde te komen. En dan is de vraag: wat komt er nu?

Ken je materialen

Ik denk dat goed ontwerp voortkomt uit een gedegen kennis van de materialen waar je mee werkt.  Lang is het zo geweest dat dit voor ontwerpers min of meer met de paplepel ingegoten werd. Voor de twintigste eeuw bestond ‘grafisch ontwerper’ niet eens als een apart beroep. De persoon die het werk maakte was tegelijkertijd de ontwerper.

Een foto van een Romeins theater met inscriptie

In het Romeinse rijk, bijvoorbeeld, was degene die de inscripties maakte op een monument ook de ontwerper van de inscriptie. En na de uitvinding van de drukpers waren de mensen die de drukpersen bedienden ook de ontwerpers van de producten die ze drukten.

Vanaf de jaren vijftig van de vorige eeuw, toen de reclame-industrie een grote vlucht nam, werd ontwerp een echt beroep. Maar ook nu weten ontwerpers gewoonlijk nog prima hoe een drukpers werkt en wat je met verschillende soorten inkt, papier en boekbindtechnieken kunt. De drukwerkwereld is nogal langzaam en conservatief, dus dit is altijd goed te doen gebleven.

In de digitale wereld ligt dat echter heel anders. En dat, lieve frontenders, is waarom we jullie nodig hebben.

We zijn allemaal wel op de hoogte van de discussie over of ontwerpers ook moeten programmeren. Over die discussie zal ik het nu niet hebben, want dat lijkt me niet zo nuttig. Het is geweldig als een ontwerper kan programmeren, maar er zijn veel ontwerpers die het niet kunnen, en ze gaan het echt niet leren alleen omdat jij zegt dat het moet.

Maar dan nog moeten ontwerpers hun medium wel goed begrijpen om goed werk te kunnen maken. Ze moeten snappen hoe webpagina's werken, wat je kunt doen met HTML, CSS and JavaScript – en vooral ook wat je niet kunt doen.

Ontwerpers zullen namelijk altijd ontwerpen. En als ze tegemoet zijn gekomen aan de wensen van de klant en de behoeften van de klant, als ze hebben nagedacht over concepten en branding en gebruiksvriendelijkheid, hebben ze ook gewoon zin om nieuwe dingen te proberen. Om te experimenteren. Veel ontwerpers bezoeken websites met voorbeelden van interessant ontwerp, zoals It's Nice That, ontelbaar veel webdesign showcases en zelfs Pinterest. En als ze iets zien dat ze mooi vinden, zullen ze waarschijnlijk iets soortgelijks proberen te maken. Ook als dat betekent dat jij 5 JavaScript libraries, 8 webfonts en 500 mb aan plaatjes nodig hebt om het te bouwen.

En natuurlijk kun je daar over mopperen, maar tegen die tijd is de ontwerper waarschijnlijk al verliefd geworden op zijn of haar eigen ontwerp. En als je echt pech hebt, is de klant dat ook.

Past het bij het medium?

Het probleem met deze ontwerpsites is dat ze nooit uitleggen hoe iets gebouwd is, en of een ontwerp technisch wel goed in elkaar zit. Als je zelf geen frontender bent, kan het heel moeilijk zijn om te beoordelen of een bepaald effect of een ontwerpoplossing moeilijk te bouwen of te onderhouden is, of dat het bijvoorbeeld slecht voor de performance is. Met andere woorden: of het een elegante oplossing is die goed bij het medium past. Of, met nog andere woorden: of je hier te maken hebt met een horseless carriage.

En jij dan?

Maar laten we het eens over jou hebben. Jij bezoekt waarschijnlijk heel andere websites. Sites als A List Apart en Smashing Magazine, waar je leest over CSS3-dingen die je eindelijk kunt gebruiken, of misschien een nieuwe lichtgewicht JavaScript library waarmee je allerlei coole dingen kunt doen.

Interessant, toch? Zowel jij als de ontwerper willen graag experimenteren. Jullie zijn beiden op zoek naar nieuwe ideeën. Zou het niet veel beter zijn als jullie allebei experimenteren met dezelfde dingen? 

Houd contact met je ontwerpers

Er zijn een aantal dingen die je zou kunnen proberen. Allereerst: zorg er voor dat je contact houdt met je collega's die ontwerp doen, vooral tussen projecten in, als er geen (tijds)druk is. En steeds als je een interessant nieuw iets leert, zou je ze er over kunnen vertellen. “Hee kijk, ik heb ontdekt hoe ik deze mooie animaties kan maken!” Of “Hee, wist je dat ik nu verloopjes kan maken met CSS, zodat ik er nu niet meer zo ongelukkig van word als je ze gebruikt in je ontwerpen?”

Met een paar collega's heb ik de website Achter het Scherm, een serie interviews over hoe mensen samen aan webprojecten werken. Voor deze website hebben we de afgelopen tijd gesproken met een aantal ontwerpers en ontwikkelaars, en ze gevraagd hoe ze elkaar op de hoogte houden van nieuwe ontwikkelingen. En ze hadden een paar erg goede ideeën, die jij ook zou kunnen gaan toepassen, als je dat nog niet doet.

Sommige bedrijven hebben bijvoorbeeld een e-maillijst voor alle medewerkers. Sommige teams houden regelmatig korte bijeenkomsten waarbij iedereen laat zien waar ze mee bezig zijn en wat ze de laatste tijd geleerd hebben. Sommige organisaties hebben multidisciplinaire weblogs. Sommige gebruiken online communicatiemiddelen zoals Slack (❤). En sommige mensen gaan gewoon naast elkaar zitten en praten over wat ze aan het doen zijn. Probeer het eens!

Denk eens na: je bent hier bij Fronteers om jezelf onder te dompelen in front-end ontwikkeling. Hoe ga je de dingen die je hier leert delen met je collega's op je werk? Als je je inspant om je ontwerpvrienden op de hoogte te houden van jouw vakgebied, zul je hopelijk merken dat ze je suggesties ter harte nemen. Dit maakt jouw werk leuker, en jullie werk zal er beter van worden.

Ik weet ook wel dat wat ik hier zeg niet nieuw is. Maar ik denk wel dat het vaker gezegd moet worden! Wij ontwerpers hebben jullie echt nodig, zelfs als we het onszelf niet altijd realiseren ;-)

Reacties

1 Rik Schennink op 23-12-2014 om 15:34 uur:
Hallo ontwerper! :-)

Goed verhaal! Al mag er van mij nog iets meer nadruk liggen op een positieve samenwerking met de front-ender. We moeten zo snel mogelijk weg zien te komen van die controlerende "kan dit" rol en veel meer bezig zijn om samen met de ontwerper toffe dingen te maken.

Waar een ontwerper iets moois ziet en het mee wil nemen in zijn ontwerp ziet een front-ender het samenspel met de achterliggende technologie. Juist het opnieuw en anders toepassen van die technologie op basis van de klantvraag is waar de winst zit.

Samen zitten, brainstormen, sparren, en daardoor niet kopiëren maar innoveren.
2 Maaike op 29-12-2014 om 17:31 uur:
Hoi Rik :-)
Ja, op zich ben ik het wel met je eens. Maar dit praatje (dat was het oorspronkelijk) ging juist over het contact buiten specifieke projecten, en waarom dat nuttig is.
3 Robert op 03-02-2015 om 17:10 uur:
Hallo ontwerperts!

Die discussie hebben wij hier intern ook: Een front-ender zou al veel eerder in het proces betrokken mogen en moeten worden om, zoals Rik het al zegt, te brainstormen en te sparren. Op die manier kun je al vroeg in het proces bepalen of bepaalde ideeën gaan werken, zowel grafisch (UX/UI) als technisch(HTML/CSS/JS).

Overigens gebruiken wij hier voor de interne communicatie zowel Spark als Skype en ik merk wel dat we veel linkjes heen en weer gooien naar elkaar onder het mom van "kijk 's hoe vet dit is". En we nemen van beide kanten ook mee in ons denken over projecten.

Kan het beter? Natuurlijk, maar het moet wel in het gehele proces zitten en niet afhangen van enkele mensen die goede intenties hebben en de lat hoger willen leggen. :)
Plaats een reactie