
UX/UI Case Study
I joined the training program in the Digital Twins track because they encouraged me to collaborate with partners to help them explore what they can do to achieve sustainability development. We did research to understand the context also the users and proposed solutions by creating the prospective campaign with interactive prototype experiences; a website and a smart product. In the prototypes and campaign journey, partners could already get a picture of the campaign experience and a feel of the products, and see what functions they could implement to their sustainability innovation. This helped the team to communicate the positive impacts of this project's possibility to all partners more successfully.
My Role
I helped bring empathy and user-centred design to the team and project with user research+persona, and visualise the research findings to the inspiring solutions with a user journey map. To bring ideas to life, I demo design interactions for a prospective smart product and build a high-fidelity website prototype in English and Dutch to mimic the ideal experience then test the experience with end users and collect valuable feedbacks to present to partners.
Partners
• Gemeente Amersfoort
• Tauw Group BV (TAUW)
• Hogeschool van Amsterdam
Domain
Public section
Project Type
UX/UI, Research, Branding, Digital, Interaction Design
Duration
February-June 2022
Team
Digital Twins Track under SCRUM process:
Shauna Jin
Mariana Pinheiro
Clinton Emenari
Ogulcan Temiz
Rina Horisawa
Tools
Figma | Adobe Suite | Miro | Slack | Notion
The Challenge
Urban heat stress occurs in the Netherland for only 2-3 weeks a year but it leaves a serious impact on our health such as heat stroke. An estimated 400+ citizens die from heat stress in the Netherlands every year due to Climate change. As a designer, I needed to design a compelling experience and propose engaging solutions that made the end users aware of the issue and empowered them to prevent the problems.
The Solution
The climate issue is complicated to address. While its effect on human health is what we can avoid. My design approach shifted from solving complex problems to making prevention more accessible through the campaign with an engaging digital experience to promote awareness and provide helpful information to end users. Here're the steps I needed to take:
-
doing research on the problem, the country and users to find a thoughtful solution.
-
brainstorming concept themes for collaborative selection with partners.
-
preparing and proposing the creatives and journey flows to the partners.
-
making changes to design based on discussion and user testing with teams and partners iteratively.
-
applying local language and design norms in interactive design prototypes.
The Process
In 5 months through 5 sprints under SCRUM and Design Thinking process, I worked in a multidisciplinary team with a researcher, programme manager, industrial designer, engineer, and developer. I organised to deliver my design assets successfully and supported my team with other tasks, including project presentations that needed pleasant visualisation such as data visualisation from research/testing, concept sheets, pre-read/presentation for partners, etc.


User Interview and Persona
Within 3 weeks, I participated in user research, conducting interviews with 14 homeowners in the city areas of Amsterdam and Amersfoort to understand their current experience and the effects of Urban Heat Stress. After analysing the findings, I made personas to help everyone in the team understand our users better and get on board with them. Here are some examples of the personas.


Brainstorming with Experts
To ensure that the design delivered proper solutions to end users and to learn to understand the context, in the research steps, I participated to review the findings and brainstormed with experts from different fields to explore suitable directions through Translate Session Meetings. In each meeting, I learned about the topic, enthusiastically presented the design ideas, actively asked questions, and documented the feedback from the expert to fill the gap in primary design decision-making.

Empathy Led Problem Solving
After thinking through users and research, the team brainstormed what the solutions should be from users' perspectives and I broke down what the team brainstormed into 4 design criteria.

Collaborative Ideas Selection with Partners
I visualised 5 design concepts for partners to choose to develop together. In the co-creation session, I facilitated and walked through partners each concept and asked them to vote on the concepts they found most suitable with the feedback to improve for the next steps.

The Campaign Journey Map
What are campaigns?
Campaigns are a communication strategy across channels where end users engage with the organization/company. Every campaign has an aim of whom to target, with what products to target and through what means.
These campaign flows showcased the experience that a user would engage from the start with our products to the touchpoints where the problem was addressed. I created the experience flows focusing on a digital experience: website, landing pages, digital twin of the city and the smart product’s flows.

Visual & Design Identity
I created the brand style guide and other visual assets for engaging and consistent visual communication. When using the brand elements in a correct way consistently, we can build a powerful and recognizable brand.
Here were what I designed for the branding part:
• Logo design
• UI Style guide
• Branded slide decks
• Illustration

Design, Test, and Revise
I designed an interactive mid-fidelity website and the interaction for a smart product to test them with 15 users. After receiving feedback, I revised the design based on the feedback before turning those feedback into a high-fidelity prototype.

Prototypes
Here’re the prototypes of a website in Dutch and English version.

Results
Kind words from our partner
Ruben/TAUW
Process:
-
Well-organized sessions/sprint reviews (interactive, enjoyable) by talking and discussing with each other
-
Appreciated you sending documents/pre-reads on time
Product:
-
Impressed with how professionally you picked up the project and developed a quite good product
-
Good quality steps
