Style tiles zijn al geruime tijd een vast onderdeel van ons ontwerpproces. In dit artikel leggen we je graag uit wat een style tile is, waarom wij ze bij Level Level gebruiken en welke voordelen ze bieden voor het ontwerp van jouw website.

Als je aan de start van een nieuwe website staat en zaken als planning, scope en budget zijn bepaald: hoe pakken wij de volgende fase dan aan? Belangrijk voor ons is dat we met jou als klant een kick-off meeting inplannen. Hierbij gaan we dieper in op de doelgroep(en) van de website en de doelen waarmee zij je toekomstige website gaan bezoeken. Dit kunnen we bijvoorbeeld doen door een Product Vision Statement te ontwikkelen. Daarnaast staan we ook stil bij de bestaande huisstijl. Komt deze nog goed overeen met de merkwaarden van jouw merk? Of kan deze misschien een verfrissing gebruiken? Het kan ook voorkomen dat er nog geen goede visuele vertaling is gemaakt naar de online uiting van jouw merk. Ook dan is het goed om de visuele stijl nog even goed onder de loep te nemen.

Op basis van alle input en informatie uit onze gesprekken met elkaar gaan we aan de slag en maken we de eerste opzet voor de visuele stijl. Dit doen we in de vorm van een style tile.

Maar wat is dat nou, zo’n style tile?

Snel samengevat zou je kunnen zeggen dat een style tile een manier is om een bepaalde visuele stijl te communiceren naar jou als klant. Een style tile bevat diverse elementen zoals kleuren, typografie, vormen, lijnen, texturen en bepaalde UI elementen. UI elementen zijn de diverse visuele elementen op jouw website waar de gebruiker interactie mee heeft. In principe vatten we alle elementen die richting geven aan een visuele stijl samen in een ‘tile’ oftewel een ‘tegel’. Dit zorgt ervoor dat je in één oogopslag een goede indruk krijgt van de online visuele look & feel. Dit betekent echter niet dat we al helemaal volledig moeten zijn; het is slechts een verzameling van de eerste online elementen om een goed visueel beeld weer te geven.

Waarom een style tile?

Wanneer je nog geen duidelijke visuele stijl voor je website hebt staan, kan het uitwerken en ontwerpen van hele pagina’s veel verwarring scheppen. Het is daarom af te raden om te beginnen met het ontwerpen van hele pagina’s van je website. Je moet hierbij namelijk al goed nadenken over zaken als: lay-out, plaatsing van elementen en content. Erg lastig als er ook gelijktijdig nagedacht moet worden over een visuele stijl. Het zou daarom beter zijn dit te scheiden.

Waarom gebruiken we een style tile en geen andere middelen zoals bijvoorbeeld een moodboard? Een moodboard is een tool dat vaak gebruikt wordt in branches zoals advertising of interieur ontwerp. Een moodboard kan snel een bepaalde sfeer neerzetten door middel van kleuren, typografie en beeld. Echter geeft een moodboard niet een totaalbeeld van de visuele stijl. Vooral de vertaling naar online komt hier niet in voor. Er wordt niet goed getoond hoe bepaalde specifieke online elementen eruit zien. Denk hierbij bijvoorbeeld aan buttons, een nieuwsblok of een winkelmandje.

Wij kiezen er daarom voor om in de beginfase van een project style tiles te gebruiken. We zorgen er met het maken van een style tile voor dat we de focus goed kunnen leggen op een visuele stijl en dat onze aandacht niet wordt vertroebeld door zaken die in dit stadium nog niet van belang zijn, zoals het ontwerpen van diverse functionaliteiten. Kort gezegd: we scheiden functie van vorm zodat we deze nog beter kunnen beoordelen, los van elkaar. Vorm kunnen we zo goed beoordelen op gewenste uitstraling. Layout, functionaliteiten en content kunnen we dan beoordelen op de vraag: “Hoe dragen deze bij aan de gebruikersbehoeften en bedrijfsdoelen?”.

Werken wij dan helemaal geen pagina’s meer uit?

Als je nu denkt dat we alleen nog maar style tiles maken: zeker niet! We zien de style tile echt als een hulpmiddel om het ontwerpproces sneller op gang te brengen. Wanneer we de look & feel van een style tile samen met jou hebben afgestemd is de volgende stap dat we een aantal kernpagina’s (templates) gaan ontwerpen.

We kiezen ervoor om templates uit te werken omdat dit een veel effectievere manier is om straks je WordPress website op te zetten. Het is een stuk efficiënter omdat we goed kijken naar welke onderdelen we kunnen hergebruiken zodat we extra aandacht kunnen schenken aan zaken die de gebruikerservaring écht naar een hoger niveau tillen, namelijk toffe functionaliteiten en micro interacties (deze versterken de gebruiksvriendelijkheid door middel van transities en animaties). Uiteindelijk kun je door de ontworpen templates goed zien hoe de elementen uit de style tile samenkomen tot een compleet beeld en wordt het nog duidelijker hoe je website er uit gaat zien.

Komt de huisstijl van jouw website nog goed overeen met je merkwaarden of kan deze wel een opfrissing gebruiken? Of heb je überhaupt nog geen online stijl voor je website? We helpen hier graag bij! Stuur een mailtje naar mail@level-level.com of bel ons op 010 842 9259.