Reimagine Leica M-System

Master the spirit of Leica M-System

My Contibutions
User Experience Design, User Research, Visual Design, Motion Design, 3D
Deliverables
Concept of commercial campaign by an tablet application
Industry
Retail
Time
2017

Perfecting the legendary rangefinder camera series.

The outcome of this project is a tablet application that connects potential customers with Leica’s values while promoting confidence in using their products. The application encourages potential and existing customers to immerse themselves Leica’s stories, while they explore and test drive a variety of Leica M products.

Problem Space

Founded in Germany in 1849 as an optics manufacturer, Leica developed the world’s first portable camera. Owing to their compact, resilient design and superior capabilities, Leica M’s have been a standard for street photographers and photojournalists worldwide. However, perspective customers find it difficult to build personal connection with the brand due to Store scarcity, Reputation for being complicated due to its manual controls and stripped-down analogue features, and High cost with its price tag of $8,000.

Off Brand Identity
Boring VR Booth
Lack of transition

Reframe the problem

"After considering some of the core issues and frictions facing the Leica M System, we asked ourselves: How can we connect people with the brand and give them confidence in buying Leica M? How can we clearly illustrate to users what sets the Leica M System apart from its competitors?"

Workplace mental health issues cost the Canadian economy an estimated $33B in lost productivity

Modern workers suffer from decision fatigue, information overload,poverty of self-regulation, distraction.

Companies that have introduced a workplace mindfulness program have saved and estimated $2000/employee and gained an estimated $3000/employee

Mindfulness Practice has been shown to enhance the concentration, alleviate stress and anxiety, increase productivity.

Corporate training

High cost of classroom training Passive delivery (PowerPoint, coursework)
Impact on productivity
Access to equipment
Accessibility for remote offices
Non-standardized learning

Collision Photography

Inconsistency of photo layout
Failure to accurately capture details
Submitted in a different order than required
Critical to other business units Access to damaged vehicles

Process

Leica M customers range from first-time users to hobbyist or professional photographers. With deep study in the needs and mindsets of our audience, we understood that the high cognitive overhead faced by users when they first use the Leica M presented a key friction that could be address through hands-on interactions. We also realized that the large and vibrant community of Leica photographers and their vast catalogue of stories and photos could supply engaging and content for the application.

I mapped out the ideas about the problem space for internal alignment

Skateholder Analysis

To begin addressing the friction, we organized research into a stakeholder’s map. Here, we examined the relationship between photographers, Leica stores, and third-party retailers.

Observe and analyze how we bond differnt stakeholder with Leica M Series

Product Repositioning

We then envisioned how this app can help improve Leica M’s brand position in the marketplace and among its competitors.

Shift Leica M to the market that dominated by Nikon and Canon

SWOT Analysis

SWOT model (strengths, weaknesses, opportunities, and threats) was used to analyze Leica’s competencies and challenges in a more comprehensive way.

Journey frameworks for both customer and business

We created journey frameworks that visually illustrate an individual customer’s needs, the series of interactions that are necessary to fulfill those needs, and the resulting emotional states a customer experiences throughout the process.

Customer Focused Behaviour Journey

Business Needs Focused Journey

Value Propositions

Through using this app, customers can understand the unique benefits of the M System while being introduced to Leica’s vibrant community. Enthusiasts of Leica can explore different lenses and models and be inspired from the rich content of the M Magazine.

Reduce the friction encountered by potential customers who want to try before they buy, which may lead to more sales; Updated content from the M Magazine connects users to the Leica brand and encourages them to be a part of the Leica community.

Information Architecture

Visual Design

The design language used throughout our platform was inspired by Leica’s existing style which uses red, white, and black.We included handwritten stroke icons to represent the human touch of the photographer and to symbolize the fact that Leica M cameras and lenses are handcrafted. The overlapping of the Photo Stories pages act as a metaphor for flipping through the pages of a magazine.The calligraphy style of the button introduces the human element to the mechanical process of the Leica M system. Representing an organic but elegant aspect that can only be done by the precision of human hands.

Interaction Design

Swiping offers users the opportunity move through the app quickly to uncover additional information without a typical on-screen target to focus on. The action of swiping through stories from the side was inspired by the act of flipping through the pages of a magazine.

The ring  used to switch between different M System model is based on the focus ring tab, unique to analogue cameras. As the users rotates this ring from side to side the image of the camera gets blurry, representing a change in focus.

Physical or digital?

Early prototypes landed in utilizing physical devices like Amazon Alexa and Phillips Hue Light System.

Alexa, Raspberry Pie, Phillips Hue?

Deep dive to validate the problem space

We demoed our initial prototypes and tested with awesome folks from Telus Innovation Lab, Spaces, WeWork, Metalab, Accenture, SFU, CMPNY.

Pivot by understanding the constraints

By visiting the physical environment in the office we researched, we realized that physical setup requires more investment in maintaining and strict regulations. So we pivoted our solution into something ingenious that won't heavily rely on the physical environment.

Also, I captured an insight from the people we interviewed:

"I don't want to add extra time on mindfulness/meditation into my daily routine, it just takes too much effort."

That's why we pivoted to the Chrome Extension that recommends digestible micro mindfulness that adapts to people's daily routine.

User Journey Framework based on our pivoted idea

User Flow of the Chrome Extension Concept

Wireframes

Discovering the look and feel to match with the core values


Testing is the only way to support us iterate and polish our ideas. I was so excited to see multiple projectors projected a full cylinder of the huge space. It provides us the "wow" moment to move on with the direction that combines the real-world projection mapping with the virtual world inside the headset.

Brand pattern: Moiré
Projection Mapping
VR Lobby



During the development phase, we largely tested the headset experience with more than 40 people. We added break sessions to increase the comfort level during the overall 45 mins theatre experience. Motion sickness is improved by slowing down the focus point (The SIGGRAPH moiré pattern) in the virtual space.

It's time to wrap up our plan within a shared artifact: our journey map. This helped us communicate with all stakeholders to deliver a cohesive conference experience at the end.

Experience Journey Map

Start with confidence

Utilizing sound and motion to indicate that the 3D object is successfully placed.

Intuitive self-guided learning

Inspired by the automotive motif of orange and white pylons, estimators can simply follow the moving arrows and rings to guide them to the correct vantage point for documenting damage accurately and efficiently.

Locate yourself in the virtual space

Real-time top-down view allows users to navigate around  in the virtual world.

Perfect angle, perfect photos

With this alignment tool, users can pan back and forth, up and down, left and right to match the circles and understand the ideal shot.

Virtual tools for the real job

With the tool menu, estimators can have the virtual tools to practice the estimation process.

Combination of formative and summative feedback

During the experience, estimators can follow the real-time feedback to aware the progress and refine mistakes instantly. Summative feedback will support estimators to achieve the long-term learning object.
Formative Feedback
Real-time instruction, timer, guidance
Summative Feedback
Leaderboard, achievement, progress

Outcome

We successfully tried out, designed, and presented the end-to-end process of designing a product to enhance brand awareness and discover potential solution spaces. It's also a brave experiment with no limitation to predict how far we could reach within 4 weeks.

Check the process book

Curated Meditation Journey

Soothing Breathing Exercises

Time-Based Recommendations

Progress Tracking and Daily Goal Setting

Philips Hue Light Integration

The whole thing was a great success with very positive feedback. Colleagues overheard hallway conversations with people recommending the VR Theatre to complete strangers.”

– Yangos, Creative Director at 2018 SIGGRAPH Computer Animation Festival
“The app was demonstrated to our North American Financial Services leadership, and we’re now in the process of taking the app to another client that wishes to up-skill their estimators.”  
   
— Senior Principal, Accenture Technology
“Classroom learning can be difficult. It’s nice to be able to walk around and physically go inside the vehicle. It’s like getting hands-on training.”

— New Estimator Trainee
“I can definitely see how an application like this will change how we approach training in the future.”  
   
— Estimator Trainer

Reflection

During the developing process of this product, I clearly understood the experience design at every phase. Through research on the company we chose as well as our design domain, we made a number of insights that inspired continuous iterations on our digital products. We maintained a user-centric approach and developed our application with the intent of providing long-term value to the customers and business alike.

Three MDM Student Cohorts Work Together To Develop VR Theater at SIGGRAPH

Other Projects

Let me know if you want to talk about a potential collaboration.

Have a chat