Black Board Learn App - Amanda's Portfolio

The image showcases multiple phones laid
flat with their screens featuring redesigned app interfaces. The designs show improved colour contrast, cohesive layout, and enhanced Humber branding.

Blackboard Learn App

The Brief

The task and objective involved refining an app's critical path through design research and user testing. The goal was to achieve significant enhancements in accessibility, usability and functionality.

Role

Designer & Researcher

Client

Humber College

Service

UX/UI Design

Tools

Adobe XD & Illustrator

The Process

This project involved multiple components that provided valuable learning experiences. I began by creating two user personas, analyzing two competitors and identifying the critical path for user testing and redesign. I chose to focus on streamlining access to the grades page within the app, I conducted user testing to uncover valuable insights, which then guided me in the wireframing process to create layouts for easier grade accessibility.

User Personas

The image portrays a user persona of a user named Laurel, displaying characteristics and traits specific to Laurel's persona and demographics.

The image portrays a user persona of a user named Brooke, displaying characteristics and traits specific to Brooke's persona and demographics.

Competitive Analysis

4 phone screens displaying the interface design of the 'Grades Companion' app, highlighting key features and functionalities for comprehensive comparison.

4 phone screens displaying the interface design of the 'Alma Schools' app, highlighting key features and functionalities for comprehensive comparison.

4 phone screens displaying the interface design of the 'Grades' app, highlighting key features and functionalities for comprehensive comparison.

4 phone screens displaying the interface design of the 'Grade Pal' app, highlighting key features and functionalities for comprehensive comparison.

Critical Path

5 phone screens illustrating the sequence of actions required within the Blackboard Learn app to access the grades page.

Usability Testing

4 phone screens documenting the steps taken by the user during testing to navigate to the grades section, providing insights into user interactions and experiences.

Wireframes

The image showcases two critical path wireframe options, each with four screens, illustrating the steps users take to access the grades section.

The Results

Initial Design

I began with this initial design for the app but I noticed that the colours and contrast weren't quite right, and that the navigation needed to be more accessible to the users. I then refined the design to address these issues.

Six screens featuring light, medium, and dark blue tones with black and white elements, illustrating the improved journey to access grades.

Final Design

Once I improved the colour contrast and added bottom navigation, I reduced the number of clicks needed to access grades by 50%. This also helped maintain a consistent branding aligned with Humber College's identity.

A close-up shot of a white iPhone resting on a MacBook, accompanied by a notebook and pen placed nearby.

Man holding his phone while in a crowd full of people.

In a close-up shot, a woman's hand is holding an iPhone, with a Macbook visible in the background, all resting on a table.

Three people around a table showing their phones to each other with the new app design on the screens.

*All trademarks, logos, and images in this portfolio belong to their respective owners and are included for educational and demonstration purposes only.