'Iets moois neerzetten voor miljoenen Drupal-gebruikers, gaaf toch!’

Het Drupal CMS ziet er al jaren hetzelfde uit, de User Interface is dringend toe aan een nieuw ontwerp. En laat onze front-end developer Dennis Cohn daar nou druk mee bezig zijn. Samen met een paar andere designers werkt hij aan ‘Drupal’s Administration User Interface Redesign’. Tijd om Dennis wat vragen te stellen over dit belangrijke project.

‘Drupal’s Administration User Interface Redesign’, dat is een hele mond vol.

‘Het komt erop neer dat de look & feel van de complete user interface van Drupal moet worden vernieuwd. Seven, het huidige administration theme, bestaat al tien jaar en is destijds ontworpen voor Drupal 7. In de loop der tijd en bij de overgang naar Drupal 8 zijn wel kleine dingen verbeterd, maar de uitstraling is hetzelfde gebleven als toen. Vaak hoor je als argument om niet voor Drupal maar voor een ander CMS te kiezen, dat het er wat oubollig uitziet. Daar moet dus snel verandering in komen!’

Hoe kwam je in aanraking met dit project?

‘Ik wilde eigenlijk zelf een Admin theme maken omdat ik Seven niet meer van deze tijd vond. Tijdens mijn onderzoek kwam ik op Drupal.org een initiatief tegen om het design van het administration theme aan te pakken. Via Slack heb ik contact opgenomen met de initiative lead Cristina Chumillas voor meer informatie en hoe ik kon helpen. Ze vertelde mij dat er een week later een ‘sprint’ zou zijn tijdens de Drupal Developer Days in Lissabon, waar ik erg welkom was om mee te helpen… In overleg met ezCompany heb ik toen last minute een ticket geboekt naar Lissabon om daar op de Drupal Dev Days aan te haken bij de designers die waren begonnen aan het nieuwe Admin-ontwerp. En sindsdien ben ik bij het project betrokken.’

‘One More View’ interviewde Dennis op de Dev Days over het nieuwe theme →

Wat was je overweging om aan zo’n tijdrovende klus mee te werken?

‘Het is inderdaad een megaklus, er moet heel veel ontworpen worden. Aangezien het een open source framework is, ben je afhankelijk van mensen die zo’n project op zich willen nemen en er tijd voor vrij willen maken. Ik werk met Drupal en loop er vaak over te klagen, dus vond dat dit mijn kans was om er zélf iets aan te doen. Om bij te dragen aan zo’n grote verandering en iets moois neer te zetten wat miljoenen Drupal-gebruikers gaan zien. Ik kan straks zeggen, dat ik daaraan heb meegeholpen, gaaf toch!’
 

Wat houdt het project precies in?

‘Eigenlijk bestaat het hele project uit twee fases. De eerste bestaat vooral uit het verfrissen van het huidige administration theme Seven, onder de nieuwe naam Claro. De tweede fase bestaat uit een compleet nieuw, op javascript gebaseerd, administration theme. Maar op dit moment gaat het dus nog puur om het uiterlijk en om minimale wijzigingen. Als we nu ook andere dingen zouden aanpassen, wordt het project nog groter en duurt het veel te lang.’
 

Eerst de look & feel dus.

‘Ja, álle componenten die in Drupal zitten, komen er anders uit te zien. Daarom is het zo veel werk. We zijn begonnen met het definiëren van een kleurenpalet. Daar is uitgebreid onderzoek naar gedaan, want Drupal hecht veel belang aan accessibility. Kleuren moeten voldoende contrast hebben. Vervolgens zijn alle huidige componenten aangepast met de nieuwe kleuren. Natuurlijk met vallen en opstaan, want soms ben je tevreden totdat je het in een groter geheel ziet.’

Nieuw design voor Drupal's UI: Claro

Hoe werken jullie als team?

‘Het is essentieel om met elkaar te blijven communiceren, dat doen we via Hangout en Slack. Maar doordat we uit verschillende landen en zelfs tijdzones komen en we eigenlijk met te weinig man zijn, komt het voor dat er geen andere designers in de meeting zijn om een beslissing te nemen. We gebruiken ook het handige programma Figma. Daarin kun je met meerdere mensen tegelijkertijd designen. Je deelt er heel makkelijk feedback met elkaar.’ En juist op dat moment vraagt een mede-designer in Slack wat Dennis vindt van een aanpassing aan een bepaalde button. ‘Nu zie je meteen hoe het werkt. Er was een probleem met deze button, bij de focus was het contrast niet hoog genoeg volgens de WCAG. Wanneer we het design van bepaalde componenten klaar hebben, zetten we deze in de issue queue van Claro op Drupal.org, zodat mensen uit de Drupal community hun feedback kunnen geven. Soms moeten we dan weer terug naar de tekentafel, zoals met deze knop.’ Dennis plaatst een comment in Figma en keurt het nieuwe ontwerp goed.
 

Wat is de volgende stap?

‘Wanneer het design van een component is goedgekeurd, maken we op Drupal.org een issue aan of updaten we het reeds aangemaakte. Vervolgens kan iedereen dit op gaan pakken.’
 

Iedereen die dat wil kan zo’n onderdeel bouwen?

‘Ja, eigenlijk kan elke front-end developer issues van Claro oppakken. Wanneer je de html en css hebt aangepast aan de hand van het nieuwe design, bied je een patch aan in het issue en wordt deze gereviewd door de community. In totaal denk ik dat er zo’n twintig mensen meewerken aan dit initiatief, vaak op vrijwillige basis. De één heeft natuurlijk wat meer vrije tijd dan de ander, maar dat maakt niet uit. Alle beetjes helpen!’

Dennis Cohn

‘Zin om mee te helpen? Join het Drupal.org Slack kanaal #admin-ui of #admin-ui-design.’

Dennis

Wat is de planning, wanneer is Claro klaar?

‘Elk halfjaar komt een major update van Drupal uit. We streven ernaar dat Claro in de komende versie, Drupal 8.7, beschikbaar is als experimental theme zodat iedereen het kan uitproberen, feedback kan leveren en eventuele bugs kan melden. Maar er moet nog best veel gebeuren, dus of dat haalbaar is...’
 

Kortom, jullie hebben hulp nodig.

‘Ja, hulp is altijd welkom, met meer mensen is het veel sneller te doen. Daar hamerde Dries ook op.’ Dennis doelt op de blog van Drupal oprichter Dries Buytaert begin dit jaar. ‘Alleen je mening geven is ook goed, zelfs als je denkt dat je niets bij te dragen hebt. Zo ben ik ook begonnen. Dus heb je zin om mee te helpen, op wat voor manier dan ook, join het Drupal.org Slack kanaal #admin-ui of #admin-ui-design! Een contribution leveren is een stuk minder eng dan je denkt.’ 

 

Als Drupal-gebruiker feedback geven of issues oppakken?

Dat kan hier!