Roles
UX/UI Design
User Research
Visual Design
Overview
Motorola unveiled the Moto Z on June 9, 2016, as its flagship model for the year. It is distinguished by the "Moto Mods" ecosystem which allows case accessories to be magnetically attached to the device to provide additional functionality. Client is looking to build something to capture the uniqueness of the latest phone.
The Solution
Through thoughtfully exploring a variety of iterations the solution is a brilliantly vibrant experience. It features large impactful headlines for calling out feature bursts along with lush video and photography to draw users to interact and see various features.
The Problem
The client was looking for a Moto Z Mods experience that would show off the style and innovation of the Moto Z and the Moto Mod accessories in a unique way while in a fully responsive digital experience.
Taking a mobile-first approach improve the motomods.com experience with the objectives of explaining the concept, generating enthusiasm and driving repeat visits.
Motorola web properties
Motorola.com draws 70M visitors globally on an annual basis. Half of users join via mobile devices, and this share is on the rise. There is strong interest from competing devices such as the iPhone and Samsung galaxy.
Experimenting with a variety of audiences to see which produce highest resonance with our brand strategy. Current hypothesis centers around “Technology Trendsetters”, who are regarded as key opinion leaders regarding tech purchases in their social circles and buy from well-known brands.
Strategy & Goals
During Motorola aspires to become the number three smart phone brand in the world by the end of next year, bested only by Apple and Samsung. The brand strategy focuses primarily on non-customer acquisition, gaining higher visibility, establishing distinct presence and invoking emotional response. Product development establishes Motorola as a technology leader while embracing the extensibility of smart phones as an unsolved problems in the market. As mods are a new device category, the concept is to be explained to our users while establishing enthusiasm towards it.
Discovery
During the discovery phase a competitive analysis, user surveys, interviews and more were done in order to create the most user-centric experience possible by getting well balanced data.
Competitive Analysis
According a 2017 Morgan Stanley survey charted by Statista, 92% of iPhone owners who plan to get a new phone in the next 12 months say they’re “somewhat or extremely likely” to stick with Apple. Up from the previous year, when that number was 86%. Samsung comes in second with a 77% retention rate, which is easily the highest for an Android brand, but still a ways behind. The likes of LG, Motorola, and Nokia are closer to 50/50, if not lower.
Apple iPhone X
Apple Computers website on Safari Browser showcasing latest Apple products - showcasing latest iPhone X 10 what a neural engine is. The site is full of large images, bold text and ample negative space.
Strengths
• Huge & Beautiful Photography
• Customers trust the reputation
• Large headings for product features
• Ability to see all bus lines
• Clean & elegant design
• Generous amounts of negative space
Weaknesses
• White layouts may be too dull
• Confusing navigation features
• It may come off as too common
• Not enough specifications
• Not enough specifications
Samsung Galaxy
Samsung promotes the phones bringing a dark blue interface in contrast to the white background brought by Apple. Galaxy is promoted as somewhat vibrant, fast and thinnest mobile phone and the advantages embraced are explained clearly.
Strengths
• Stand as an independent alternative
• Bold use of the color blue is soothing
• Good images of products
Weaknesses
• Lacking real in use or demo photos
• Limited interactivity on site
• Bold colors and waves may distract
Users & Audience
To learn more about our audience, a survey was conducted via Google Forms. This included the experience of trend setters, the preferences and demographics questions. These insights along with research from market research and data collections such as the Pew Research Center, and the US Census Bureau data.
92%
Age 18-29 own smartphone
51%
Over 3 smartphones in home
76%
In 2016, 77.4.% desktop or laptop compared to 76.5% had smartphones across all homes.
Define
This stage is in order to gather and document ideas to establish features, functions, and any other elements that will allow riders to solve the problems with the minimum of difficulty.
Personas
UX/UI User Persona based on affinity map and empathy map created from research data. The deliverables themselves were created in Adobe Indesign, Illustrator and Photoshop CC.
Empathy Map
An empathy map is a simple, easy-to-digest visual that is a useful tool to help "get inside the mind" of the user. This full spectrum snapshot of the experience was created to highlight for different segments.
Ideate
The goal of this design phase is to generate a large number of ideas — ideas that potentially inspire newer, better ideas — then refining them into the best, most practical and innovative ones.
Sketching wireframes
After creating a persona and the priorities for the user into a user story. It was time to begin ideating to towards the ideal path or a set of steps towards a successful outcome and final action.
Mobile Sketching
After creating a persona and the priorities for the user into a user story, it was time to begin ideating with some hand drawn sketches to explore a multitude of possible concepts.
Paper Prototype
After creating a personas a fast paper prototype helped to realize concepts and test designs. Sketches and low-fidelity screenshot samples guide designs and study users' reactions from early in projects.
Wireframes
After creating a persona and the priorities I worked to build wireframes that would tell layout the base elements and begin forming concepts into real objects on the layouts and fleshing out the design framework.
Next Step Prototype
I will be prototyping and testing shortly...
Gotta project?
Have questions?