Week 2: Van design tot development

Deze week ben ik verdergegaan waar ik vorige week vrijdag geëindigd ben: het ontwerp voor Inventis Stage! Na het uitwerken van de overige 7 pagina’s en een keurende blik van Bart kreeg ik groen licht om het ontwerp ook in mobile en tablet versies te gieten. Zo gezegd, zo gedaan. Woensdagochtend kon ik het ontwerp afronden met een minimum aan opmerkingen van Bart en Jente, en dat is natuurlijk waar we het voor doen!

Front-end

Tijd voor wat afwisseling, na het afwerken van de 24 (!) PSD-bestanden kon ik het designen even achter me laten en in de code duiken. Om mijn project zo clean en overzichtelijk mogelijk te maken heb ik beslist gebruik te maken van CSS-preprocessor Sass, met het BEM principe voor het benoemen van mijn classes. Beide geen onbekenden voor mij, maar wat opfriswerk was zeker nodig! De benaming van mijn css classes en de ordening van selectors is misschien wel het grootste probleem waar ik deze week mee heb zitten worstelen.

Bij schoolopdrachten werd er ook veel minder aandacht aan besteed. Er werden toch nooit punten gegeven op ordelijkheid of herbruikbaarheid van code, als het maar werkte! Maar in een écht project van groter formaat merk je dat het toch wel heel belangrijk is om duidelijke en onderhoudbare code te hebben. Zowel voor jezelf als voor anderen die later mogelijk aanpassingen moeten doen.

Lokale CSS held Stefan kon me gelukkig wat inzicht geven in zijn werkwijze en gaf me een heleboel tips waar ik in de toekomst zeker rekening mee ga houden. De grootste les die ik geleerd heb is toch wel dat ik mijn klasse best zo kan benoemen en ordenen zodat ik ze gemakkelijk eender waar kan hergebruiken, indien nodig met een modifier. Een modifier is deel van het BEM principe en kan handig zijn om verschillende versies van een element (vb. een knop) te maken.

Dat was het voor deze week, ik ben alvast benieuwd wat komende week in petto heeft!

1 reactie

  • Bart

    Rob,

    Ook afgelopen week was weer een interessante week. Het was aangenaam om te merken dat je vlot feedback weet te verwerken in je designs en qua ‘slicing’ ook jouw weg weet te vinden.

    Topwerk!

Reactie plaatsen

Het e-mailadres wordt niet gepubliceerd. Vereiste velden zijn gemarkeerd met *

*