Code
design & create_

Find projects you can get involved with and the resources you need to start coding.

Develop your own ImpVis visualisations_

Visualisations are developed by staff and students
working in partnership.

Every visualisation starts with an idea. Perhaps you are an instructor who has identified the need for a learning tool that helps students understand a specific abstract concept in your module. Or a student who has thought of a way to visualise a topic in one of your modules in order to understand it better. In either case, the first step is to connect with us. You can send us an email or request to join our online community on Microsoft Teams. We will help you create a staff-student partnership so you can start to develop your visualisation together. Once you are ready to upload your visualisation, you will become a creator or instructor on our website. This means you can publish your visualisation ensuring easy access for your audience of learners.

Read more about the six steps of our visualisation development process below.

Looking to get involved? ?

The following projects are looking for collaborators.

Propose your own project_ ?

Create a tailor-made visualisation for your course.

As a staff member you can advertise your own visualisation idea on this page to students when you Sign up / login. Anybody can send an idea for a visualisation to the ImpVis team by clicking the button below.

Send idea>

The platforms & technology we use_

We’ve developed the online environment to be as flexible as possible, allowing you the freedom to create.

Visualisations

The visualisations are coded in JavaScript, HTML and CSS. We use JavaScript to perform calculations, plot graphics, and achieve interactivity. HTML is used to define the positioning of all the elements on the webpage and CSS to style them.

Common libraries

Our online environment is intentionally built to allow complete freedom in the libraries we use, so we can respond to new developments quickly. Commonly we use libraries such as Plotly.js, d3.js and p5.js for graphics and MathJax for rendering mathematical equations.

Template framework

Our visualisation template uses the popular Vue.js framework, enabling interactions between the various visualisation elements. We have dedicated Vue-components and Command line Interface packages, which can be accessed via the Node Package Manager.

Collaboration

We share code via GitHub repositories and connect as a community on MS Teams. This allows all of us to share tips and advice during the design and development process. Here we also share our written guidance, video tutorials, and co-write new documentation.

Code design & create_