3 months
Simplifying Task Navigation
Enhancing user experience of the GRC (Governance, Risk, and Compliance management) web application for easy task discovery and completion.
UX Design
UX Navigation
Company Project
Enhancing user experience of the GRC (Governance, Risk, and Compliance management) web application for easy task discovery and completion.
StandardFusion is a GRC (Governance, Risk, and Compliance management) software company in Vancouver. They offer companies the ability to eliminate high implementation and operation costs, add value to the bottom line by reducing risk and disruption before it happens, and reduce complexity wherever possible through technology and automation. I joined the team as the only designer and was guided by the Operations Manager manager and CTO (Chief Technology Officer).
It's overwhelming to navigate through a large amount of task information, and the software's intricate structure makes it more challenging. This results in a learning curve for users. Thus, a redesign for simplicity is required; this would particularly benefit new users, making it easier to identify and comprehend the tasks they need to fulfill.
StandardFusion is a comprehensive solution that supports organizations across diverse industries, including technology, healthcare, manufacturing, financial services, government, and retail, enabling Chief Information Security Officers, Auditors, Security Consultants, and IT Professionals to efficiently maintain compliance with various standards and regulations.
Improve and redesign the task management system in the existing software.
The project began with understanding the industry jargon and the existing software with the help of training call recordings. I identified and reported existing gaps in the software's demo portal by performing a UX Audit, which led to an understanding of the user flows. This process also involved a series of inquiries and discussions about potential improvements with the team. Moreover, comparative research on existing task management software further guided the project.
Project Timeline
A crucial part of the design process was identifying the information hierarchy and designing without eliminating any existing elements. The next step was to generate new concepts for future software updates. I achieved these through brainstorming, ideation, information architecture, and quick low-fidelity wireframes. Then I created Mid-fidelity mockup screens based on those concepts. The key approach included:
A central part of this process was engaging with stakeholders to understand their expectations and visions better for their clients. Moreover, I generated a series of questions for the customer management team as it was essential to understand the user insights, the nature of clients' businesses, and their task management needs.
The design process involved continuous iterations and feedback sessions to ensure the design aligned with the project scope and user requirements. I completed the project by redesigning the StandardFusion software's Task Feature through open discussions with the team, making it more user-friendly and effective. This project gave me the opportunity to learn and grow as a UX designer in a startup environment.
A UX audit systematically examines a product's usability and design to identify areas for improvement. While examining the task management system, I discovered several UX challenges.
The information structure and page layout appear disordered, especially during transitions between task pages. The current design of visual elements like dropdowns, checkboxes, and color scheme adds to the confusion.
The system's user-friendliness in creating and managing tasks needs improvement, and certain terminology contributes to the confusion. Complexity stemming from features like recurring tasks, multiple results, and task status hampers user comprehension.
Old Screens
Additionally, the software's responsiveness across various screen sizes and devices requires enhancement. There are instances where information is hidden due to content extending beyond the visible screen area, hindering user notice and access. This can result from improper layout, excessive content, or issues with responsive design. Concealed essential information can lead to a poor user experience as users may not realize more content exists, causing confusion and frustration.
Moreover, redundant or confusing features, such as similar options with different names on the same page, mislead users. Redundant features include multiple elements or functionalities serving the same purpose, cluttering the interface and hindering users from identifying the most appropriate actions. Similarly, confusing features present similar options or functions with slight variations, leading to uncertainty and hesitation when users make selections.
These challenges encompass various aspects of UX design, including information architecture, visual design, and interaction design.
Following the audit of the feature's shortcomings, it became clear that the Information Architecture needed to be revised. The inconsistent use of terminology, intricate navigational system, lack of structured progression between pages, and ambiguous display of task statuses highlighted the necessity for improvements. However, it was critical to remember that any significant changes should be rolled out gradually to avoid confusing current software users with abrupt modifications.
My refined Information architecture, driven by insights from the analysis, promoted a clear hierarchy and consistency. By developing a logical structure and maintaining a uniform language, I made navigation and task management more straightforward. This strategy improved the usability of the task features and ensured that the information was more coherent and easy to navigate. It resulted in a unified user interface, thereby enhancing overall user interaction.
Harnessing the simplicity of low-fidelity wireframes, I initiated the concept generation phase, facilitating an iterative process of discussion and refinement with my team, especially the CTO and Operations Manager. Their feedback proved invaluable, challenging me to fine-tune and rethink my initial designs, effectively creating a dialogue between us. This back-and-forth not only enriched my understanding of their needs and expectations but also helped me progressively render more accurate screens, concurrently amplifying the practicality and user-friendliness of our product.
Wireframe discussion points
The final design idea effectively satisfies the primary objectives of the project. These include creating and developing content, organizing data properly, making task creation easier, and making task details more visible. The design also makes it easier to access finished tasks and manages both task resources and results better, which improves overall operational efficiency.
To improve the existing user interface, I focused on enhancing readability, navigation, and overall user experience. Making mid-fidelity prototypes was important for evolving the interface while keeping its essential functions. Each change was grounded in a clear rationale — making key information easier to notice, reducing the number of decisions users had to make, and keeping the interface consistent and easy to scan. Below are a few selected screen samples that show the before and after state of the web app.
In the initial design, I noticed a lack of visibility for workflow states. To improve this, I added color-coded status bars, so a task's state is visible at a glance instead of requiring users to read through plain text.
Previously, the orientation of navigation arrows led to confusion due to its inconsistency across different sections. I standardized the positioning and orientation of these arrows to align with familiar, universal design conventions, promoting intuitive usability.
Within each section, I discovered unnecessary sub-section navigation arrows, particularly given the minimal descriptive text when expanded. Instead of compelling an extra click, I streamlined the interface by wrapping the text and removing the sub-section navigation. This not only simplified the interface but also improved readability.
.png)
.png)
The preview pane was initially crowded with excess information, resulting in user confusion due to a lack of clear hierarchy and an overflow of information beyond the screen boundaries. To fix this, I proposed responsive design changes, including text wrapping and a vertical flow of layout information to replace the previous horizontal layout, making the pane easier to scan and read.
The comment feature, vital for this software, was originally a pop-up, obscuring valuable on-screen information when in use. I repurposed it and changed its position, displaying a clear history of comments with timestamps alongside the users' names. This change allowed users to view all the rich information on-screen along with the comments on the right panel.
For visual clarity, I divided the sections so each one stood out distinctly from the next, making it easier for users to take in the information without missing anything important.
.png)
.png)
In the task-specific overview page, information was previously disorganized. Recognizing the need for a more logical structure, I rearranged the information based on users' consumption preferences and priorities, resulting in a more intuitive and efficient interface.
The results section, located on the right, initially had radio buttons. These buttons, however, confused users as they could be selected multiple times, contrary to their conventional single-selection usage. Recognizing the necessity for a more suitable user interface element, I evaluated alternatives, aiming for one that would emphasize completed tasks. As a result, I replaced the radio buttons with green checkboxes. This change not only adheres to UX conventions but also provides users with a visually satisfying indicator of task completion.
In an effort to create a consistent interface and enhance the overall user experience, I made strategic changes to the layout, carrying over the same patterns used in the preceding pages and features. This consistency makes the interface feel predictable rather than like a different tool on every screen, which strengthens usability and reinforces the overall brand identity.
This project was both a great experience and a significant challenge, marking a pivotal point in my growth as a UX designer and researcher. I had to handle a web app with an established user base, which called for careful and thoughtful design improvements. Diving into the new and unfamiliar territory of GRC (Governance, Risk and Compliance management) was both intriguing and enriching. Getting a glimpse of the work culture of BC tech startups further broadened my professional perspective.
Another unique challenge I encountered was gathering crucial user insights without having the direct interaction with clients. I tackled this obstacle by working closely with the customer manager, a strategy that enabled me to understand the users' needs and pain points more effectively. Throughout these experiences, the critical importance of comprehensive record-keeping – through discussion recordings, notes, and reporting – became more apparent to me. Despite the challenges, this project reinforced my dedication to user-centric design and my belief in the transformative power of UX innovation.
