Overview
Understanding the Project Context
My Role
UX Research: Heuristic Evaluation, Design Systems Sprint, Competitive Analysis, Co-design Workshop, User Journey
UX Design: Ideation, Mid-fi Wireframes, Usability Testing, Hi-fi Prototypes
Project DEtails
Duration: 5 months, Aug '23 - Dec '23 Type: UX Design Apprenticeship
Team: Aashwini Vachhani, Dean Carroll, Evan Brehm, Jasmine Li, Prithvi Manjunatha Team Leads: Connor Schrank, Jarred Porter
Project OVERVIEW
OnBoard Meetings is a management software that offers tools for efficient communication, organization, and decision-making for board members within an organization.
The goal was to redesign the home page - Actions Page and optimize Approvals Page for improved user experience. The outcome was an interactive prototype of the redesigned pages and an updated design system created through an iterative design approached validated through user tests.
Solution
Proposed Platform for Improved User Experience and Performance
The process and the interfaces documented in the case study show the final outcome handed off to the development team at Ford. The interactive prototype and the interfaces below are a result of further exploration of the solution space using AI assisted coding.
Research
Exploring the Problem Space to Identify Key Issues
Through secondary research, we identified the areas of improvements in the current design of the platform.
Secondary Research
Heuristic Evaluation
#1 Actions' State Visibility - In the current design, plain text labels are used to indicate Approval states, which makes it challenging for users to identify and distinguish different statuses. The absence of a clear indication of approval status beyond the text labels leads to potential confusion and difficulty in understanding the status without close inspection, which contradicts the principle of visibility of system status.
#3 State Hierarchy - OnBoard’s current design lacks flexibility and efficiency. Users frequently have to click multiple times to access essential features. Furthermore, the Approvals state is often ambiguous, making it difficult for users to distinguish between different states.
#2 Approvals Discussion - The current Approvals interface does not efficiently utilize screen space, requiring users to click through several pages to access the voting discussion violating the heuristic recognize rather than recall. Approvals in draft state are prioritized over open Approvals in terms of visibility. This does not adhere to industry best practices and violates the heuristic of consistency and standards.
User Journey Map
While the Approvals feature serves admins, contributors, and readers, our redesign prioritized board members. Board members oversee management and strategic direction and their needs include casting votes, participating in discussions, and viewing voting results.
Primary Research
For the co-design workshop, we recruited board members from Purdue University Communities to interact with the product and perform tasks on OnBoard to actively involve users and gain insights into their perspectives.
Co-design Workshop Takeaways
Customization Needs - The interface required more customization options, such as filters to improve the browsing experience.
Inefficient Use of Screen Space - Organizing the content prioritizing information hierarchy and could help guide user actions more effectively.
Lack of Visual Hierarchy - Implementing tags for better categorization and visualization to improve usability for existing and new users.
Ideation
How Might We Address the Pain Points in the Current Actions and Approvals through Our Redesign?
Current Design
The current OnBoard Approval page lacks detailed information on available actions and filtering and sorting options, making it hard for users to find open actions.
Exploring Existing Solutions through Competitor Analysis
With information architecture of the site, we ideated the homepage, contribute page, and create new board page of the platform through sketching and iterative wire-framing. Our focus was on structuring content layout and simplifying information for clarity and usability.
The current approval design lacks essential information, making it challenging for users to discern its status. The interface elements lack visual hierarcy, hindering quick glance-based identification.
Design
Proposed Design for Ford Employees
Design System
Actions Page
With our redesign, we have addressed these issues by introducing options to easily filter and sort the actions based on their states. We have also revamped the representation of actions, making it more visual and enabling members to easily identify the current state.
Approvals Page
The redesign introduces several new features and improves existing ones. The improved layout of the Approvals page makes it informative-dense by including details of votes cast, providing direct access to the discussion section, while also offering more information about each approval.
