Open
Vis
May 14th–16th
2018
Conf
Paris, France

The Details

Schedule (May 16)

OpenVis Conf workshops (the day after the main program on May 16) are meant to get you hands-on with new tools and design methods, under expert guidance. You will need your laptop!

You are welcome to register for these even if you do not register for the main conference. If you are attending the main conference, you'll need to register for these tutorials separately. Workshops are the day after the main program, so you won't miss anything.

All workshops will be held on on Wednesday, May 16th, 2018 at the emlyon business school Paris campus, located opposite the Gare de Lyon at 15 Boulevard Diderot, 75012 Paris. We have posted a PDF with information on getting to the campus.

Morning, Wednesday 16 May

Qlik: Introducing picasso.js (Sponsored, free!) (Full)

Wednesday, 16 May, Morning (9 - 12h30)

picasso.js is a charting library that enables developers to compose fully interactive, responsive and powerful charts by using a declarative, component-based approach. Workshop participants will learn how to use this new chart framework to create custom, interactive and powerful charts. We will go over the benefits of picasso.js over other frameworks in the industry and share how it differs from the “established” options (D3.js, highcharts, etc.). Workshop participants will get a hands-on approach that addressing the following:

  • Components: Components are the visual building blocks that make up the chart, by combining them in various forms virtually any chart can be created. A bar chart, for example, consists of a bar layer, a continuous and a discrete axis. Add a line layer and you have a combo chart. Want a line chart with four axes? - Not a problem.
  • Extensible: picasso.js provides a plugin system that makes it easy to extend existing functionality - you can register and use custom components that play well with the existing ones, create a new theme, provide your own data parser or even register a custom renderer that outputs sketchy graphics. picasso.js uses D3.js for a lot of its functionality and strives to provide the D3 community with a way to repurpose and easily integrate their work into picasso.js.
  • Interactive: Apart from basic interaction patterns, interactivity in the form of brushing and linking is provided out of the box - drag a range on a linear axis to highlight all values that fall within that range, our use the lasso tool to highlight a cluster of points. The brushed values can then programmatically be linked and highlighted in another chart instance.
  • Responsive: By using relative units and a unique layout algorithm we can ensure the composed charts are responsive. The same configuration can be used for a full-sized chart containing details, annotations etc., as for a sparkline version - components are automatically resized or removed if they don't fit.
  • Themeable: The visual look of labels, lines, shapes, color palettes etc. can all be modified and a new theme created by just changing a few base variables that control the look and feel throughout, including plugins.

Intended Audience

Web developers

Intro to D3.js

Wednesday, 16 May, Morning (9 - 12h30)

D3.js is the industry standard for building data visualization on the web. Its power is that it does not come with a set of pre-built charts to pick from; instead, it manipulates each visual marks to create charts from the bottom up, in a highly flexible and expressive way. We will cover the main concepts of D3 so you will leave the workshop with practical examples to iterate from, and the ability to include them in modern JS framework as components. Note that as D3 has a steep learning curve, we recommend participants to already already have an experience with web development (JavaScript) and be familiar with HTML and CSS.

Topics Covered:

  • Basics of D3: Selections, Data binding, Scales, Color
  • Basic charts: Bar chart, Scatterplot, Line chart
  • Advanced D3 (preview): Animation, Interaction, Layouts

Intended Audience

Web develpers with knowledge of HTML, CSS, Javascript.

Instructor

Romain Vuillemot, Ecole Centrale de Lyon

Using Satellite Data in Visualization

Wednesday, 16 May, Morning (9 - 12h30)

Free and open satellite data from ESA, NASA, other government agencies and commercial sources is becoming increasingly available. Unfortunately, the data can be hard to find, hard to access, and hard to visualize. I will show workshop attendees free sources of data such as Landsat & Sentinel, how to manipulate common data formats, presentation techniques for true-color, false-color, and mapping of derived products (temperature, cloud cover, vegetation, etc.). I will demo techniques using GDAL, QGIS, and Photoshop. Participants will be encouraged to bring their own data, but I will also supply datasets before the workshop.

Intended Audience

Beginners, but some experience at visualization and use of the Unix command line and Photoshop would be helpful.

Instructor

Bokeh for Fun and Streaming (Cancelled)

Wednesday, 16 May, Morning (9 - 12h30)

Bokeh makes rich and interactive visualizations for browsers possible from the comfort of Python, where you are already empowered and productive. Whether it's standalone HTML pages, exploratory work in Jupyter Notebooks, or visualization web apps backed by the full power of Pandas and Scikit-learn, Bokeh tries to help you do more with less effort. In particular Bokeh can be valuable for showing streaming data from financial sources, physical sensors, or other updating feeds. In this workshop we will go beyond the basics to see how to handle streaming data in a few different ways.

Intended Audience

Python users; a little exposure to Bokeh API in advance will help.

Visualize your Data in a 3D VR world using A-Frame in WebVR

Wednesday, 16 May, Morning (9 - 12h30)

We will go over the basic concepts of virtual reality (VR), augmented reality (AR), and WebVR first. Then we will start creating very basic WebVR applications. Once we have the basics under our toolbelt, I will demonstrate how you can use the same concepts to create more complex scenes and how navigation and interaction design will be possible in WebVR using A-Frame.

Once everyone has a grasp of WebVR and A-Frame content creation, we will move into data visualization: Showing what kinds of data formats we can use, where we can host them, and how we can display them inside the WebVR scene. We will utilize A-Frame as well as D3.js's capabilities for that. We also will explore ways to interact with data in VR.

Intended Audience

Web developers (intermediate).

Instructor

Fabien Benetou, Mozilla

Observable (Full)

Wednesday, 16 May, Morning (9 - 12h30)

Observable enables joyful coding with immediate feedback, fast graphics, and the convenience of reactive programming in JavaScript. In this workshop, we will introduce Observable notebooks with a focus on authoring explorable explanations and interactive visualizations. You will learn how to transform and visualize data, and to write notebooks that go beyond static presentation by allowing the reader to explore and ask questions. Some experience with JavaScript is recommended, but you needn’t be an expert! (No D3 knowledge required.)

Intended Audience

Web developers, beginner.

Instructor

Afternoon, Wednesday 16 May

A Design-led Research Approach to Designing Data Experiences

Wednesday, 16 May, Afternoon (14h - 17h30)

In this workshop participants will learn about design-led research methods and how to use them in user research to test designs and elicit feedback.

Part 1 will be focused on theory — workshop participants will be introduced to elements, processes, principles, and tools used for design-led research activities. We will discuss the rules for preparing a successful design stimulus, running a semi-structured research interview with users or experts, and generating actionable research findings.

In Part 2, participants will engage in a hands-on exercise of planning their own design-led research engagement based on their own project (or an example project provided by the workshop leader). In this part we will try to employ as many learnings from Part 1 as possible in a real-life use case.

Part 3 will be a group critique — we will discuss participants’ work done in Part 2 to share feedback within the workshop group and reflect on everyone’s ideas.

The design-led research approach presented in the workshop was developed at Science Practice to tackle specific challenges of designing and rapidly prototyping data visualisation tools, data platforms, and mobile apps for life sciences and healthcare. Our approach has many parallels with the design sprint methodology popularised by the design team at Google Ventures.

Intended Audience

Beginners

Using Vega-Lite: A Grammar for Interactive Graphics

Wednesday, 16 May, Afternoon (14h - 17h30)

Join us to learn Vega-Lite, a concise high-level language for interactive visualization. With Vega-Lite, you can rapidly create rich interactive visualizations. Brushing & linking among scatterplots and interactive cross filtering require only a few lines of code in Vega-Lite, versus hundreds in D3. Vega-Lite is used by the Jupyter and Observable data science communities, and companies including Apple, Elastic, Google, Microsoft, Netflix, Twitter, and Uber.

In this workshop, you will learn how to create simple plots, how to build them up into layered and multi-view dashboards, and finally how to make them interactive with Vega-Lite’s grammar of interaction. There are no formal requirements to attend this workshop, besides excitement about creating visualizations—though some previous experience building visualizations will help you get the most out of the experience.

Intended Audience

Web developers and designers, beginners ok.

Instructor

Dominik Moritz, University of Washington

React for D3 Users

Wednesday, 16 May, Afternoon (14h - 17h30)

While D3 is an excellent tool for building interactive visualizations in the browser, it doesn't address the data management challenge inherent in web visualizations. As the complexity of applications scales with different types of interactions and visual encodings, it's important to provide strong scaffolding to your application.

In this workshop, D3 users will learn how to use the React framework to manage their applications. Assuming no prior React knowledge, it will cover the following skills:

  • Getting started with React
  • Keeping track of the state of your application
  • Creating visualization components
  • Integrating D3 in your React application

By using React as a framework to organize an application, participants will learn how to build visualization using more expressive and reusable code.

Intended Audience

D3 users, intermediate web developers

Instructor

Mike Freeman, University of Washington

Using GPUs to Interactively Visualize Billions of Points with MapD

Wednesday, 16 May, Afternoon (14h - 17h30)

MapD’s GPU-powered, in-memory SQL engine and analytics platform are the logical successor to CPU in-memory databases. Modern GPUs have many advantages over CPUs, including much greater compute and memory bandwidth, as well as a native graphics pipeline optimized for rapid visualization. In this workshop, Christophe Viau and Chris Henrick will show how to interactively query and visualize billions of points with MapD. Participants will learn how to use MapD’s open-source GPU datastore to scale their own interactive visualizations. To facilitate hands-on learning, each participant will be provided with a cloud GPU instance to use throughout the workshop.

In this workshop, Christophe Viau and Chris Henrick will show how to interactively query and visualize billions of points with MapD. Participants will learn how to use MapD’s open-source GPU datastore to scale their own interactive visualizations. To facilitate hands-on learning, each participant will be provided with a cloud GPU instance to use throughout the workshop.

Agenda for this half-day workshop:

  • Overview of the MapD ecosystem, from data-import to pixels in the browser.
  • Rapid prototyping with MapD Immerse.
  • A tour of MapD’s suite of open-source tools for custom visualization: mapd-charting, Mapd-crossfilter, mapd3.
  • How to build a custom visualization with data from the GPU using the MapD Javascript client, mapd-connector—demo and hands-on experimentation (includes a forkable gist + Observable notebook + github repo to quickly try this technique with your data)
  • Bonus: A glimpse at how MapD uses the visualization specification standard Vega to declaratively render billions of points server-side.

Intended Audience

Intermediate, web-savvy developers

Instructor

Christophe Viau and Chris Henrick, MapD

Build Your Own Dynamic, Detailed Map with Mapbox GL

Wednesday, 16 May, Afternoon (14h - 17h30)

TLDR: Learn to build a map like this: http://yeg-assess.dha.io

Detailed and beautiful data maps can require mapping over 100,000 polygons, but that level of detail and data can quickly become too much for standard SVG or Canvas mapping techniques. In this workshop we will explore using Javascript and Mapbox GL to create a detailed, data driven interactive map.

The workshop will cover:

  • Using QGIS to prepare your shapefile data
  • Creating layered Mapbox tilesets
  • Pulling it together into an interactive web map
  • Dynamic color changes based on interaction with the data

Intended Audience

Web developers, beginners ok.

Flourish: An Introduction for Developers (Cancelled)

Wednesday, 16 May, Afternoon (14h - 17h30)

Flourish is a new platform for data visualisation and storytelling. It allows developers to make templates from open tools (such as D3.js and WebGL) which non-coders can easily customise, update with new data, and animate between views to tell a story. In this hands-on workshop with Flourish's co-founder and CTO, participants will use the Flourish SDK to create or adapt a template and publish it online for anyone to use.

Intended Audience

Web developers

Instructor