🔍 Research Phase
Microinteractions are the small details that shape how we experience software. In this project, I applied them to enhance the usability of an email client. I began with a comparative SWOT analysis of Apple Mail, Gmail, and Yahoo Mail to study how each handles organization and how unread emails are visually indicated.
Apple Mail stands out for its clean, minimal interface and seamless system integration. However, its method of marking unread messages, a small blue dot next to bold subject lines, can be easy to miss. And while the app offers a “Sort by Unread” filter, relying on users to manually toggle this view isn’t always practical for staying on top of incoming messages in a fast-paced inbox. Because all subject lines appear bold regardless of read state, there’s little visual contrast to help users quickly scan for new messages.
Gmail improves this by using bold text exclusively for unread messages and offering checkboxes for bulk selection and triage. Yahoo Mail also uses bold subject lines to mark unread emails and allows sorting by unread, but it lacks clear icon-based indicators. While its layout includes generous spacing and grouped sections for readability, the visual distinction between read and unread messages still relies heavily on text weight alone.
These comparisons revealed opportunities for Apple Mail to improve visual clarity and inbox organization through subtle, state-based cues, without compromising its minimalist aesthetic.
Flowchart Diagrams
Using insights from the SWOT analysis, I designed three state-based microinteractions to make unread emails easier to see while keeping Apple Mail’s simple look. Each flowchart shows how the system responds to the unread state, and how these changes work better than relying on the “Sort by Unread” button.
1: Unread Row Highlight
Unread messages appear with a soft background highlight that fades once the email is opened or marked as read.
2: Pulsing Blue Dot
A blue dot appears next to unread emails and softly pulses until the message is read, offering a continuous visual cue.
3: Bold Subject Line for Unread Only
Only unread messages display bold subject lines, while read messages revert to regular font weight for better contrast and scannability.
Microinteraction 1: Unread Row Highlight
This adds a subtle but wide visual anchor that makes unread messages easier to spot when quickly scanning the inbox. Because the highlight spans the whole row, it catches peripheral vision better than a tiny blue dot. Fading the highlight after reading keeps the interface tidy and avoids clutter, aligning with Apple Mail’s minimalist look while enhancing visibility.
View Prototype
Microinteraction 2: Pulsing Blue Dot
This adds a subtle but wide visual anchor that makes unread messages easier to spot when quickly scanning the inbox. Because the highlight spans the whole row, it catches peripheral vision better than a tiny blue dot. Fading the highlight after reading keeps the interface tidy and avoids clutter, aligning with Apple Mail’s minimalist look while enhancing visibility.
View Prototype
Microinteraction 3: Bold Subject Line
This change introduces a sharper visual contrast between read and unread states, improving scannability. Unlike the current design, where everything looks bold, this version restores the semantic meaning of text weight, allowing users to immediately distinguish unread emails by just glancing at subject lines, without having to rely on the blue dot or sort filters.
View Prototype
📝 Insights & Reflections
While Apple Mail offers a “Sort by Unread” option, it requires users to take extra steps and breaks the natural flow of the inbox. It pulls unread emails out of context, which can be disorienting,especially when users are used to scanning their inbox in order of time or sender.
My goal was to improve how unread emails stand out without changing how people already use Apple Mail. The microinteractions I designed, a soft row highlight, a pulsing blue dot, and bold subject lines only for unread messages, help users spot new emails right away, in the normal inbox view.
These changes work in the background, don’t require any extra clicks, and keep everything organized without cluttering the interface. Compared to sorting by unread, this approach feels more natural, more helpful, and more in line with how people read their emails.
Looking ahead, these microinteractions could evolve into a more personalized experience—adapting visual cues based on user behavior or urgency. For example, future versions could highlight priority senders, group unread messages by category, or let users customize how strong the indicators appear, offering more control without sacrificing clarity.
