SDN UX Event 16 maart 2010

 
22 maart 2010

Op 16 maart organiseerde SDN een UX Event in het Achmea Eureko Conference Center in Zeist. In twee uur lieten Jeroen Houben en Patrick Plaggenborg van Lost Boys zien hoe je in korte tijd een kleine webapplicatie kunt maken. Waar het hierbij vooral om ging is de interactie tussen front-end design en back-end programmeren. Deze twee werelden liggen meestal uiteen, omdat ontwerpen een typische alfa-, en programmeren een typische bèta-aangelegenheid is. Hoe kun je die het beste combineren?

Radio 538
De twee Lost Boys begonnen met uitleggen aan welke projecten zij hebben gewerkt. Er werd vooral stilgestaan bij een webapplicatie voor Radio 538 waarmee de DJ’s van die zender gemakkelijker files kunnen voorlezen. Het verschil met de oude is dat de nieuwe applicatie filelengtes toont in aantal minuten vertraging. Dat is niet direct wereldschokkend te noemen, maar wel dat de nieuwe applicatie volledig is aangepast aan de wensen van de DJ’s.
Omdat de oude applicatie van de VerkeersInformatieDienst niet erg handig was, werd de nieuwe helemaal opnieuw opgebouwd. De DJ’s hadden via hun producer veel inspraak. Omdat er Agile werd geprogrammeerd kon tijdens de bouw steeds worden getoetst of Lost Boys op de goede weg zat.
Eerst leek het handig dat de site automatisch updates binnenhaalde, maar al snel werd dat aangepast omdat het vervelend is dat de pagina verspringt terwijl een DJ net bezig is de files voor te lezen. Nu laat de site zien dat er een update beschikbaar is, maar de DJ moet dan zelf op een knop drukken om de actuele verkeerssituatie binnen te krijgen.
Ook een balk bovenin het scherm, waarin werd getoond dat er een spookrijder was gesignaleerd ketste af omdat dat in de praktijk nauwelijks voor bleek te komen. De schermruimte kon beter worden benut zonder die balk met waarschuwingen.
In eerste instantie was het gewenst dat de files naar Word konden worden geëxporteerd, zodat de lijst kon worden uitgeprint om te worden voorgelezen. Ook dit werd niet meer gebruikt. De verkeersinformatie bleek namelijk goed van het scherm te kunnen worden gelezen, en de DJ die toch liever van papier las (bijvoorbeeld om eigen intonatietekens toe te voegen) kon ook gewoon de webpagina afdrukken. De knop ‘exporteer naar Word’ bevat nu alleen nog de melding ‘kopiëer de filemeldingen en plak ze in Word’.

Demonstratie: een web-poll
Na de koffiepauze demonstreerden Jeroen en Patrick hoe je snel een simpele webapplicatie bouwt, die er ook nog eens (redelijk) aantrekkelijk uitziet. Patrick, de designer van de twee, zorgde meteen voor gefronsde wenkbrauwen van Jeroen, de Ruby-on-Railsdeveloper, doordat hij zei dat er aan het eind van de sessie een applicatie zou zijn waarop mensen in de zaal konden inloggen. Patrick merkte het teken van Jeroen gelukkig snel op en meteen trok hij dat Bob-de-Bouweridee* in.
Jeroen en Patrick begonnen met brainstormen over wat voor webapplicatie er zou worden gemaakt in het beschikbare uur. Al snel kwamer ze op het idee om een web-poll te maken. Een tikkeltje gestaged, dat wel, want dat hadden ze uiteraard van tevoren al bedacht. Een admin logt in om vragen en mogelijke antwoorden toe te voegen, en gebruikers kunnen dan hun antwoord op een vraag kiezen en dan meteen zien hoeveel mensen op welk antwoord hebben gestemd.
Patrick begon snel met het uittekenen van een ontwerp. Dat deed hij niet in zijn eentje, maar elke stap overlegde hij met Jeroen, zodat hij geen dingen zou ontwerpen die haast onmogelijk waren om in te bouwen in de korte tijd die er beschikbaar was om de applicatie te maken.
Na de eerste schetsen dook Patrick in Photoshop, en Jeroen in zijn Ruby-tool TextMate. Die Ruby-tool zag er erg krachtig uit, ook al was er geen spoortje WYSIWYG te bekennen. In de zaal werd er nog wat gelachen om de console-achtige interface waarmee er Ruby wordt geprogrammeerd. Jeroen: “Ik kan ook wel Notepad gebruiken, maar dat voelt wel erg archaisch.” Iemand in de zaal: “O, en dit noem je niet archaisch?” (gelach)
Nog steeds hielden ze elkaar in de gaten en bleven ze communiceren over de te nemen stappen. “Als ik hier nou een knop zou willen om door te gaan naar de volgende poll, is dat dan nog wel aan te passen in je back-end?”
Het was interessant om te zien hoe ze niet allebei op hun eigen eilandje aan de slag gingen, maar juist heel direct samenwerkten om beide trajecten – front- en back-end – in de pas te laten lopen. Deze manier van samenwerking leek ook geen extra tijd te kosten. Juist omgekeerd: omdat er goed werd gecommuniceerd ging het miniproject sneller op zijn doel af omdat er minder omwegen waren.
De zaal mocht ook meedenken en ideeën opperen. Uiteindelijk werd de applicatie dus net iets anders dan er was voorbereid. Juist deze ad hoc-aanpassingen toonden aan dat de manier van werken goed werkt om veranderingen op te kunnen vangen zonder vertraging van het project.

Algemene indruk
Het was een vermakelijke avond. De nadruk leek achteraf bezien echter vooral op het nut van Agile (versus waterval) programmeren en minder op User Experience te liggen, terwijl dat laatste juist het thema van de avond had moeten zijn. Toch bleef er genoeg stof over om te laten bezinken. UX is natuurlijk niet alleen een proces van ‘welke-knop-moet-waar-komen’. Heel belangrijk is ook dat je de klant ervan moet overtuigen dat UX een beter product oplevert en uiteindelijk geld bespaart. Dit moet je voorzichtig doen, omdat de meeste klanten zenuwachtig worden als je ze van tevoren niet kunt vertellen hoe het eindproduct er uiteindelijk uit zal komen te zien. Sterker nog, dat er nog niet eens bekend is wat het precies doet en kan. Je moet de klant zien te overtuigen van het feit dat hij een oplossing koopt, hoe die er ook uit komt te zien.

*) “Bob de Bouwer, kunnen wij het maken? Bob de Bouwer, nou en of!” Softwareontwikkelaars lijden vaak aan het “Bob-de-Bouwersyndroom” doordat ze overal oplossingen zien die in de praktijk altijd te veel tijd kosten. Hierdoor worden klanten in eerste instantie lekker gemaakt, maar achteraf is het project uitgelopen of is niet alle voorgestelde functionaliteit ingebouwd.


Werken met ?
Kijk dan bij onze mogelijkheden voor starters en/of ervaren IT'ers.


Categorieën: Project- & procesmanagement, Architectuur, Development, Professionele vaardigheden

Tags: , , ,