• UX/UI
  • Flows
  • Visual design

Uon.Earth

Een half jaar stage bij een start-up die natuur beschermt, meter voor meter. Ik ontwierp de App Store-screenshots, een how-to folder voor organisaties en de eerste flows voor een nieuwe onboarding.

  • KlantUon.Earth
  • RolUX/UI design, flows, visual design
  • Jaar2025
  • TeamStage, met mijn begeleider, de oprichters en de vaste ontwerper
Bekijk live
Uon.Earth op laptop en telefoon

De vraag

Uon.Earth is een app waarmee je een vierkante meter natuur beschermt. Voor €1,20 krijg je een digitaal bewijs op je naam, een uon, en een natuurorganisatie beschermt dat stukje echt. Het doel: samen de helft van de planeet beschermen. Een sterk idee, maar niet in één zin uit te leggen. Nieuwe gebruikers snapten niet meteen hoe het werkt, en organisaties liepen vast bij het inloggen op hun gezamenlijke account, hun circle. Met de natuurtop in Belém voor de deur moest dat snel beter. De vraag: hoe maak je een abstract concept in één oogopslag duidelijk, in de App Store én in de app zelf?

Het idee: inzoomen vanuit de ruimte

Mijn eerste App Store-screenshots waren vooral mooi: heuvels met een raster van vierkante meters dat over alle schermen doorliep. Vrienden snapten daarna nog steeds niet hoe de app werkt. Een aardbol die half bedekt was met vierkante meters maakte het doel wel duidelijk, maar dat was geen echt appscherm en mocht dus niet in de App Store. In een brainstorm met een collega kwamen we op het idee dat het werd: je begint in de ruimte en zoomt bij elke swipe verder in op de aarde, met de echte appschermen erop. Zo vertelt de reeks het verhaal van de app: van de hele planeet naar jouw eigen vierkante meter.

Aanpak

Ik werkte vooral zelfstandig en op afstand, met bijna dagelijks feedback van mijn begeleider en collega's. Van de screenshots maakte ik steeds meerdere varianten, zodat het team kon kiezen uit verschillende richtingen. Bij de how-to folder ging het net zo. Mijn eerste versie, een stappenplan om accounts te herstellen, klopte inhoudelijk, maar was niet herbruikbaar. Daarom ging ik terug naar grijze blokken: eerst de structuur, dan pas beeld en tekst. Toen bleek dat alle folders in InDesign gemaakt worden, heb ik dat programma geleerd en de folder daarin opnieuw opgebouwd. Mijn grootste opdracht was de onboarding voor merken die met Uon.Earth willen samenwerken. Daar bestond nog niets voor. Ik begon met user needs en user stories, tekende per stap een user journey en ging richting wireframes. Samen met collega's ontdekte ik dat de onderliggende flow nog niet klopte. Dus terug naar de basis: een flowchart met alle stappen, keuzes en uitzonderingen.

Resultaat

Zeven App Store-screenshots in twee formaten, goedgekeurd en gebruikt in de App Store en Google Play. Daarna maakte ik er ook een Braziliaanse versie van. De how-to folder werd een format dat het team steeds opnieuw kan gebruiken, en is verstuurd naar alle samenwerkende natuurorganisaties. De onboarding voor merken is binnen mijn stage niet afgerond, maar ligt er nu als flowchart die logisch en bespreekbaar is. Daarnaast maakte ik promovideo's, app-tutorials en social content. Mijn begeleider schreef in zijn beoordeling: "Hij voelt allang niet meer als een stagiair, maar als een volwaardig lid van het team."

Wat ik nu anders zou doen

Ik zou aan het begin van elke opdracht eerst vragen welk materiaal er al is en in welk programma het moet. Bij de folder kwam ik daar pas laat achter, en moest ik hem opnieuw bouwen. En ik zou eerder een ruwe versie laten zien, in plaats van lang zelf door te werken tot ik vond dat het af was.

Vier eerdere versies van de App Store-screenshots: van heuvels en kleurverlopen naar de aarde vanuit de ruimte
Vier eerdere versies van de App Store-screenshots: van heuvels en kleurverlopen naar de aarde vanuit de ruimte
De definitieve reeks: bij elke swipe zoom je verder in op de aarde
De definitieve reeks: bij elke swipe zoom je verder in op de aarde
Eerste versie van de how-to: een stappenplan om het account van een natuurorganisatie te herstellen
Eerste versie van de how-to: een stappenplan om het account van een natuurorganisatie te herstellen
Van grijze blokken naar de definitieve folder in InDesign
Van grijze blokken naar de definitieve folder in InDesign
Onboarding: een user journey voor merken per stap, en de flowchart van de mobiele flow met alle keuzes en foutmeldingen
Onboarding: een user journey voor merken per stap, en de flowchart van de mobiele flow met alle keuzes en foutmeldingen
Bekijk Uon.Earth live
Volgende case Visual Lab