Internet Development & Consultancy

MindMap is a project done for the 2013 (3rd) edition of De Schoolschrijver. De Schoolschrijver is an initiative to link authors of child literature for a period of half a year to a number of primary schools in Amsterdam. In the 2013 edition 8 authors are linked to 10 schools. Amongst a lot of other stuff they read and write stories together, go on a quest to the public library, and even have their own literary event in the Amsterdam city theater. The project aims to enthuse children (and their parents) for the world of books and stories. But by working closely together with teachers and schooldirection, it also tries to intensify language- and reading lessons in primary school teaching.

The MindMap was to be used as an organisational tool at the start of the project. It should inform stakeholders at primary schools about their tasks and responsibilities in several phases of the project. To stay close to the idea of stories and adventures, and to still be able to present the MindMap as a linear sequence of steps, I decided to work it out as an oldschool Ganzenbord game. Each phase of the project is represented by an illustration on the map that visualizes the current step. By clicking on the steps of the map (or on the navigation buttons at the bottom), an info-window pops up to show each stakeholder what actions and responsibilities are required in that specific step. By clicking on the 'teacher' / 'coordinator' buttons in the info-window you can switch between responsibilities.

The target audience was most likely to be found behind older computers, so I decided to use Flash (target player 9) as the runtime for the map. Using Flash here ensures cross-browser consistency, rich interactivity, and high quality scalable graphics (the map is resizable). But for the info-window I decided to use HTML/CSS/Javascript (wrote a JQuery plugin for that and used Flash ExternalInterface for communication between Flash and the info-window). Using HTML/CSS/Javascript here massively improves layout and textformatting capabilities. Another reason for using HTML/CSS/Javascript is that I wanted the info-window to be resizable and draggable (it also reversely resizes itself when the browser window is resized), so that it's never in the way. And Flash is 'not so good' (especially player 9) at reflowing text and layout when it is resized. Also, because of the year on year success of the project and because this was the first time the MindMap was used, the content in the info-window would most likely change. Using HTML and CSS to present the information would keep it external from Flash, and thus make for easier updating and editing.