HomeAccueil
/
Heatmap Bulk

Heatmap Bulk

How I prototyped with data to design a new kind of operational tool for small industrial installations ?
Product Type
Type de produit
Predictive tool
Main view of the proof of concept
Vue principale du prototype fonctionnel
This predictive tool needs to analyse in priority risky behaviours by looking at the temperature within the installation.
La fonctionnalité principale de cet outils prédictif est d'analyser les courbes de température et de répérer les comportements à risque de l'installation.
Company / Organisation
Entreprise / Organisation
Air Liquide
Project delivered in
Livré en
July 2018
Achieved results
Résultats
  • Data-visualisations
    My design improved the discoverability, the visibility and the readability of the data.
  • A demonstrator for Data Science explorations
    It helped visualise how the risk was assessed by the predictive algorithms.
  • Reusable component with Angular and D3
    My goal at the time was to build bit by bit a data-design system supported by redeveloped components.
Activities
Activités
  • Contextual research
  • Data analysis
  • Mock-ups with real data
  • Front-end development with Angular and D3.js

What’s a Rich Text element?

The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content2.

‍

Static and dynamic content editing

A rich text element can be used with static or dynamic content. For static content, just drop it into any page and begin editing. For dynamic content, add a rich text field to any collection and then connect a rich text element to that field in the settings panel. Voila!

How to customize formatting for each rich text

Headings, paragraphs, blockquotes, figures, images, and figure captions can all be styled after a class is added to the rich text element using the "When inside of" nested selector system.

Case Study
Etude de cas
Reading time :
Temps de lecture :
No items found.
First mock-up
At the beginning I had no data. I started to infer how the interface would look but I was mostly designing bling at that point.
At the beginning I had no data. I started to infer how the interface would look but I was mostly designing bling at that point.
No items found.
First developed prototype
When I got real data I experimented visually with it to see if my early concept was functionally relevant.
When I got real data I experimented visually with it to see if my early concept was functionally relevant.
No items found.
High fidelity mock-up
This mock-up pushed the concept further with additional views so the user can derive better knowledge from the available data.
This mock-up pushed the concept further with additional views so the user can derive better knowledge from the available data.
No items found.
Final proof of concept
This was the developed interface I delivered. It enabled the user to pinpoint a section of the curve and scroll to the second view to browse the curve with more accuracy.
This was the developed interface I delivered. It enabled the user to pinpoint a section of the curve and scroll to the second view to browse the curve with more accuracy.
<-
Home
<-
Accueil
HomeAbout meContact me
Created and developped
by Nathan Delavictoire with Webflow !
© 2023 Delavictoire Design