I designed a much-requested feature -- customizable notifications -- that aligned with the look and feel of the library's newly refreshed website.
Project Overview
Problem
Client
Duration
Role
Collaborators
Output
Design a much-requested feature for the library's newly refreshed website: customizable notifications
Ann Arbor District Library (AADL)
May 2018 - August 2018
Designer
Library's lead developer and deputy director
High-fidelity InVision prototype
Automated online testing built using Maze
Recommendations based on 200+ testers
Project Phase | Lesson Learned
Discovery Phase
User research had been conducted for more than a year ahead of the AADL's rollout of its new website in January 2018.
I got up to speed on the notification project by talking to stakeholders about user needs, performing a comparative analysis of other notifications systems, and by sketching a lot of interactions and flow charts.
My first designs incorporated large calls-to-action to emphasize the elements that users could and should click on but as I learned, overly large large calls-to-action can command too much visual attention.
The look and feel of designs improved when work to integrate them into established user patterns already existing on the website, such as information displayed in tables, unique roles played by buttons and links.
Lesson Learned
New designs work best when they align with existing patterns and workflows to create a holistic experience.
Ideation Phase
A subset of AADL website users wanted a high degree of control over their notifications, but the majority of users would likely keep the default settings and would be confused and overwhelmed by too many options.
I started by chunking notifications by type (notices, alerts, reminders, and subscriptions) and presenting those chunks in an expandable table. The table pattern piggy-backed off the website’s established patterned language giving it a the look and feel familiar to users.
By making the table expandable, the user could quickly drill down to the specific notification she wanted to customize without having to expose all of the options. A default notification settings was added before the table so users who wanted to keep the default settings default would clearly see the predefined option at the top of the page.
Lesson Learned
To be accessible to users, complex workflows must be simple, straightforward, and unobtrusive.
Testing Phase
Usability testing was conducted with an InVision prototype running on Maze.
The task completion rate associated with Advanced Settings was 62.9%, but of the 200+ users who completed the task, only 4.3% of users followed the expected path. While the more than half the users were able to complete the task, most did so in an unexpected way. If I had more time, I would have further explored users' expected path and adapt my design in response.
Scheduled Notifications was particularly challenging because it required grouping notifications into categories by time: Recent and Scheduled. Designs needed to keep the names and roles of these two notification categories distinct and clear.
I addressed the Scheduled Notifications challenge by incorporating tabs for secondary navigation. 80.2% of users successfully completed the task associated with these pages. 73.9% used the expected path, which means that the workflows set forth in the designs responded to users’ expectations.
Lesson Learned
Customizations must allow for complex functions but still be easy for users to understand and navigate.
Gallery
