I tried recategorizing information and ideating different layouts to solve the issue. I placed the “Portfolios” category into “Exams” to improve user comprehension of the relationship between “all exams” and “exams in a portfolio.” I also modified the structure, and created other subcategories to support smooth navigation and easy access, such as “Exams to Review” and “Exams Shared with You.""

Based on the information architecture, I explored different possible presentations with global and local navigations to see if we could achieve efficient access. Through the feedback from different physicians, I found that the second option had a better read path and the vertical space usage was more friendly for users, so we moved forward with it.

As for the navigation itself, in the original design, we divided information into 6 main categories and each had a main page that users could access through the global navigation bar. There was also a logo erving as home button, and an account switch feature for users to switch between different roles. In the new design, I tried to help users focus on the core resources by presenting those core categories in the first layer and others in a dropdown menu, placed the menu and the account switching control closer for access with less effort, and created subcategories for each category to support efficient navigation and easy access.

Original filter features could allow users to filter particular columns of the exam table, and save a set of filters to reuse again, but it was not so convenient as keyword search, and showing all the filters by default was a little bit overwhelming. Therefore, I persuaded the team to support keyword search. The interaction design of my early exploration – advanced search features required users to type a query first, and to click “add” button and select filter type, which was not preferred. Later, I placed the “show filter” button on the first layer and made it always accessible. In this way, users could easily access filter features, but have a clean screen without getting distracted by many filters by default.

To support both operators and reviewers to know the current status of an exam, I added one more column for exam status in the exam table. In the beginning, a progress bar was used to present three different statuses – New exam, Exam in review, and Exam published. Based on physicians' feedback, the visual representation was confusing and three statuses might not be enough. Therefore, I tried ideating different potential solutions, including using little dots to represent steps and using text and color code. I differentiated different statuses with different colors for particular roles, so when users browse through the exam table, they could quickly tell which items they need to work on. I also enhanced color contrast and took care of color blindness issues. Based on physicians' feedback, the text with color code was more intuitive and 4 steps were sufficient. I also found that having status explanation was very helpful, so eventually we moved forward with the option.

Since report and quality assurance (QA) are the main sections that both operators and reviewers need to view and take actions on in clinical scenario, I tried to present them by default, and explored different potential solutions to support a smoother read path and interaction. Among them, physicians felt that placing reports and QA before image/clip view had the best read path, and the vertical navigation for thumbnails could allow them to view more at one time, so we eventually picked this option.

In an early version, the report and QA sections were presented by default with larger space, and the exam information with less usage frequency was placed in the second layer. Based on physicians' feedback, although the small thumbnails could allow them to quickly browse through and view multiple images/clips at one time, it was hard to see image details to differentiate different images/clips. Therefore, I enlarged the thumbnails in the later version. I also polished the header section with breadcrumb (patient name for each exam plus exam ID tooltip) to support smoother navigation. Besides, I also found that physicians need to comment on not only an exam as a whole but also each individual image/clip, so I designed a comment feature to support this need as well.

After exams got uploaded to the platform, operators could see all of their exams in the Exams page. They could quickly browse through each column of the table to have an overview of the exams. If they do not know what exam status means, they could check out the explanation.

When users want to find something, if they have keywords in mind, they could use the search bar with filters as an assistance. If they do not have any keyword in mind, they could directly filter columns to access what they need.

Users could also take actions on exams with the table view, such as sharing exams.

Once operators got the exam they were looking for, they could enter the Exam Review page to review images/clips, and to edit/add annotations. Based on the condition, they could edit or fill in the exam report accordingly. They could also check out exam information when needed. Once the report has been completed, operators could submit the exam for reviewers to review.

From reviewer side, they would see the exam status changed from New to Submitted, which means they could start reviewing it. They could fill in the quality assurance (QA) form and add comments on each image/clip to give operators feedback. Once the quality assurance is completed, they could publish the exam for the operators to view and learn.