D2L BRIGHTSPACE

Email Suite Redesign

What would the perfect email experience look like? I redesign D2L’s Brightspace email interface to greatly improve clarity.

In the 4 years I spent studying at Wilfrid Laurier University (WLU), I have sent and received close to a thousand emails using D2L’s Brightspace software. My extensive experience with Brightspace has allowed me to develop a deep understanding of the pleasures and frustrations that students and staff feel.

Background

D2L’s Brightspace is the LMS (Learning Management System) of choice for many schools across Canada and the US. The LMS contains a complete suite of tools designed to provide an unparalleled online learning environment to elevate education. One key feature is the email system that connects students with instructors and classmates.

D2L’s Goal

D2L’s revenue stream as a SaaS company is from gaining and retaining clients. D2L’s primary objective to sell the Brightspace LMS to as many institutions as possible.

“We aim to create easy, flexible, and smart software that ignites the desire to learn in everyone”

Customer satisfaction is key in gaining and retaining clients. D2L can ensure that customer satisfaction is high by providing top notch service, pricing, and software. The scope of this study will focus on bringing outstanding user experience to Brightspace’s email suite.

User Goal

I consulted with Wilfrid Laurier University’s senior technology leadership and identified students and instructors as the core users of Brightspace. Through an on-campus survey I conducted, users revealed what they wish to accomplish through the email suite.

  • Browse new and old emails
  • Manipulate emails
  • Compose and reply to emails
  • Sort and organize emails
  • Manage email settings

An outstanding user experience means that users must be able to conduct the above tasks without any issues. Thus, the usability study focuses on completing the tasks above.

Usability Study Methodology

I recruited 3 WLU instructors and 5 WLU students to participate in a usability study group. I conducted live moderated studies where each participant attempts to complete the following tasks using the current email system:

  1. Browse through 3 emails on separate pages
  2. Compose a new email
  3. Reply to any email
  4. Mark an important email so it can easily be revisited later
  5. Mark an email as read and revert it
  6. Delete and undelete an email
  7. Find a specific email by class
  8. Find a specific email by sender
  9. Create a new folder and move an email into it
  10. Change and save an email setting

Participants are instructed to speak their thoughts out loud during the study. The feedback helped me pinpoint the worst offending UX issues. Here are the pain points that I have identified and my proposed solutions:

General Browsing Experience

Readability:

Pain point 1: Readability is terrible! Too much wasted space results in a wildly inefficient inbox layout. On a standard 1920×1080 screen, the total number of visible emails on landing is: Zero?

Current inbox is blocked by the viewing panel that contains nothing but “No messages selected”

Solution 1: The culprit of the readability issue is the huge “email panel” that spans the entire bottom half of the window. In addition, text in email is always displayed portrait instead of landscape. This is due to long sentences (in terms of screen width) being uncomfortable to read. My solution is rotating the email panel to portrait orientation and moving it to the side of the window. To give the landing experience more screen estate, the panel will not open until the first email is clicked.

The redesigned inbox displays 12 emails on a standard 1920×1080 screen

Sneak Peek:

Pain point 2: No preview feature means that there’s no way to see the contents of an email without opening it. 

The blue squares highlights screen estate that can be used more efficiently

Solution 2: Unused screen estate can be used to preview content of each email for improved convenience. The “Email size” feature is not used by any of my survey participants, so I removed it by default.

The redesigned email displays the first few words in an email (if available)

Button Organization:

Pain point 3: Placement of buttons and features are inconsistent and take up more space than needed. Inconsistent styling makes the features harder to digest.

Current email button and feature placement

Solution 3: Relevant buttons will be grouped together so functions are easier to access. Also looks cleaner aesthetically and easier to digest. Some functions such as the compose button are moved to other sections.

Redesigned section is more compact and fuctional

Emails Per Page:

Pain point 4: The “Show X emails per page” feature is difficult to access at the bottom of the page. If you’re showing too many emails per page and want to change it, you must scroll to the bottom. There’s no easy way to see which number of emails are currently being displayed.

Current “Show X emails per page” menu

Solution 4: The “Show X emails per page” feature is moved to the top for ease of access. A new “Showing X emails of X” feature is added for clarity.

New “Show X emails per page” and “Showing X emails of X” feature

Colourful Labels:

Pain point 5: There’s no easy way of knowing what course an email pertains to. This issue is more critical for instructors who teach multiple courses and get emails from many students. Currently a user must use the “filter” function and go through each course one-by-one.

Current “Show X emails per page” menu

Solution 5: New labelling feature that allows users to create a coloured label and link it to a course offering. Any email associated with that course will be labelled.

New “Show X emails per page” and “Showing X emails of X” feature

Pagination:

Pain point 6: Dropdown pagination is counterintuitive. It’s inconvenient to require two clicks to go to the next page.

Current “Show X emails per page” menu

Solution 6: Replace dropdown pagination with a more intuitive style. New pagination allows users to access 5 adjacent pages and skip to the last page with just one click. “Jump to page” function of old pagination is retained as a secondary menu.

New “Show X emails per page” and “Showing X emails of X” feature

Composing and Replying to Emails

Popup Windows:

Pain point 1: When composing or replying to emails, Brightspace always opens a new standalone window. 7 of 8 subjects in my study group expected and preferred it to stay on the same page.

Current “Compose New Message” window

Solution 1: The compose and reply to emails feature will now open on the same page by default. The “Popout” button is a new feature that will open a standalone compose email window. Users can change the default layout in the settings.

New “Compose” feature opens on the same page

The popout button brings back the old standalone window 

Sorting and Organizing Emails

Folder Panel:

Pain point 1: The folder list is inconsistent and hard to read. Why is the trash and address book considered a folder?

Current folder list

Solution 1: Folder panel is reorganized so that folders are separated from trash and address book. New labels feature added to this panel to provide a legend.

New folder and labels list

Managing folders

Pain point 2: There’s no easy way to create a new folder. Currently you must navigate into folder management to create a new folder. Folder management button placement is in the inbox rather than the folder panel.

Old “Folder Management” button

Solution 2: “New folder” and “Folder management” buttons added to the folder panel beside the folder list for easy access.

New “Add folder” and “Folder management” buttons

Pinning Emails:

Pain point 3: There’s no pin feature to mark an important email and keep it at the top.

Solution 3: New pin feature allows user to highlight select emails to stand out and stick to the top of the inbox.

Pinned emails are highlighted

The Flag Feature:

Pain point 4: The flag feature is underdeveloped and hard to use. Currently there’s no way to flag multiple emails without going into them one-by-one.

Current flags are all the way at the end

Solution 4: Users can now use the flag feature without having to open an email. Multiple emails can be flagged at once from the inbox.

New flag placement for and flag button

Latest Design

Aesthetics are important in achieving good organization and improving ease of use in an email suite. In order to get the most relevant feedback from my study group, I skipped my usual low-fidelity phase and created a high-fidelity wireframe.

When I presented the high-fidelity wireframe to my study group, 8 out of 8 participants thought it was much easier to understand and use. The latest design achieved the following: 

  1. Cleaner interface made the inbox more spacious
  2. Rearranged buttons and features were easier to locate
  3. Redesigned message pane made browsing and reading emails more intuitive
  4. New organization features (labels, pin) made emails easier to find

What I Learned

  • For applications where the userflow is well-defined and rigid (for example, opening an email app ALWAYS lands on the inbox), it is better to focus on how the user interacts with the system on a low-level.
  • In use cases where aesthetics means organization and therefore functionality, opting for a high-fidelity wireframe instead of a low fidelity one will yield more relevant results.
  • User experience design is not about reinventing the wheel. Assess the needs and wants of the userbase and take inspiration from existing products to create the optimal design. In this case, I adopted many design cues from Gmail, Outlook, Yahoo Mail, and more.

Next Steps

By increasing the amount of customization available in D2L’s Brightspace, it will bring it to the next level. An email suite has users with many different use cases – such as the uses of instructors compared to students. More customization will allow users to tailor the email suite specifically to their needs, further improving efficiency and ease of use.

Previous project:
Case Study: AutoTrader.ca

Next project:
Case Study: League of Legends

What Can I do for You?

Are you providing products or services with suboptimal user experience? I will use my valuable experience to pinpoint the frustrations of your users and expertly craft the optimal solution. My objective is to elevate your user experience to the next level.

    Let’s Get Rich Together. 🤝