Motorola
Theme Packs & User Interface Design
My first job after college was as a contractor for Motorola’s iDEN (push-to-talk) division through my employer HumanCentric. From the beginning of 2008 until that summer, I was the main designer for the iDEN division and so I worked on screen-based media on four different phones.
Since iDEN was somewhat isolated from Motorola’s central CXD group, I was given a lot of leeway in creating my own concepts and designs, based on existing media. Below is the result of that time period.
During this time, I created theme packs to match each phone’s color, material, and finish (CMF) as well as the technical and regular marketing teams’ requests. All of my theme packs started with choosing an existing wallpaper from central Consumer Experience Design’s files and then optimizing and editing it to fit the specific phone’s CMF.
I spent many weeks optimizing Arabic and Hebrew bitmap fonts for the last pre-Android flagship iDEN phone, the i9/Stature. For the same phone, I also designed an idle screen notification interface from the technical writing of the interface specification to the final production graphics. It was a very collaborative experience and I worked directly with human factors specialists, software developers, and technical marketers.
Since iDEN was somewhat isolated from Motorola’s central CXD group, I was given a lot of leeway in creating my own concepts and designs, based on existing media. Below is the result of that time period.
i776 Theme Packs (Quarter-QVGA - 128x160px)
These are concepts and my theme pack for the plain version of the i776. Each phone in the line had the same base theme, called Onyx. The plain i776 had an additional theme called Blue Ice that was I co-developed with another designer at Motorola, so while it’s not shown, the theme called Iris was my first theme pack for iDEN.
Concept 1
Concept 2
Concept 3
Tearsheet for Iris Theme Pack. Shown is the Plus version of the plain i776.
Iris theme Idle Screen
i776 (Plus) Theme Packs (Quarter-QVGA - 128x160px)
My concepts and final theme packs for the i776 (Plus). The Plus version had a different CMF as well as some upgraded internal features. Only one of my concepts was chosen, which would eventually become the Organic theme. The other themepack, Crimson, was based on a wallpaper choice by someone in marketing.
Concept 1
Concept 2
Concept 3
Tearsheet for Organic Theme Pack. Shown is the i776 (Plus) phone for which it was designed.
Organic theme Idle Screen.
Tearsheet for Crimson Theme Pack. Shown is the i776 (Plus) phone for which it was designed.
Crimson theme Idle Screen
i776w Theme Packs (Quarter-QVGA - 128x160px)
The i776w has feature parity with the i776 (Plus) save the phone’s CMF. I was told by Motorola iDEN's marketing team that the largest group of consumers for their push-to-talk phones was in Latin America and due to cultural ideas about masculinity and femininity separate phones needed to be made and marketed towards women as opposed to men.
Since the noticeable color of the i776w is it’s bright pinkish purple color, all of the user interface media and the wallpapers had to be altered from scratch to match the design of the phone.
I convinced the marketing team, internal to Motorola, that since the primary target market for these phones was Latin America, the theme pack names should be in Spanish as well as English.
Concept 1
Concept 2
Concept 3
Concept 4
Concept 5
Concept 6
Tearsheet for Dream (Sueño) Theme Pack. Shown is the i776w phone for which this was designed.
Dream (Sueño) theme Idle Screen
Tearsheet for Spiral (Espiral) Theme Pack. Shown is the i776w phone for which it was designed.
Spiral (Espiral) theme Idle Screen
i9/Stature Theme Packs (QVGA 240x320px)
The i9/Stature was created to be the thinnest and most high-end phone released by Motorola iDEN. It was the first with a QVGA (320x240 pixels) screen and 3 megapixel camera in addition to a touch-based interface on the CLI (closed lid interface). These high tech features required high tech themepacks designed to make the most of the big screen and increased interactivity available to users of this phone.
Concept 1
Concept 2
Concept 3
Concept 4
Concept 5
Concept 6
Concept 7
Concept 8
Tearsheet for Graffiti Theme Pack. Shown is the i9/Stature phone for which it was designed.
Graffiti theme Idle Screen
Tearsheet for Laser Theme Pack. Shown is the i9/Stature phone for which it was designed.
Laser theme Idle Screen
Tearsheet for Lava Theme Pack. Shown is the i9/Stature phone for which it was designed.
Lava theme Idle Screen
Idle Screen Notification for i9/Stature - Icons & Layout
The idle screen notification was intended to be a user interface that did not require direct user interaction. The notifications would be invoked by missed calls, unread messages, and un-listened-to voicemails. It would be dismissed by the user interacting with the app that controlled each type of notice.
The design brief required the creation of a new icon representing voicemail as well as a redesign of the idle screen's 2 different clock options to make use of the extra screen real estate on the i9's internal and external screens.
Finally, in collaboration with the marketing and technical teams, as well as human factors professionals at HumanCentric, I created the user interface specification documents and guided them through their final versions. This was in addition and parallel to the design and creation of the animations and graphics.
UI Sketches
Icon concepts
Digital clock layout
“Edge” clock layout
Idle Screen Notification for i9/Stature - Concept Animations - Phase 1
Edge Clock Apparition Concept
Edge Clock Drawer Concept
Edge Clock Replacement Concept
Edge Clock Shove Concept
Redesigned Edge Clock Apparition Concept
Redesigned Edge Clock Drawer Concept
Redesigned Edge Clock Pop Up Concept
Idle Screen Notification for i9/Stature - Concept Animations - Phase 2
Second Redesigned Edge Clock Apparition Concept
Second Redesigned Edge Clock Apparition (Alternate) Concept
Second Redesigned Edge Clock Drawer Concept
Second Redesigned Edge Clock Pop Up Glow Concept
Second Redesigned Edge Clock Pop Up Concept
Second Redesigned Edge Clock Replacement Concept
Second Redesigned Edge Clock Shove Concept
Second Redesigned Edge Clock Ticker Concept
Idle Screen Notification for i9/Stature - Concept Animations - Phase 3
Third Redesigned Edge Clock User Notification - External Screen
Third Redesigned Edge Clock User Dismissal - External Screen
Third Redesigned Edge Clock User Notification - Internal Screen
Third Redesigned Edge Clock User Dismissal - Internal Screen
Redesigned Digital Clock User Notification - External Screen
Redesigned Digital Clock User Dismissal - External Screen
Redesigned Digital Clock User Notification - Internal Screen
Redesigned Digital Clock User Dismissal - Internal Screen
Idle Screen Notification for i9/Stature - Concept Animations - Phase 4
Second Redesigned Digital Clock User Notification - External Screen
Second Redesigned Digital Clock User Dismissal - External Screen
Second Redesigned Digital Clock User Notification - Internal Screen
Second Redesigned Digital Clock User Dismissal - Internal Screen
Fourth Redesigned Edge Clock User Notification - External Screen
Fourth Redesigned Edge Clock User Dismissal - External Screen
Fourth Redesigned Edge Clock User Notification - Internal Screen
Fourth Redesigned Edge Clock User Dismissal - Internal Screen
Interaction Proof of Concept
Interaction Proof of Concept with Indicators
r765/r765IS Theme Packs (130x130px)
This themepack had some special requirements due to the nature of the production handset. The phone's design is mil-spec and intended to be used on private networks only, such as those used in construction and firefighting. Harsh environments don't affect the phone, especially the "IS" version, which is rated for use in explosive environments.
The sensitive nature of the work environments in which the handset would be deployed requires a highly legible screen. So I was asked by the marketing team to come up with a new themepack on short notice to improve legibility over the previous versions. High contrast and easy, clear legibility was the basic design brief. The project came in on time, with great feedback from the leads on the handset project's team. I actually hope not to see this one in person ever, as that would mean I'm really in danger…
Concept 1
Concept 2
Concept 3
Concept 4
Concept 5
Concept 6
Final theme. Due to the quick turnaround of this project I didn’t get a chance to capture the full aspect of the theme pack.
i465/Clutch Theme Packs (Quarter-QVGA 128x160px)
This was the last set of theme packs that I designed for Motorola iDEN. Shortly thereafter Motorola withdrew its external contracts in the first step of what would eventually lead to the splitting off of Motorola Mobility and it’s eventual acquisition by Google.
The i465/Clutch was the first iDEN phone with a QWERTY keyboard, geared towards younger, texting-heavy users. To that end the theme packs needed to appeal to that demographic. The process for these theme packs was quicker than the others so there wasn’t a concepting phase.
Tearsheet for the Onyx Theme Pack. Shown is the i465/Clutch phone for which it was designed.
Onyx theme Idle Screen
Tearsheet for Space Theme Pack. Shown is the i465/Clutch phone for which it was designed.
Space theme Idle Screen
Tearsheet for Street Theme Pack. Shown is the i465/Clutch phone for which it was designed.
Street theme Idle Screen
A Final Note: the previous screens are either screen captures from Motorola iDEN's internal themepack design tool or are based on my original Photoshop/Illustrator design files. In either case the images have been enlarged to show detail from their original pixel dimensions.
The design tool simulates the appearance of screen media so the captures from that program are less polished than the actual graphics would be on a production phone. They exist as examples only. Animations were created in Photoshop and are simulations of how the final production phone interactions would look.
All media is ©Motorola iDEN and used with permission.
