Oliver Weidlich presentation

What Makes a Good App

Oliver WeidlichDirector of Design & Innovation

Mobile Experience

Wednesday, 11 July 12

@oliverw


Why Are We Here?



Great Experiences


Initial Over Time



Re-Think Engagement


Click for Google Now Video


http://www.google.com/landing/now/

http://www.google.com/landing/now/

Click for Square Cards Video


http://www.youtube.com/watch?v=kf7rZbamJik

http://www.youtube.com/watch?v=kf7rZbamJik

How do we create them?


http://semanticstudios.com/publications/semantics/000029.phpWednesday, 11 July 12

http://semanticstudios.com/publications/semantics/000029.php




Useful


Useful

•Meets people’s needs for the product/

service utility

•Can integrate it into their lives to assist

them in achieving things;

- faster- more easily- a better result






Usable


Usable

•Make it as easy to use as possible

•Match the customers mental model

•Use labels and language they understand





Desirable


Desirable

•Go beyond just the expected experience and

delight customers

•Make experiences playful where

appropriate

•Aim is to increase engagement

- Frequency- Duration- Customer satisfaction


[Path & The Eatery & StockTouch]


Valuable


Valuable

•Added functionality to normal service

•Easier method for customers to

- Communicate with company- Get support- Find out about products/services- Pay

•Save on customer service staff




Findable


Findable

•Awareness

- Marketing- Education (e.g. Podcasts)- App Stores

•Access

- App store- Web site

•SEO




Accessible


Accessible

•Accessibility isn’t just about people with a

disability

•Make it easier for everyone

•When designing your app leverage OS

specific technologies in your app (e.g. Voice

Over for iOS)


Credible


Credible

•Trust

•Reputation

•Brand

•Distribution



Design Patterns



Coherence

Images courtesy of Wolfram Nagel

MULTISCREEN EXPERIENCEPRINCIPLES AND PATTERNS FOR MANAGING INFORMATION IN THE DIGITAL SOCIETY

Coherence

Information is displayed and used in a manner that is device and screen independent, logical, and coherent. Individual features are optimised for device capabilities and form of use.

Device Shifting

The display of information or content is shifted to a separate device by the user. The display is switched between the screens involved.

Synchronisation

Information is kept in sync and up-to-date across devices.

Complementarity

Devices influence, control and complement both each other and the information displayed on the screens.

Screen Sharing

The display of information or an information source is extended and distributed across multiple screens.

MASTER’S THESIS

Summer Semester 2011 Master of Arts (M.A.) Communication Planning and DesignHochschule für Gestaltung Schwäbisch GmündUniversity of Applied SciencesStudents: Valentin Fischer | Wolfram NagelSupervising tutors: Prof. Ulrich Schendzielorz | Prof. Steffen Süpple

team@multiscreen-experience.comwww.multiscreen-experience.comwww.valentinfischer.com | www.wolframnagel.com

Simultaneity

Different devices or information services are used simultaneously. Different pieces of information may complement one another.

MULTISCREEN PATTERNS CONCEPT PATTERNS

Hildegard BraunDigital Outsider

Lukas SchmitzTrend User

Inge BehrendCasual User

Chris KuligTrend User

Ulrike MeißnerCasual User

Björn HohmannDigital Professional

Marc LüttichDigital Avant Garde

Seamless Interaction

The interaction with an application or information service needs to be logical and seamless across devices.

Storyfication

Telling the story of a product or service across different media creates a uniform user experience across devices which may increase the users' identification with and understanding of the product.

Mobile First

Because of the increasing importance of mobile devices it is advisable to concentrate on the most important device first. The smallest screen forces a meaningful structure of information.

Context Relevance

The information offered needs to suit the situation, environment, user, device and context of use. In short: the right information at the right time.

Gamification

The integration of game mechanics into a product simulates a competitive environment. The game factor can motivate people if it is fun, challenging, provides relevant goals, and if participation remains the choice of the user.

Adaptability

The flexibility of adapting layout and content to the features and capabilities of different devices makes it easier to manage information across devices. Fundamentally information needs to be accessible on the relevant devices.

Extensibility

An information service needs to be flexibly extensible and able to adapt to changing requirements (forward compatibility).

Communification

Social networking and creating a community can make an information service more attractive for the users. A service can be improved through possibilities for users to create, share, rate, and comment on content.

Fluidity

Information services need to fit into the context of use and offer a fluid and consistent user experience across devices.

PERSONAS IN THE DIGITAL SOCIETY CONTEXT OF USE

Silvia NolteProfessional User

Private

A private environment and generally all private situations are not accessible to outsiders or strangers.

In the digital age, more than before, information needs to be simultaneously relevant and tangible. It needs to be fun and quickly graspable. The Masters dissertation looked at cross device information and interaction scenarios that may support the communication and exchange of information in the future digital society. We investigated how information can be captured and processed across different media and how we can enable people to gain the easiest possible access to digital services.

The Multiscreen Experience Toolkit offers patterns, principles and definitions that are relevant to multiscreen projects and information management in the digital society. These recommendations and ideas (they are not bullet proof recipes!) aim to support the creation of fluid multiscreen experiences. We look at the four most important screens (smartphone, tablet PC, laptop and TV), describe the potential users, recommend various conceptional approaches and explain the different parameters for the context of use.

There are various possibilities to combine multiple screens, devices, content, and interfaces. In the following we are going to introduce six patterns which are largely based on the differentiation and definitions by Precious Design Studio.

The following eight personas are based on the study "D21 – Die Digitale Gesellschaft" and focus on the topics of aptitude towards media, device usage, context of use, and user requirements. They aim to support the design of multiscreen concepts and may be adapted according to the relevant project needs.

The following patterns are recommendations (not recipes) based on established design solutions, user interfaces and UI design patterns or general conceptional approaches and essays from the area of interaction and information design. Depending on the project they should be checked for sensibility and usefulness. The different concept patterns may be combined.

The context in which an information service is used is not only determined by the device used; other parameters are the mode of use, situation and environment. The mobile context of use (not to be confused with mobile situation) is a special case. It may occur always and everywhere.

WWW.MULTISCREEN-EXPERIENCE.COM

Work place

The work place largely has no or only limited accessibility to outside persons and strangers.

Public Space

The public space is generally accessible to everybody. Everyone can participate in a situation. It is not private.

In transit

Whenever you are moving between two places you are in transit (change of location from A to B).

Lean Back

In Lean Back mode the user is predominantly relaxed and passive. The interaction with the device is intermittent, temporary and not sustained.

Mobile

In transit the preferred devices are small, handy and mobile. The duration of mobile device use is relatively short and intermittent. A mobile situation occurs on the go, between start and finish of a change of location.

Lean Forward

In Lean Forward mode the user acts predominantly concentrated and active. Their interaction with the device is largely uninterrupted and sustained.

Stationary

The use of devices or the situation respectively are bound to a stationary location.

M

ODE

OF USE

SITUATION

ENVIRONMENT


Smashing Magazine


Synchronisation



Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Evernote


Distribution



Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Bigpond.com (Portal)


Complementarity



Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Plex


Collaborative



Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Scrabble


Multiple patterns can apply



Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT


Coherence


Device Shifting


Synchronisation


Complementarity


Screen Sharing


MASTER’S THESIS



Simultaneity












Storyfication


Mobile First


Context Relevance


Gamification


Adaptability


Extensibility


Communification


Fluidity




Private









Work place


Public Space


In transit


Lean Back


Mobile


Lean Forward


Stationary


M

ODE

OF USE

SITUATION

ENVIRONMENT

Coherence

Synchronisation

Distribution

Complementarity Collaborative


Continuous Experiences


Continuous Experiences

are supported by integrated services

across devices whose design is true to

each devices size, interaction & usage.


Continuous Experience

1. Seamless Sync: Preferably push

2. Appropriate Features

3. Consistent Design

4. Optimised Interaction

5. Respect Personalisation

6. OS/Device/App Integration




iPhone / iPod Touch


Remember

•Useful

•Usable

•Desirable

•Valuable

•Findable

•Accessible

•Credible



Initial Over Time


Thanks!

Oliver WeidlichDirector of Design & Innovation

[email protected] 551 561

@oliverw


mailto:[email protected]

mailto:[email protected]

Technology

Oliver Weidlich presentation