Case: Agro Energy

Making sense of charts and tables

In this screen the user adds trading commodities and re-sizes and re-arranges them with drag and drop

AgroEnergy is a subsidiary company of Eneco, the biggest energy company in the Netherlands. It focuses on supplying gas and electricity to horticultural companies, who also sell any surplus electricity that they have generated back into the market. This trading is done at the Amsterdam Energy Exchange, or AEX.

As the growing is done in greenhouses, maintaining the right temperature throughout the year whilst getting the energy supply just right, calls for an application that allows the grower to granulate the supply based on factors like the temperature outside, the growing stage of the crop, the market price for energy commodities, day of the week and yes, even the hour of the day.

Highcharts.js was the backbone for all the different graph types. I adapted the scripts to go far beyond the defaults.

To allow the grower to have a clear insight in an overview of the exchange, the design team worked closely together with the product owner and myself to come up with screens that were both clear, uncluttered and allowed for easy input of the myriads of factors needed.

I built these complex pages as prototypes, often involving a drag 'n drop, so we could test if a solution would work technically, after which they were put to a test panel of users. Once proven fine, I would help the development teams to include the HTML, CSS and Javascript in the Outsystems platform.

We went far beyond the confines of the Outsystems platform. These timelines are generated live and their appearance automatically adapted in CSS and Javascript.

See also: