Project Overview

Creating a website’s prototype for the radiologists, or radiation oncologists to be able to produce an appropriate report for the patient’s medical imaging automatically, and in a less time consuming way.

Project Overview

Problem Statement

The users of this project are the radiologists, or radiation oncologists who either work for a hospitals,  a private institutes, or even who are working solo
We needed a website that other than saving the security and confidentiality of the patient’s information gives this opportunity to the radiologist to be able to explain the medical image for the web page, and then an AI system produces the report. After this process the radiologists are able to modify the report manually.

Problem Statement

Users and Audiences

Hospitals, radiology institutes, and private radiology and medical imaging centres.The users are the radiologists or radiation oncologists who are working in the above mentioned sectors.In general, any physician who works with medical imaging.

Radiologists working.

Competitive Analysis

I have conducted competitive analysis by choosing two more famous companies among several companies as you might see here, and comparing them together. As veradis function was unique, the same companies with similar function were rare.

Competitor medical radiologist companies logos

Competitive Analysis, Persona, Journey Map, and Empathy Map

I have prepared a SWOT table to be able to see our strength and weaknesses and also have vision of our threats and opportunities and see how we can change the threats to opportunities.
Next I have conducted user survey and interview, and based on the input from that, I started to create personas. I also designed the journey map and empathy map for the project.

SWOT tableUser persona of the veradis radiologistsJournet mapEmpathy map

Usr Stories, User Flow, and Site Map

Based on user surveys and user interview, I've created about eight user stories. Those user stories helped me to create a user flow for each. By designin the site map I was able to have a better overview on functionality of the website and the way it was supposed to work.

User survey test pictureUser storiesUser flow sampleSite map


After creating site map, I started to sketch wireframes on paper. When I thought my sketches are meaningful, I started to make digital wireframes from those paper sketches. As the one shown on the right.
Making digital wireframes, gradually made me able to create clickable prototypes. Completing clickable prototype helped me to go through review and iterate process. In this stage, I’ve modified the clickable prototype and also added some pages such as  “Team Members”, and “Facial Recognition” section.

Wireframe SketchDigital wireframeClickable prototypeReview and iterate process

Iterate, Mental Models, Style Tile, and Mood Boards

I've started to review and the iteration process. The research on similar applications working in the same field, had several valuable consequences. For example I found that most of them are using some specific colours. I investigated about the meaning of those colours, which led me to use some special colours regarding the emotion the'll motivate.
I also investigated more about mental models and best practices. I realized that how important are the issues like "Accessibility", "Consistency", and "Visibility", and I will be extremely cautious about them.
At this time I started to create the style tile and a couple of mood boards to have a better understanding of the sense of new website.
I also conducted a typography research. Due to the hectic work of the radiologist, I had to find a simple typeface, which is legible and easy to read. Eventually I've selected "Avenir" and "Roboto" fonts for my website.

Style tileGrey mood boarPurple mood boardTypography reserch

Logo, Name, and Hi-fidelity prototype, and Usability Tests

I started to design an appropriate logo, first by sketching a couple of them on paper, and the changing them to digital format. I was in contact with the client to find the best idea in this process. You can see part of the process in photos. Eventually I created hi-fidelity prototypes, and conducted usability tests, which is always useful, and lots of new ideas comes out from it.

One of the most interesting parts of this project, was that we were dealing with patient's information confidentiality. Finally we implemented a "Facial Recognition" page, so that the security of the website increased and the radiologist, or the physician could have access to patient's information after the AI system approved their access through facial recognition.

Logo Sketch IDigital logo ILogo sketch IIDigital logo IIDigital logo IIIFinal logo

Website's Pages

In here you can see a couple of final website's pages

Page 1Page 2Page 3Page 4Page 5Page 6
New Meadow's Border