Project Overview: Development of an “insurance transaction history” feature for a patient intake software to streamline the process of managing insurance verifications.
Challenge: The existing system lacked a method to access historical data of insurance verifications, hindering the resolution of recurring issues and tracking of patient information.
Project Duration: 4 months
Tools Used: Sketch, InVision, Figma, Mural
Role: Product Designer. I led user research, crafted detailed wireframes and prototypes, and conducted usability testing to ensure a user-centric design.
Journey: I embarked on a four-month journey, constantly iterating and adapting to new insights and challenges.
Having defined our scope, we moved to align the team through a "How Might We" session, involving not just the team but also our stakeholders. This allowed us to not only get the team together to build chemistry early on, but also dive deeper into the problem, and quickly brainstorming ideas.
Engaging with users like Kristel, a hospital administrator, I uncovered the nuanced challenges faced by front desk staff. This insight reshaped our approach to focus on practical, user-centric solutions.
During our initial design phase, we faced a conundrum - our internal team was impressed with the first set of wireframes, but user feedback painted a different picture. Engaging with our users, such as Kristel, a seasoned hospital administrator, we uncovered a gap between our expectations and their real-world challenges. Kristel’s day-to-day hurdles were not just about navigating the software but about making critical decisions rapidly, often under pressure.
Our design needed to do more than just look good - it needed to function as a reliable tool for these split-second choices. This realization revealed a crucial need for an Excel export feature - a request from users who juggled multiple platforms and needed seamless data portability.
In response, we iterated rapidly, designing and testing an export function within weeks. However, our work was far from done. As we watched Kristel interact with the new feature, it became evident that our 'Search' and 'Filter' sections were isolated in their functions, creating unnecessary steps in her workflow. Our next iteration aimed to integrate these functions, providing a fluid, intuitive experience that matched the real-world pace of Kristel’s tasks.
My investigation into big data table designs revealed a gap between standard practices and the specific needs of our users. I had to balance aesthetics with functionality, leading to several iterations.
The initial wireframes, though well-received internally, lacked the user perspective.
The testing with seven participants was a reality check. The tasks that seemed straightforward to us were not as intuitive for users. The feedback was a mix of appreciation and crucial suggestions, such as the need for editable insurance verifications.
Integrating the ability to export data and planning to unify the "Search" and "Filter" sections were direct responses to user feedback. Adjusting alignment and white space was an ongoing process, balancing information density with readability.
While the left-aligned input fields and right-aligned CTA buttons created a clean layout, it was a constant tug-of-war between aesthetics and practicality. The color choices aimed at reducing eye strain were well-intentioned but required adjustments to cater to varied user preferences.
The decision to use vertical dividers and a lower line-height was a risk. It increased the information per screen but potentially compromised readability. This led to a dilemma - how much information is too much?
The biggest revelation was the need to step back from my assumptions. I had to embrace the messiness of the design process, where solutions aren't linear, and perfection is a myth.
The project taught me the importance of flexibility and responsiveness to user feedback. Design is not just about following a set process; it's about evolving with each challenge.
For future iterations, the focus will be on refining the balance between functionality and aesthetics, and further enhancing user interaction.
Data Table Design: The table is designed to present a significant amount of information at a glance, using a structured format that allows users to quickly scan and find specific details. The choice of alignment and typography is aimed at maximizing the clarity and readability of data, which is critical for busy administrative staff.
Color Coding: The use of red and green indicators next to the 'Result' column offers a visual cue that immediately draws attention to potential issues or successful verifications.
Filtering Options: The robust filtering feature suggests a user-centered approach to design, allowing users to sift through data efficiently. This likely evolved through iterations as user feedback indicated the need for powerful search capabilities.
Intuitive Navigation: The top bar menu is well organized, likely making navigation intuitive for the user, which is essential in a fast-paced hospital environment.
Clear Categorization: The data categorization with column headers is straightforward, which contributes to an efficient workflow for users who need to process insurance transactions quickly.
Accessibility of Actions: The placement of functional buttons like 'Export List' at the top right follows conventional design practices, which align with user expectations, making it more accessible and likely to be used.
Information Density: While the low line-height allows for more data on the screen, it can potentially make the table look crowded and reduce readability, especially for users who spend a lot of time on this task.
Color Contrast: The contrast between the text and background may need adjustment to accommodate various lighting conditions and screen types, which can impact visibility.
Visual Hierarchy: Some users might find the visual hierarchy flat, with all pieces of data competing for attention, which could lead to cognitive overload.
Adaptive Spacing: Introduce adjustable row heights or spacing options to improve readability without sacrificing data density, possibly allowing users to choose their preferred view.
User Customization: Offer more personalized layout options, such as adjustable column widths or the ability to hide/show columns, catering to the varied needs and preferences of users.
Impact: The new dashboard enhanced and simplified the insurance verification process, evidenced by an impressive 88% user satisfaction rate.
Personal Growth: This project was a journey of self-discovery, learning to embrace the chaos of the design process.
As designers, we're constantly fine-tuning our work to be inline with modern user experience trends. In this section, I will lift the curtain on the refreshed design of the E&B Transaction History dashboard. This isn't just a facelift; it's a strategic overhaul aimed at enriching user interaction and ensuring the interface feels as intuitive and as accessible as possible. I will dive into my design choices that have redefined the dashboard, making it more modern, accessible, and user-centric.
The redesigned dashboard showcases a new and improved dashboard design with several enhancements. Here's a breakdown of its strengths:
1. Modern Aesthetic:
- The use of a light theme with darker text is very contemporary and can reduce eye strain in low-light conditions.
- The navigation sidebar on the left is more aligned with current design trends, where users expect to find quick navigation links.
- A more streamlined header with clearly defined user information and notification icons presents a cleaner look and conforms to current design standards for web applications.
2. User Friendly:
- Clear categorization in the sidebar, with icons next to text, helps in quick recognition and reduces cognitive load by providing visual cues.
- The introduction of tabs like 'All', 'Verified', 'Pending', 'Denied' offers a quick filtering option, allowing users to swiftly access the desired set of data.
- The 'Add new' button is prominently placed at the top right, following Fitts's Law, which postulates that the time required to move to a target area is a function of the distance to and the size of the target; which makes its placement quickly actionable.
- The table headings are bold and legible, improving scan-ability and making it easier to differentiate between columns.
3. Accessibility:
- The contrast between the text and background has been optimized for readability, adhering to Web Content Accessibility Guidelines (WCAG).
- Use of color to indicate status (Verified, Pending, Denied) also includes text, which is helpful for those who may have difficulty perceiving color differences.
- The interface elements such as buttons and tabs have a larger clickable area, which is beneficial for users with motor impairments.
The transformation of the E&B Transaction History dashboard stands as an example of what can be achieved when modern design principles are applied with a deep understanding of user needs. This redesign, while fresh and visually engaging, is not the final destination but a stop in my journey of continuous improvement. Extensive user testing will be the compass that guides me to the final design, ensuring that the dashboard doesn’t just look better but also works better for all users.