Difference between revisions of "Knowledgebase"

From ImpVis Wiki
Jump to navigation Jump to search
Line 44: Line 44:
#[[Getting connected on Github|Learn]] about getting started on GitHub.
#[[Getting connected on Github|Learn]] about getting started on GitHub.
All our pages with guidance for setting up are listed below in alphabetical order.<categorytree mode="pages">Setting Up</categorytree>
All our pages with guidance for setting up are listed below in alphabetical order.<categorytree mode="pages">Setting Up</categorytree>
===The Visualisations template===  
===The ImpVis visualisations template===
Information about the ImpVis template created in 2020, using vue.js.


*[[Vue Components]]
Before you undertake any coding, see the template in action here: [https://impvis.co.uk/launch/impvis-layouts-v2/page1.html?collection=39 ImpVis template].
 
*[[2019 style template]]
 
*[[2017-2018 style template]]


Below are all our guidance pages for the ImpVis and the associated components, in alphabetical order.<categorytree mode="pages">ImpVis Template
</categorytree>
===The coding process===
===The coding process===
<u>''Where are all the docs about which graphics to use etc? (2019 summer team)''</u>
<u>''Where are all the docs about which graphics to use etc? (2019 summer team)''</u>

Revision as of 16:22, 27 September 2021

This page is a child of the Main Impvis Wiki Page. This is the ImpVis knowledge base; it contains all of the information ImpVis has accumulated as a community in order to design and develop effective interactive visualisations for education.

The structure of this page follows the steps of our design and development process closely.

Getting started

These are the suggested steps to take if you wish to know all about how to get involved in the ImpVis project.

  1. Read a brief overview of our design and development process (ensure to take the first step: connecting with our community).
  2. Find out how to get involved with a visualisation project.
  3. Understand what it means to work in partnership.

You can follow the links in the pages above to find out more information. Below are listed all the pages in the 'Getting Started' category in alphabetical order.

Visualisation design guidance

Where do we put the ImpVis template description?

To create an interactive visualisation for education, you will need to consider the design of your visualisation carefully from several angles. The ImpVis template implements some of our ideas so that you do not need to design your visualisation entirely from scratch. Suggested reading:

  1. Which steps to take during the design process.
  2. Familiarise yourself with the ImpVis template (hosted on the ImpVis website) so you understand how it can support your visualisation design

Below we list all our further design guidance documents alphabetically, split up into three different categories: education, graphic, and interaction design. Note that we have only just started collating our experience in this section, so not all parts are populated yet - we aim to incorporate all knowledge generated by the ImpVis module students in this Wiki going forward.

Education design

Graphic design

The ImpVis Visual Identity - Ethos

Interaction design

Guidance for coding up visualisations

The link below has technical content on how to get started with the coding side of ImpVis.

Setting up

When starting coding, these are the suggested steps to follow:

  1. Read about our programming languages and where to find some training resources.
  2. Follow this tutorial to set up your coding environment.
  3. Learn about getting started on GitHub.

All our pages with guidance for setting up are listed below in alphabetical order.

The ImpVis visualisations template

Information about the ImpVis template created in 2020, using vue.js.

Before you undertake any coding, see the template in action here: ImpVis template.

Below are all our guidance pages for the ImpVis and the associated components, in alphabetical order.

The coding process

Where are all the docs about which graphics to use etc? (2019 summer team)

Look here for tips and help on issues that may come up while you're coding. Here are some pages to get your started:

  1. Structuring your code
  2. Help on HTML, CSS, JS and JS libraries
  3. Extra comments for the developer

All our coding tips pages are listed alphabetically below.

Review and publication of your visualisation

  • Uploading
  • Review
  • Versioning
  • Creating a collection

Maintaining ImpVis

everything about how to update the component library, Rob's technical doc, YouTube videos