Malignancy Chart Review System
Domain: UX Design, Front End Development
Team Size:  02
Organization:  CIRG, University of Washington
Previous Image
Next Image

Malignancy Chart Review is a web based medical application developed with the Clinical Informatics and Research Group(CIRG) at the University of Washington, on creating a data entry platform for medical nurses and practitioners to record information about diagnoses of malignancy cancer disease among patients. This is a web based framework that would allow clinicians across several healthcare centers within US to record data about patients' cancer diagnoses history.

The application has evolved from an urged requirement from nurses/clinicians across various partner clinics and is intended to record malignancies data about patients depending on the sites (areas of clinics where they have been diagnosed). This web framework application is to replace the existing Microsoft Access Database form which is being used across all the participating clinics. The application would give them more robust, dynamic, intellectual and interactive UI to comfortably work with.

Team Size


My Role

User Experience Designer, Front End Developer

Tools Used

UX Design: Adobe Photoshop, Adobe Illustrator, Balsamiq
UI Development: HTML, CSS, Jquery, Twitter Bootstrap

Design Idea

The project was part of my internship of 2012 where I worked on with my supervisor to develop ui designs for a web version of the Malignancy Chart Review System. Prior, the system had been acitve on Microsoft Access Database applicaiton in small forms with a very terrible user experience and also sophisticated mechanism to register data. Hence a move a taken to develop a web version that would simplify recording of data and also provide useful feedback and opportunities to interact with triggered events.

Design Process followed

Literature Study

As I started working on the project, I went thoroughly through the Access database form and took note taking of data that seemed significant to show and data that could be complimenting the information required. Based on my study of the existing form and phone conversation with members of the team who developed the access databse form, I developed my first prototype in Balsamiq. It followed three iterations after finally got approved for development.

Currently, as we are undergoing the development, I have foreseen a couple of changes to the application. The changes are part of the breakflow of the development based on priority levels we had set with specific milestones. Some of the concepts discussed in the prototype, are still left to be built. I am excited to see the application about to go live in few weeks.

This was an interesting project to move the system from a desktop verison of Microsoft Access form to a web application providing interactive features and organizing information. As the user base is very huge, I always have to keep in mind the diverse interaction methodologies people use to enter data across all regions and create interaction patterns accordingly.

Initially, I had phone conversations with the Product Manager who briefed me about the Access project and why they wanted to shift to a web based platform. My learnings at the school about the user centered design assisted me to inform my design decisions. For quick low fidelity sketches, I used pencil skechtes and doodled various possible interfaces I could think of given the information. To communicate with the Product Managers, I used Balsamiq, a low fidelity UI wireframing tool. I illustrated my concepts and interaction via static wireframes and went into several iterations based on their feedback over phone and skype meetings. This was my first time playing with Balsamiq but I was glad to pick it up quickly and enjoyed working on it. I felt its very easy and intuitive to use and best for rapid prototyping ideas.

In terms of front end development, I work on Eclipse as the development environment with subversions to coordinate code committments and sync with the main server. As part of development, I have been writing a lot of javascript to display dynamic content on the UI. Almost all the data in the UI are dynamic and fetched as JSON array objects. The data are fetched as per demand requestsusing AJAX calls, thus incresing the efficieny of the system. Working on the development end has sharpened my coding skills and also evolved my logical and reasoning ability. I have been working closely with my teammate, a software developer, who works on the back end back defining architecture of the applicaiton. I also have been learning ways to optimize code, easy and convenient ways to find errors and how to handle them. I am very happy to be given the opportunity to continue my project extending my internship as an Interaction Designer, GSA (Graduate Student Assistant). I am highly excited at the prospect of seeing the application go live and dozens of sites using my designed application.