esg - application mobile - cours 1

• les présentations • Plan de cours • Concevoir pour le mobile

SOMMAIRE - 03/05/2014

Alban Oujagir UX Designer Marcel WW

alban.oujagir@gmail.com

@oujagir_alban

Alban Oujagir

LES Présentations

• les présentations • lE cours d’aPPLICATION MOBILE • Concevoir pour le mobile

SOMMAIRE - 03/05/2014

objectif

PLaN DE COURS

La maîtrise complète d’un projet mobile. De la prise de brief au lancement de l’application.

5 Phases

PLaN DE COURS

1. Le Marché mobile 2. Le mobile : pourquoi et pour quoi faire ? 3. «How to» : Gestion de projet mobile 4. Comment ne pas se faire avoir par la technique ? 5. Evaluation.

PLaN DE COURS

1. Le Marché mobile - Introduction : Concevoir pour le mobile - Chiffes clés et tendances - Une grande diversité de terminaux

PLaN DE COURS

2. Le mobile : pourquoi et pour quoi faire ? - Définition d’une stratégie mobile - Site Mobile Vs. Application mobile, enjeux et différences - Solution alternative : la web app

PLaN DE COURS

3. «How to» : Gestion de projet mobile !

- Conception fonctionnelle, graphique et ergonomique. - Zoom sur la conception fonctionnelle - Zoom sur la conception ergonomique - Site mobile et responsive design - Méthodologie et grandes étapes d’un projet - Travaux pratiques : Applications

PLaN DE COURS

4. Comment ne pas se faire avoir par la technique ? - Zoom sur les technos - Les OS - Cross platform - Tips

PLaN DE COURS

1. Le Marché mobile 2. Le mobile : pourquoi et pour quoi faire ? 3. «How to» : Gestion de projet mobile 4. Comment ne pas se faire avoir par la technique ? 5. Evaluation.

PLaN DE COURS

• les présentations • lE cours d’aPPLICATION MOBILE • Concevoir pour le mobile

SOMMAIRE - 03/05/2014

@esgMS MEB

alban oUjagir

LA CONCEPTION POUR L’objet qui est TOUJOURS

DANS VOTRE POCHE

Quelques précisions…

Le mobile c’est quoi ?

(dans cette présentation)

Connexion 3G / Wifi

Stockage des données

Clavier (physique ou virtuel)

Toujours dans la poche

 « Et la tablette c’est

du mobile ? » 

En 201385% des tablettes

vendues en France son wi-fi

Pourquoi s’intéresser au mobile ? en 4 Lieux communs?

Lieu commun #1 Tout le monde en a un (ou presque)

Lieu commun #1 Tout le monde en a un (ou presque)

38% des français possèdent un smartphone

2012ventes des smartphones supp. au PC

www 85%des téléphones vendus avec un browser

50%du traffic de Facebook fait sur mobile

De plus en plus de gens sont et seront équipés d’un smartphone connecté !

Lieu commun #2 Le contexte d’utilisation d’un mobile n’est pas celui d’un ordinateur.

Fluffy et Mr. Lacombe Lt. Mac Lusky

!

Les contextes d’utilisation

(partout)

Dans les magasins 76%

Dans les transports 62% A table.

59%Dans les situations d’attentes

46% En société 39% Aux toilettes

76%

Le mobile est utilisé partout et en toute circonstance !

Lieu commun #3 L’utilisateur mobile est multi-tâches comme son téléphone.

72% des utilisateurs naviguent sur mobile en :

44%

En écoutant de la musique

27%

En jouant33%

En regardant la TV

22%

En lisant le journal

22%

En lisant des livres

Le mobile est un ami fidèle toujours prêt à m’accompagner dans toutes les tâches de mon quotidien !

Lieu commun #4 Le portable c’est un véritable concentré de technologie

L’iPhone 5 est aussi puissant qu’un supercalculateur de 1985

Microphone

Speakers

APN + Caméra Vidéo

Géolocalisation

Lecteur RFID

Capteur Mutli-touch

Accéléromètre

Boussole

Feedback haptique

Capteur de mouvement

Allez viens ! Regarde tout ce que l’on peut faire !

Lieu commun #1 Lieu commun #2 Lieu commun #3 Lieu commun #4

Le mobile offre des opportunités fonctionelles

quasi infinies.

« My goal initially just to make a mobile

companion, but I became convinced it was possible to create a version of Facebook that was actually better

than the website » !

Joe Hewitt - Former Developer of Facebook App

La minute

blind test

La minute

blind test

Avant je faisais d’une certaine façon,

et maintenant je ne ferai plus jamais comme avant.

Shazam à créé

un nouveau comportement

Une minute de silence SVP

Le smartphone

se substitue aux objets du quotidien...

...et trouve également sa place dans des champs

d’actions très spécialisés.

*comme t’aider à tuer des gens

US ARMY app : Bulletflight

!

Comme disait McLuhan :

« We shape our tools and thereafter our tools shape us »

Marshall McLuhan Understanding Media : The Extensions of Man -1964

Le smartphone induit des

glissements d’usages :

Fonction 1ère : Souvenirs, Conserver des moments, côté précieux , transmission.

Glissement : Bloc-note,Disposer en permanence de données personnelles utiles.

Nouvel usage : App marchande, photographier une référence pour l’acheter.

Des nouveaux comportements qui

influencent les «designers» :

Glissement : Bloc-note,Disposer en permanence de données personnelles utiles.

C’est notre rôle de «concepteur» de déterminer en fonction du contexte et de nos utilisateurs quelles sont nos opportunités

d’innovation.

Avec un espoir :

transformer un comportement en un usage !

Aller observer les utilisateurs dans leur milieu naturel.

Tips #1

LET’S GO OUTSIDE !

Tips #2

Exploite la technologie de ton mobile !

Petit voyage à Singapour

OKAMOTO / TipOff - Cannes 2012 Mobile Lions Shortlist TBWA\ TEQUILA\ Singapore

Cet exemple

répond aux besoins des

utilisateurs dans un contexte donné

et aux objectifs de la marque :

UTILISATEUR(S)

OBJECTIF(S)

CONTEXTE

Mais est-ce toujours suffisant ?

Fuel Band : L’histoire d’un bide

(ou pas)

Fuel Band : Les raisons du succès

Ils ont modifiés le dispositif déjà lancé sur la base de deux insights utilisateur : !

1/ Notre tendance naturelle à consulter compulsivement les feeds : «fear of missing out». !

2/ L’esprit de compétition et le besoin de se comparer aux autres.

« It wasn’t a big idea so much as lots of little smart decisions that, added together, created an inspired experience».

Nick Law Global CCO at R/GA

Concevoir pour le mobile :

Observations d’usages

Remontées d’insights

IDEABIG +itération

«CREATE RELEVANCE, NOT AWARENESS»

Le challenge aujourd’hui n’est plus de se battre pour créer l’attention, mais de devenir suffisamment pertinent pour que nos consommateurs s’intéressent à nous par eux-même.

Amir Kassaie CCO at DDB Worldwide

Tips #3

!

Il ne faut jamais oublier ce qu’implique la conception en

situation de mobilité.

Fluffy et Mr. Lacombe Lt. Mac Lusky

Un utilisateur attentif

Un environnement familier dédié

Un espace privatif

Un écran de grande taille

Un clavier stable / usuel

Un réseau stable

De l'énergie à revendre

Un utilisateur distrait

Un espace public

Environnement variable

Ecran de taille réduite

Clavier + touch

Réseau variable

Une batterie

Concevoir pour le mobile, c’est : prendre en compte le manque de concentration, l’intérruption et la distraction.

Concevoir pour le mobile, c’est donc: ne pas trop solliciter ce truc.

Tips #4

Rester core functionality !

x

Exemple : le remplissage automatique

Simplifier au maximul l’effort de l’utilisateur !

Tips #5

!

"La perfection est atteinte, non pas lorsqu'il n'y a plus rien à ajouter, mais lorsqu'il n'y a plus rien à retirer".

Antoine de Saint-Exupéry.

• les présentations • lE cours d’aPPLICATION MOBILE • Concevoir pour le mobile

SOMMAIRE - 03/05/2014