Introduction

HEEP is a speculative design project that aims to raise awareness on the potatoes overproduction through a combination of a physical object and a digital platform.

Sections

• · Speculative context
• · Brand identity
• · Arduino and WebApp

Speculative context

As every speculative design project does, HEEP lives in its own futuristic but plausible context too. Its name stands for Holding for the Electrical Energy from Potatoes and it consists in a fictionary company that aims to solve, at least in part, the potato overproduction problem. Every year, in fact, we waste more than 57mln tons of spuds, but we also know that potatoes contain an acid that can lead to the exchange of electrons between a copper and a zinc electrodes, resulting in the production of small electric charges. Because of this specific principle, HEEP developed Qubo, a domestic electricity generator powered by potatoes. Activate your audio and watch the brand reel that sums it up down below!

Brand identity

HEEP's identity, as you've probably already seen from the previous video, aims to reach the broadest audience possible by adopting a colorful visual communication and a catchy tone of voice in its copywrite. The main goal, in fact, is involving the greatest number of people in HEEP's community, in order to save as many potatoes as possible from being wasted.

HEEP's users from all over the world are able to contribute to the cause by buying and using Qubo, powering on their favorite modules and lighting up their homes while helping the global community, at the same time, in reaching its goal.

As we can see, HEEP’s social communication embraces a colorful and ironic tone, combining transparency with playfulness to engage users and bring them closer to the brand’s mission. This witty tone can be found across all the communication artifacts from HEEP, the products' packagings and the web application, fostering a brand coherency.

Arduino and Webapp

We, as HEEP, have also realized a proper working prototype of Qubo using Arduino and other technologies such as PHP to create the relative WebApp. More specifically, I've managed to develop the software that powers it all. Here you can take a look at some pictures and code snippets from the project:

if(digitalRead(15) == HIGH) {
  if(firstLaunch) {
    sendData("api_key=" + apiKeyValue
            + "&action=ins"
            + "&sessionid=" + currentID
            + "&genkp=" + genkp
            + "&npot=" + npot);

    savedData.begin("IDs", false);
    currentID = savedData.getInt("lastID") + 1;
    savedData.putInt("lastID", currentID);
    savedData.end();

    displayFirstPage();

    firstLaunch = false;
  }
  ...
}

This is an extract of code from QuboScreen, a module of the prototype based on ESP32 (the orange one in the previous picture) that sends Qubo's electric production data to a database. The database has a key role in making the experience feel complete, in fact it stores a series of informations that every user can freely access from their personal area on heepenergia.it (which is no longer available), a sort of a WebApp optimized for mobile displays. By registering on the website, each user is able associate their personal Qubo usage session with their own account and see the statistics being updated in real time, thanks to QuboScreen and its database integration.

Down below, on the other hand, you can read a snippet of PHP code from the login page that checks users' data.

if(isset($_SESSION['userid'])) {
  header('location:user_page.php');
}

if(isset($_POST['login'])) {
  $username = mysqli_real_escape_string($conn, $_POST['username']);
  $pass = md5($_POST['password']);

  $select = "SELECT * FROM users WHERE username = '$username' && password = '$pass'";
  $result = mysqli_query($conn, $select);

  if(mysqli_num_rows($result) > 0) {
    $userData = $result->fetch_array();

    $_SESSION['username'] = $userData['username'];
    $_SESSION['userid'] = $userData['userid'];
    header('location:user_page.php');
  } else {
    $error[] = 'Wrong username or password.';
  }
};

This code, specifically, was executed when pressing the login button: in the first instance it checked whether the user was already logged in or not, and then it stored in two variables their username and password (hashed using the MD5 algorithm) in order to execute a SELECT query on the database and check the credentials. If correct, the website would have displayed the homepage, otherwise it would have shown an error message.