Inspiration

inspiration for Wikidiagrams

It's a mash up!

Wikidiagrams is inspired by many different pieces of software.

Click on the titles below to see more about the influences on Wikidiagrams.

I've been following Mike Bostock's d3 javascript library for interactive and animated graphs since back when it was Protovis.

It's got tremendous flexibility, because you work with code rather than with 'stock templates'. D3.js does not put an artificial new language on the front of javascript. Instead it provides utility functions, rather like JQuery for images, and then it gets out of the way.

Core to D3.js is the idea that diagrams are data driven. You have data, perhaps numbers that represent the heights of bars in a bar chart. Your code then tells the browser what to do with each piece of data, how each translates into a displayable thing.

D3.js also has the concept of a 'stage' and data going onto the stage or coming off of it. That is particularly good for animations of data as you change your view of the data. It's a generalisation of the idea that you have a porthole or viewport through which you view some of the data. It encourages diagrams where there is more data behind the diagram than is currently displayed.

Scratch shows that programming does not have to be hard. Children as young as 8 years old can make simple animations by clicking blocks of code together into a sequence.

One of the great themes that runs through Scratch is that fluency with spelling is not mandatory to work with code. In a more 'adult' computer language and environment, you are punished with error messages if you misspell a command word, or are inconsistent in how you spell the name of a variable. In Scratch, instead, you drag copies of commands or variable names into position. You do not have to type the names letter by letter

Scratch also comes with some basic artwork, simple clip art that can be moved around, and modified in size, colour and angle. Built in commands can detect collisions between objects and edges, giving the building blocks to build simple arcade games

Steven Wittens cares about using graphics to explain things. He has produced some wonderful tools using 3D graphics to show some aspects of how sound works.

A key library, mathbox, adds to the 3D language tools of OpenGL a more data driven approach. In many ways this is analogous to D3.js, but for 3D.

The code is harder to work with than D3.js, but the results can be stunning.

Google maps does maps superbly. The key challenge is to enable browsing of a huge amount of map data without it being overwhelming. Google's slippy map interface that supports panning and zooming in and out has become the standard.

Other features of the maps are relevant too. There is the ability to see the same map in different views (photographic or schematic). An open source project, Open Street Maps, in some ways goes further. In Open Street Maps you can choose which kinds of details to show, and so adjust the schematic map.

Quantum Country is a narrative about quantum computing. It's a hard topic, and easy to get lost. The Quantum Country essay does two important things to help with that:

  • Embedded in the essay are questions that help you check your understanding.
  • The questions use 'spaced repetition'
The 'spaced repetition' allows for you forgetting or getting confused about the meaning of some term or some detail, even though you may have got the answer right at an earlier time. It's not that unusual to be able to answer a question about some detail immediately after having been first told it, but much later, when more information has been digested, to be hazy about it.

Spaced repetition repeats a question at a later time or date, and keeps bringing back questions until you consistently get the answer right, and know that piece of information.

The Quantum Country essay builds computer based learning technology into the essay.

Inkscape is a general purpose graphics image editor, based on the SVG standard. It's open source, free for anyone to use, and the open code means that over the years a small team of people have worked on and improved it.

Inkscape is used for many still diagrams in Wikipedia.

Wikipedia needs no introduction. An encyclopedia that is free/open and collaborative has been and is transformative. The software Wikipedia runs on, MediaWiki, is open source. Anyone can run their own copy of the software and use it for some smaller collection of information

Next: The Central Idea