A favorite Mozilla engineer of mine, Jeff Balogh, is building Push Notifications for Firefox, and earlier this week released a targeted demo for web developers to use to manage push notifications on Github.
Notifications are fast becoming the primary way users access websites and apps, and they are an increasingly important engagement tool for both marketers and developers.
Simple snippets of copy, notifications pack a powerful punch. They let you know relevant information, including:
- updates to online games you’re playing (you’ve got a new cow on your farm!)
- new listings in store’s or Etsy shops
- new social connection (follower, friend, etc.)
- new news from sites and media outlets
(Read Fred Wilson on Mobile Notifications for more insight)
Visit the demo site & get the Add-on
3 Bits of UX for the Demo Website
Designing With Progressive Disclosure
The brain can only process small amounts of information at a time, so we employed a technique known as progressive disclosure, which let us break down the installation process into 3 steps.
Progressive disclosure means providing users with only the information that they need in a particular moment, small doses of information helps avoid overwhelming users and increases conversion. Clear help text makes all the difference!
Hero Image
I learned this term from John and Tara, Mozilla creative. A hero image saves a page’s design, especially when you’re under the gun and need to kick something out the door fast. It’s just one big image, but it makes a nice visual statement on a simple page, and when done well makes a developer look like a designer.
Thank You Messaging & Survey Feedback
Demos aren’t meant to be full products, so we included a “Thank you” for being a tester and asked at the same time for 30 more seconds for a quick survey (2 questions), so we could create a baseline for future development.
Jeff and I did a brainstorm, and after a bit of debate, decided to hone in on one user “webdevs” would like from notifications. When creating a baseline, user surveys should be highly targeted and brief, later on when there’s more traffic and interest, it’s a lot easier to ask more users for more.
Lo-Fi Wireframes:
More on Notifications
- Urban Airship (love what these guys are doing for mobile)
- Apple – iPhone notifications UI
- Apple – Cocoa IA Blog: Getting Notified
- Apple – Mountain Lion Notification Center (preview)
- Google Chrome – Desktop Notifications for Gmail
- Standards Development – W3C Notifications
Trackbacks/Pingbacks
[...] Notifications have fast become the way users prefer to consume and interact with social content. Instead of all the long emails, I’d love to receive weekly notifications updates, similar to this. This could become an impressively valuable engagement product for Change.org. [...]