ectogrid™ showroom

Crafting a showroom with interactive experiences for a shared energy solution

ectogrid™ powered by e.on is a new revolutionary way of balancing heating and cooling needs of buildings in cities. It connects the city with a flexible grid that distributes thermal energy flows between neighbors and utilizes AI and machine-learning to optimize and minimize other energy flows.

Introduction

While I was working at Block Zero we built a showroom with four concepts at the Medicon Village in Lund, where the first ectogrid™ is located. The concepts take viewers through a carefully crafted narrative with engaging experiences. My tasks included Graphic Design, UX/UI Design and Content Production.

This was my first big project and I was so excited to create something that involves combining digital and physical. During this project was challenged on a daily basis to create out of my comfort zone, think outside the box and problem solve on the spot – and I loved it. Resulting in me growing rapidly in a short time in hard and soft skills. In short I was involved in several concepts, from research to actually installing parts and presenting one of the finished concepts to stakeholders. The concept that I was involved in the most was the heart of the exhibition: the ectotable.

My role / Company
Visual Designer / Block Zero
– Concept Ideation + Visualisation
– Facilitation of Ideation Sessions + Workshops
– Graphic Design (Print)
– UX + Visual Design
– Photography + Film
– Prototyping, Building and Installing of Concepts

Duration / Year
11 months / 2018-2019

Tools
Pen and Paper
Sketch

Adobe XD, PS, AI, AE, ID
Blender
Fusion360

Team
4 Designer
1 Theatre & Performance Designer
3 Developers
1 Project Manager

Presenting a groundbreaking energy solution to the world through immersive experiences

I started at Block Zero 4 months into this project, missing a great part of the immersion & research period unfortunately. Luckily for me, my colleagues did such a fantastic job at visualising the data that I could easily catch up what I had missed. The whole project included 5 months of research and 6 months on ideating, building and installing the concepts. During this time we had several client checkpoints, ideation & brainstorming sessions, talks with the inventor and visits to the space in Medicon Village Lund.

the whole showroom in a fisheye lense

The showroom at Medicon Village, Lund

Taking heroes on narrative journeys through roleplaying

Previous to my start the design team had an intense research period. After reading up on all the research I assisted in crafting a narrative suited for a diverse audience – taking visitors on a journey through vision and innovation to reality and implementation of the grid. This is what we called the Hero Journeys and even did some roleplays, transforming the whole office into a fake showroom – and wore hats! Unfortunately I have lost a lot of pictures of this time, because of a computer that gave up on me. After wearing hats and roleplaying for a bit we identified problem areas. For this case study I translated them into How might we… statements – because I enjoy the format and it helps telling the projects story:

Problem Statement

How might we…

Buyers and decision makers are unfamiliar with this new innovation and are not sure if it is worth to invest.

…establish trust and credibility in the brand and product?

Buyers and decision makers are curious but hesitant about investing into new unfamiliar sustainable solutions. Their decision to purchase this solution can make a great positive impact on global warming.

…explain and communicate the importance of this new innovation’s impact and monetary benefits?

Technical engineers that influence buyers and decision makers do not consider this a new or innovative solution – comparing it to others and losing interest.

…showcase that this innovation is a completely new and patented while explaining how it works in a simple, yet interesting way?

Buyers and decision makers consider this product a hypothesis and not a proven concept which makes them less likely to buy.

…present already installed and functioning grids to prove the concept of this product?

Utilizing maximum creative brain power

This was of course a very long project and we had several workshops and ideation sessions together. Some included playing with lego recreating the physical space, some with printing out inspiration and drawing our own concepts, some with going to actual exhibitions for inspiration. I really enjoyed the time we had ideation sessions just coming up with solutions and different ideas and nothing was too crazy. It felt like everything is possible. The entire office was consumed by this project, having papers, prototypes, sticky notes and drawings everywhere.

people sitting around a desk with showroom ideas in the middle

Ideation workshop

Showroom in lego

Physical space in lego

Visualisation in its many shapes and forms

Visualising ideas and concepts was a big part of my responsibility. This could be in many different ways: renders, illustrations, videos, photos, drawings – you name it! I both visualised my own concept ideas and those of colleagues, some only to an early internal stage and others were taken further into more sophisticated forms to present ideas to clients.

Table shell design sketch

Render of showroom

projection mapping concept

Projection mapping concept (Photoshop)

Wall design sketch of phased challenges

Building and installing the four selected concepts

After visualising ideas, the concepts went through a process of approval with stakeholders mixed with estimating budgets and timelines and some “finding contractors that can actually build what we want or should we just do it ourselves?” sprinkled on top. Each designer took on one concept and took ownership over it, from concept idea to installation. Above all this was to ensure that everybody knew what their role and responsibility was, but of course still helped each other in lots of ways. The four concepts that are now at Medicon Village are: Phased Challenges, Inventors Table, The ectotable and Wall of Proof.

Final Showroom

While I did design parts of other concepts like book covers for the Inventors Table or the wall design of Phased Challenges I wanted to focus and talk more in depth about the concept I worked on most:

The ectotable – showcasing a new innovation as an interactive experience

How an ectogrid™ operates and how it works together with its brain – the ectocloud – is incredibly complex as you can imagine. Knowing there would be guided group tours, where every group consists of different types of visitors, we knew it would be important to keep for example a technical engineer entertained just as well as a journalist. This meant getting the technical details right but making the basic idea simple and clear. And it should be fun of course!

This concept arose after simplifying how a grid balances heating and cooling together with the inventor, Pär – this guy knows a lot! It started out with the idea of just having a screen, but then we decided to add the informative display screens to the setup. The hardware setup consists of a table with a 55″ LG screen, 3 walls with individual display screens and 11 handmade buildings.

Whole ectotable setup at Medicon Village

To explain the conceptual idea behind the ectotable to the clients I created this storyboard:

ectotable storyboard

Intriguing through carefully visualised and layouted data

This was the first time I had to visualise an immense amount of data. I wanted to ensure having good white black space , visual hierarchy and grouping elements according to human perception. Most importantly my focus was to avoid “fluffy” data, and make it interesting when closer inspected. Therefore I researched a lot of dashboards and screens and created several iterations of the wireframes. Together with another designer I created a flow-chart and developed a prototype for the table to test out the interaction design, which helped a lot to figure out how exactly the table should behave. 

Since it was not a text heavy design, I went for a dark theme because the showroom was going to be in the majority very white and bright. The contrast of the brand colors – especially the blue – was a lot higher on black than on white. I wanted the graphs to really stand out – enabling the user to focus on information quickly while switching their gaze between table and screens. 

High fidelity mockups

Table UI – 1st iteration

Prediction display screen

Inviting interaction through curiosity

I could talk about these buildings all day, but I will keep it short here, because this case study is getting long (but ask me about them!). I really wanted to create physical components that you just want to pick up and place and see what happens. Therefore I spent some time researching materials and chose concrete, because of its weight, the connection to urbanisation and the fit to other materials used in the showroom. To achieve concrete buildings I modeled them in Blender, 3D printed them and made reusable silicone moulds, where I then poured in the concrete, let it harden and remove them from the mould. To accurately model the bases I used Fusion360 and then they were 3D printed out of conductive, black filament. The screen recognises which building type is placed by calculating the vertex angle of the feet.

All building sets that exist are handmade and designed by me. 

Render of all building types and base with feet

failed attempt

Failed attempt 🙂

Finished small set

Making of silicone mould

Supporting complex interactions with motion

To support users in understanding the complexity of the product quickly we used a lot of subtle animation to explain what is happening. You can see energy flows changing speed and direction, energy consumption growing and shrinking and buildings being placed and taken away.

Table motion graphics

Future by Lund wrote an article about the showroom (in swedish):

———

Outcome

Reflecting on this project it is insane the amount of work and love we put into every single detail. We were on hands on knees building things, finding materials online, prototyping, testing and finally installing. I loved creating this showroom, and would love to design more where physical & digital meets.

The ectotable has almost become its own product with six exact replicas all over the world in Sweden, Germany, USA, England and China – each and every one with a set of buildings that I handmade. Several of them are in Microsoft Experience Centers as also mentioned in this article. 

Lessons learned

Start somewhere

In this project I had to step out of my comfort zone every day. After a few shocks I realised that just starting or just getting on it is the best solution instead of freezing and being concerned with ?I don?t know how?. It made me quite fearless with new challenges and being thrown into cold water – or simply not knowing.

Documentation: a necessary evil?

How many confusing hours we could have saved with better documentation. This project was quite long, and also a new area for most, and sometimes we could not remember what was decided on in the early months. I am taking that into every new project and document decisions, processes and agreements – conveniently that also helps with writing case studies!