UI/UX Project

UI/UX for Surgical Navigation Software

UI/UX for Surgical Navigation software is a project from Breda University of Applied Sciences in collaboration with the Dutch Cancer Institute (NKI) and the Antoni van Leeuwenhoek Hospital.

The project is to explore options and design a new user interface and Enhance user experience for Laparoscopic Surgical Navigation Software.
Project State
Delivered
Development Time
9 Months
Platform
Tablet (iPad)
Team size
2 ( 1 full-time, 1 part-time)
Role(s)
UI/UX Designer
What I did

Responsibilities

Research

Part of my responsibilities in this project was research. I needed to do background research on laparoscopic surgery, surgery tools, and surgical navigation software, and I attended a liver surgery at the Antoni van Leeuwenhoek Hospital as part of my research. Apart from the background research, I’ve done research on interface designs, design tools, tablet input, and medical and commercial grade tablets. Each of these research topics has been documented, compared, and provided to the clients.

Exploring Interface Designs

Throughout the project, I’ve been exploring interface designs and creating design inspiration in the form of mood boards, sketches, color palettes, icon design sketches, icon mock-ups, and mock-ups. I took inspiration from different kinds of interfaces such as games, phone apps, tablet apps, medical apps, and webpages. I’ve drawn out interesting features in mood boards and sketches and later converted these to mock-ups and included them in my wireframe designs.

Designing the interface

As the main objective of this project, I’ve been designing and iterating upon the user interface and user experience of the surgical navigation software. To design the new interface, I went through different stages and iterated upon my work each cycle.

I started with inspirational mood boards, flowcharts, and wireframe sketches. From there I digitalized my wireframes, created wireframe prototypes, and tested these with my client contacts. When the wireframe design was approved, I explored icon design and made mock-ups of the look of the final product. As this is an ongoing research project for the next few years, my designs will be published for client use along with sufficient documentation in the way of a style guide.

Design progress
Dashboard

Icon Sketches and designs

Usability Testing

As I wanted to keep a relatively short iteration cycle, I needed to test my designs with the clients and usability experts. Together with the other team member, I’ve set up a test plan. This test plan included a methodology, usability tasks to perform during testing, test questions, metrics, and goals.

After each usability test session, my teammate and I evaluated the feedback according to Nielsen’s 10 Usability Heuristics (Nielsen, 1995) and the System Usability Scale (Brooke, 1996). The test reports included methodology, results, and recommendations with visual pointers, a reflection, and a conclusion. This report was then shared with the clients of the NKI. 

Project management and documentation

As I was the only full-time designer on this project and the goal of my contribution to the research project was not defined, I needed to do my own project management and documentation.

I started by informing myself about the research project and client requirements, which I then converted into goals, deliverables, and constraints. After the goals were set, I set up a feature breakdown and user stories and finally planned, the scope, roadmap, and pipelines. To help with the planning, I’ve used the planning poker tool and the Waterfall method (Bowes, 2014). 

During the project, I adjusted the goals, scope, and planning to accommodate the project better. These adjustments were made during set checkpoints in the project where I monitored my accomplishments, tasks, and the feedback of the client.