Motorola Contacts App (2009-2010)

I was the lead UI designer on the MOTOBLUR Contacts app versions 1.0 (CLIQ/DEXT, 2009) and 2.0 (DROID X, 2010). The Contacts app was a complete replacement of the native Android Contacts experience and shipped on all Motorola Android devices of that era.

The Motorola Contacts app was extremely innovative for the time. It was the first Android OEM to provide a unified view of the user's social graph, combining records from Gmail, Facebook, Twitter, ActiveSync, etc., into a single view of the person. We also provided communications history and status updates at both the global and individual levels.

By comparison, Palm WebOS with its similar Synergy features beat the CLIQ to market by a few months (Spring 2009). Later, Google built the unified social graph feature into Android 2.0 (Eclair) the following year (2010).

These screens are a mix of screen mockups and screenshots from an actual device. Motorola significantly changed the Contacts experience roughly once a year until Google purchased the company, then they switched over to the native Android Contacts app.

My Role: Lead UX designer, taking over an existing design. Deliverables included concept designs and wireframes.

BLUR 1.0 Contacts List - A-Z Panel

The A-Z panel was the middle of three panels. The left panel displayed a global view of communications history (including texts, POP/IMAP emails, and calls). The right panel displayed the most recent status updates across all social networks. (Early 2009; launched on the CLIQ/DEXT).

BLUR 1.0 Contacts List - A-Z Panel

BLUR 1.0 Contact Detail Screen - Info Panel

Motorola was the first Android OEM to introduce a (proprietary) method for automatically combining contact data from multiple sources (e.g., Gmail, Facebook, Twitter, ActiveSync/Outlook) into a single view, removing duplicates. On the Happenings panel, we also displayed the contact's most recent status update to lend context to the user about the contact's current activities. (Early 2009; launched on the CLIQ/DEXT)

BLUR 1.0 Contact Detail Screen - Info Panel

BLUR 1.0 Contact Detail Screen - Info Panel - All Fields

This screen mockup shows one example of every supported field in the screen. (Empty fields would be hidden if they had no data.) (Early 2009; launched on the CLIQ/DEXT)

BLUR 1.0 Contact Detail Screen - Info Panel - All Fields

BLUR 2.0 Contacts List - A-Z Panel

In Blur 2.0, we switched from the textual tabs at the bottom of the screen to red dots in the upper righthand corner. The default view of the Contacts app listed all contacts from any configured service (e.g., Gmail, ActiveSync/Outlook, Facebook, Twitter) alphabetically. (Spring 2010; launched on the DROID X)

BLUR 2.0 Contacts List - A-Z Panel

BLUR 2.0 Contacts List - History Panel

The History panel provided details about recent communications with one's entire social graph. The screen integrated phone calls, text messages, messages from Facebook and MySpace, email, etc. (Spring 2010; launched on the DROID X)

BLUR 2.0 Contacts List - History Panel

BLUR 2.0 Contacts List - Status Panel

This panel provided a quick overview of the most recent happenings in one's social circle. Status updates were listed in reverse chronological order from Facebook, Twitter, or MySpace. Recall that at this time, apps for those services were either unavailable or immature on Android. (Spring 2010; launched on the DROID X)

BLUR 2.0 Contacts List - Status Panel

BLUR 2.0 Contact Detail Screen - Info Panel

The default view showed a single unified view of the contact's details from all integrated services (e.g., Gmail, Facebook, Twitter, and ActiveSync/Outlook). Note the inclusion of the contact's most recent status update, which helped lend context to the user about that person's life. The user can swipe to either side to see recent communications history with this person or more recent social networking status updates. (Spring 2010; launched on the DROID X)

BLUR 2.0 Contact Detail Screen - Info Panel

BLUR 2.0 Contact Detail Screen - History Panel

This panel showed an integrated list of communications history between the user and this contact. Supported events included calls, texts, emails, and Facebook messages, for example. This feature was thought to be particularly appealing to enterprise users. (Spring 2010; launched on the DROID X)

BLUR 2.0 Contact Detail Screen - History Panel

BLUR 2.0 Contact Detail Screen - Status Panel

This panel showed the most recent status updates from all of the social networks associated with the contact, such as Twitter, Facebook and MySpace. Remember that at this time, these services either didn't have apps on Android at all or they were still immature. (Spring 2010; launched on the DROID X)

BLUR 2.0 Contact Detail Screen - Status Panel

BLUR 2.0 Contact Edit Screen

Notice how we merged editable fields for the same data from different services into a single form field, such as the Home phone number which was contained in both Exchange (Outlook) and Gmail. Both editable and read-only fields were labeled with their data source. (Spring 2010; launched on the DROID X)

BLUR 2.0 Contact Edit Screen

BLUR 2.0 Multi-Person Contact Picker Dialog

Various Motorola apps wanted to provide a service so that the user could select multiple Contact people at once, such as for modifying a Contact group or addressing an email. Android only offered a dialog for picking one contact at a time, so we built our own. (Spring 2010; launched on the DROID X)

BLUR 2.0 Multi-Person Contact Picker Dialog