To start our prototyping process, we began sketching out some of the more complicated pages for our three user groups. While this prototyping method is lower fidelity, we found it useful because it made us think more consciously about what sorts of information is most valuable to our user groups.
We designed a feedback page a user might receive after taking a preliminary diagnosis test. Since these users are most likely unfamiliar with Parkinson's disease and unaware of their symptom severity, we focused on providing links to more informative sources and presenting their results without too much jargon or complexity.
We created a page for users to track the progression of their Parkinson's symptoms. For this user group, we assumed that they have a decent understanding of the disease and its symptoms, so we sketched a chart that allows users to switch between data attributes as they toggle between tabs. However, we still wanted the layout and the data visualisation itself to remain simple and elegant.
We focused on the home page where users have access to their patients and respective data. We thought a simple table layout would be most effective for this purpose, along with some helpful information such as the date of a patient's most recent disease progression test.
Next, we brought out paper prototypes to life using Figma to create a higher fidelity frontend model for our webpage. When making more stylistic choices about elements such as fonts and colors, we focused on keeping pages clean, simple, and professional.
After receiving feedback from a Parkinson's patient and a neurologist, we made some revisions on what information the design of our prototypes emphasized the most. For example, we were told that data on motor functions should be considered more important than speech or facial movements. We also created layouts users would see if they wanted more information behind a certain score they received.