Wimer Hazenberg - rvdegroen/notes GitHub Wiki

Table of Contents

Who is Wimer Hazenberg?

Wimer Hazenberg is from Clarify. Wimer will explain how they've build the website for the Planbureau voor de Leefomgeving. His talk will also visit topics like accessibility and requirements for governmental websites. Wimer studied IA back in his days.


Wimer is Director Interactive. After graduating he made the company Clarify. They work with information design. That's why his company is called "clariy". It's all about clarifying information.

The workflow within the company is:

  1. Consultancy
  2. Design
  3. Tech - creating the desing

The work process for a project

  1. Information Analysis - to understand the data
  2. structuring - make connections for each data (this will also decide on what you will communicate in your data visualization)
  3. Sketching Concepts - To make these concepts, you first need to know the connections between data
  4. Visual Design - Typography
  5. Development - Develop the project

What to look out for

Wimer also mentioned a few things to look out for during your project.

Accesibility | WCAG

WCAG stands for the guidelines you need to work with when creating certain projects especially when you're making something for rijksoverheid. It's all about controls and colors.

Look what is available

There were more hours needed and was expected (NIH), because they wanted to create things themselves. It's useful to look at things that already exists though.

Don't lose sight of your soal

If you go to deep then you might lose the goal of your project and you need to be careful of that(YAK).

Programs they use for development

  1. Next.js

    • It can generate with a package and put it easily online
  2. Docker

    • To generate static packages
    • It's consistent (Node, NPM)
    • Works everywhere
    • Same output for them as for us on our local computer
  3. Markdown

    • To create the content
    • Client can edit it easily
    • With a CMS it's easier to hack and it's really important for rijksoverheid
  4. Responsive Pics

    • They work with responive pics when working with a lot of images.

Planbureau voor de leefomgeving: Nature-base solutions

One project Wimer worked on was with a project with planbureau van de leefomgeving. They make scenario's to better the environment.

Example: process of this project

  1. Intake
  • Knowing the data
  • What does the client want?
  • They sent them images that were pixelated (but you have to work with it)
  1. Information Analysis
  • They usually analyse the information together with the clien, because the client really understands their own data and it helps the people from clarify to understand the data.
  • The company makes their own briefing
  • They make mind-maps
  1. Structuring
  • They do structuring usually also with the client to understand the angle: what needs to be said etc.
    1. Angle - what is the red line: what do you want to communicate?
    2. Framing
    3. Focus
  • The client wanted to take the customer in their journey (you keep getting more in depth).
  • They made a navigation flow for this.
  1. Sketching Concept
  • Clarify created several concepts and showed them to the client.
  • They show min. 2 and max. 3 and they have to differ in style (futuristic, classic, old, real).
  • Presented concepts.
  • Got feedback from client of the concepts.
  1. Visual Design
  • The next step is to put is all together.
  • You design the way it will actually look like.
  • You add the style elements in needs to be in.
  1. Development
  • You create the whole actual thing in code.
  1. Reflection
  • After each project they also have a reflection. In this project accesibility seemed too basic.