Project

3D Point Cloud Annotation Tool

Human-Computer Interaction (HCI) project with Singapore Management University (SMU)

During my time as a research assistant with Professor Kotaro in SMU, I got the privilege to work with a team of research engineers and PhD students to design and build a 3D point cloud annotation tool to assist one of the PhD research projects.

After the finalising on the design , I was tasked to convert the design to code on React.js using Tailwindcss framework.

Info

Role

Product Designer

Timeline

2 weeks

Tools

Figma
React.js
Overview

Problem

How can we redesign the current interface for ease of navigation and make the interface aesthetically-pleasing?

Outcome

I led the design initiative, worked with the Professor and research engineer to revamp the interface and improve the user flow.
Main Takeaways

Reflecting on the project outcomes

My experience working with the team has been both enlightening and challenging. It provided me with valuable insights into the world of research engineering. Here are some takeaways:

01
If you want to learn to swim, jump in the water

Development was never my strong suit. With limited knowledge, I often find it intimidating to take the first step. But I was lucky to be able to work with an engineer who guided me along in the process of converting design to code.

"Just do it, you will learn along the way" was a statement that he always told me. It is okay to not have all the answers from the outset. Instead, you learn as you go.

Knowing that it is acceptable to make mistakes, ask questions and learn from them without the fear of judgement has created a supportive learning environment for me.

02
Be curious, learn, practice, repeat

The learning curve, particularly for someone like me who didnt have a strong technical background, felt like a steep uphill climb.

What became my guiding light was having the curiosity to learn. The desire to understand not just the "what", "how" but the "why" behind every practices motivated me to be proactive and resourceful into digging deeper.

The harder the challenge, the more rewarding it gets. Be willing to become an amateur in a new field and that is where growth happens.
Competitive Analysis

Learning from existing annotation tools

Experiencing the platforms out there gave me a better understanding of the user flow. I closely observed how users navigated through various annotation processes, gauging their preferences, pain points, and moments of friction. 

Ideate

Low fidelity - sketches, ideas & flows

The design system and features have been finalised and my challenge was adhering to the specific constraints given to me.

I sketched out the user flows and ideas to solidify my thoughts.

lofi sketch
Prototype

Iterating Wireframes

After some initial sketches, I started iterating with different versions of the wireframes

Final Outcome

Before & After

As this tool is an internal tool, the iterations were mainly done within the team. 7 out of 7 researchers agreed that the new interface is a huge improvement!