SlideShare a Scribd company logo
1 of 22
Download to read offline
ERGONOMIE
ANTOINE BORZEIX DEUST TMIC 1
2016-05-10
ANALYSE ERGONOMIQUE DE DJI GO
(L’APPLICATION SMARTPHONE DU DJI OSMO)
CAMERA STABILISEE ET CONNECTEE
Osmo est la toute nouvelle caméra de la marque DJI, célèbre pour ses drones
Phantom. En plus d’être pilotable et réglable depuis un smartphone, cette
caméra 4K est stabilisée sur 3 axes motorisés. Nous allons ici évaluer
l’application de contrôle selon les critères de Bastien et Scapin.
2
SOMMAIRE
0. AVANT PROPOS
1. GUIDAGE
2. CHARGE DE TRAVAIL
3. CONTROLE DES UTILISATEURS SUR LEURS ACTIONS
4. ADAPTABILITE DE L’APPLICATION AUX BESOINS DES
UTILISATEURS
5. GESTION DES ERREURS
6. HOMOGENEITE ET COHERENCE DES CODES
7. SIGNIFIANCE DES CODES ET DENOMINATIONS
8. RESUME
3
0. AVANT PROPOS
PETIT TOUR D’HORIZON ET DÉCOUVERTE DU PRODUIT
Caractéristiques techniques
Les caractéristiques techniques du produits sont disponibles en détails sur le
site du constructeur DJI et sur le DJI Store.
Modes de prise en main de la caméra
Pour bénéficier de la meilleure prise de vue à tout moment, on peut utiliser le
stabilisateur DJI Osmo dans différents modes :
• Upright : permet d’obtenir un plan large plutôt classique qui sera
probablement le mode que vous utiliserez le plus.
• Underslung : pour des prises de vues en position basse comme par
exemple une prise de vue à ras du sol.
• Flashlight : permet de tenir votre stabilisateur comme une lampe torche
afin de filmer droit devant soit.
• Portrait : permet de tenir l’Osmo de façon horizontale.
Présentation du l’application DJI GO
L’application DJI GO permet d’obtenir de nombreuses informations sur les
paramètres comme l’ISO, la vitesse d’obturation, la focale, la correction de
l’exposition, le nombre de photos restantes et l’autonomie de la caméra.
Pour la photo
• Prise unique : Normale, retardateur de 5 ou 10 secondes et HDR.
• Photo rafale : Rafale à 3, 5 et 7 photos par seconde, bracketing
d’exposition (AEB) pour réaliser 3 à 5 photos à 0.7EV.
4
• Panorama : Auto (la caméra tourne pour réaliser 8 photos pour un rendu
360°) ou Selfie (même principe mais la caméra est tournée vers le
caméraman).
• Intervalles : Les photos sont prises toutes les 5, 10 ou 30 secondes.
• Timelapse : Possibilité de prendre des photos toutes les secondes si
on désactive le format JPEG+Video. Une stabilisation est appliquée si
l’on dépasse les 2 secondes d’intervalle.
Pour la vidéo
• Auto : la vidéo sera enregistrée en fonction des paramètres que vous
aurez configuré dans les réglages.
• Slowmotion : Enregistré en 1080p à 120 images par seconde.
Environnement de test :
Smartphone : LG G3
Taille d’écran : 5,5 pouces
OS : Androïd 5.0
5
Méthodologie : J’ai choisi d’évaluer l’application DJI selon les critères de
Bastien et Scapin car ils sont plus faciles d’accès par des non-spécialistes
(comme moi) et permettent une évaluation plus large et l’utilisation de termes
plus libres. Toutes les illustrations qui composeront la suite de ce document
ont été prises par moi. Les photos de l’application sont des screenshots
réalisées à même le téléphone.
6
1. GUIDAGE
CONSEILLER, ORIENTER, INFORMER ET CONDUIRE L’UTILISATEUR
TOUT AU LONG DE SON PARCOURS
1.1. Incitation dans les actions à effectuer
Au démarrage de l’application, l’utilisateur peut sembler perdu et percevoir
cette étape comme superflue. En effet, avant de pouvoir commencer à
contrôler la camera pour photographier et filmer, il faut passer par l’étape
d’ouverture de l’application. Cette étape passe par une page sur laquelle
l’utilisateur peut effectuer plusieurs choix.
Screenshots 1 Page d'accueil de l'application (à gauche l’appareil est reconnu et connecté, à
droite il n’est pas reconnu mais l’application propose un tutoriel pour savoir comment procéder)
7
1. On nous confirme que nous utilisons une application pour contrôler le
DJI Osmo. Il est à savoir que cette même application permet aussi de
contrôler tous les autres appareils de la marques (drones Phantom,
Inspire).
2. Par sa couleur, un bouton ressort par rapport aux autres. C’est un call-
to-action qui invite l’utilisateur à se connecter à la Camera.
3. Learn more nous envoie vers le magasin en ligne de la marque. Son
appellation est trompeuse. Il est grisé ce qui implique qu’il n’est pas
recommandé d’appuyer dessus en premier. L’utilisateur le fera
probablement par curiosité.
4. La série de 4 items (Equipment, Editor, Explore, Me) n’est pas assez
explicite. Seuls Editor et Me ne nécessite pas de réflexion pour
l’utilisateur. Editor ouvrant sur l’éditeur de vidéos et Me ouvrants sur
l’interface de gestion de l’utilisateur. Equipment ici en noir nous
indique vraisemblablement que nous sommes sur la page de
l’équipement bien que nous soyons sur l’accueil de l’application. Cette
partie n’est pas très claire.
5. Cette partie de l’application est destiné uniquement aux possesseurs
de drones car elle regroupe les enregistrements de vols. Elle est donc
superflue pour les utilisateurs de de camera Osmo. Le logo est plus ou
moins bien choisi si l’on arrive à identifier ce que c’est.
6. Ce logo qui ressemble, pour moi, à un chapeau de diplômé donne
accès au didacticiel de cours en vidéo pour apprendre à se servir du
matériel. Il n’y a que deux vidéos concernant le Dji Osmo.
Logiquement l’utilisateur se laissera guider et appuiera sur le bouton qui
est le plus visible, celui du call to action, soit ici CAMERA.
Dès lors, cet utilisateur identifie bien qu’il se trouve sur une application de
prise de vue, grâce à une interface standard semblable à toutes les
applications photo. Cette interface permet donc la visualisation des
principales fonctions et actions possibles grâce à un regroupement des items
plutôt classique. Regroupement qui s’appuie sur la théorie de la continuité et
de la forme de la célèbre loi de Gestalt. L’interface est claire et va à l’essentiel.
8
Il n’y a aucune information superflue qui viendrait pourrait perdre l’utilisateur.
La taille et les formes des items sont elles aussi particulièrement bien choisies
pour capter le regard et permettre à l’utilisateur de savoir ce qui est cliquable
ou non.
Découverte de l’interface
1. En image principale, l’utilisateur a la visualisation de la prise de vue qui
permet le cadrage.
2. À gauche, on retrouve tous les boutons que l’on retrouve
habituellement sur une appli photo (comme l’appli Photo native
d’Android en Screenshot 2).
3. À droite, se trouvent l’item de retour à l’accueil de l’application et les
items de réglages qui mériteraient d’être plus identifiables comme
items de réglages.
4. En haut, les informations sont un peu plus techniques et ne sont pas
cliquables, elles avertissent sur les paramètres d’enregistrements
actifs.
Screenshot 2 Application DJI GO en mode photo
9
Screenshot 3 L'interface de l'application photo/camera native sous Android
Il n’y a pas de fil d’ariane à proprement parler, mais grâce à un système
d’onglets et de mise en surbrillance des items parents, l’utilisateur sait quel
onglet il a ouvert et dans lequel il se trouve. Dans l’exemple ci-dessous
l’utilisateur a ouvert l’onglet permettant de sélectionner le mode
d’enregistrement vidéo (automatique ou slowmotion). La surbrillance de l’item
Auto nous indique aussi que c’est pour le moment le mode qui est actif. Dans
le screenshot 4 ci-dessus, nous remarquons le bouton rouge. C’est un call to
action qui nous invite à commencer l’enregistrement.
Screenshot 4 Choisir son mode d'enregistrement par onglet
10
Screenshot 5 Un autre exemple avec l'onglet de paramètres de prises de vue
Screenshot 6 Un exemple d'onglets et de surbrillance aussi en mode photo
1.2 Groupement/Distinction entre Items
Comme précisé dans le chapitre Guidage, les boutons sont assez bien agencés
et leur regroupement permet une compréhension rapide.
11
1.3 Feedback immédiat
Lors des actions effectuées, l’utilisateur est tenu au courant de la validation
de cette action grâce au feedbacks. Néanmoins l’application DJI GO
manque de feedbacks et souvent l’utilisateur ne sait pas si l’action
demandée est en cours ou non. C’est le cas pour la plus importante d’entres
elles qui est l’enregistrement. En effet, le rond du déclencheur devient un
carré entouré d’un rond de même taille que le rond original.
Il arrive que certains paramètres ne soient pas compatibles avec d’autres.
C’est alors qu’apparaissent des messages pour en alerter l’utilisateur. Cette
alerte ne propose malheureusement pas à l’utilisateur de changer les
paramètres par un message de type « souhaitez vous modifier les
paramètres – Oui ou Non » ni une redirection vers les dits paramètres
bloquants et c’est dommage.
12
Screenshots 7 Messages d'erreur
1.4 Lisibilité
Le police d’écriture, bien que très petite permet une bonne lisibilité, les logos
sont assez explicites pour une personne habituée des applications photos
basiques. Un réglage automatique de l’opacité du background des onglets, en
fonction de la luminosité ou de la couleur des éléments filmés et donc en retour
sur l’écran, aurait été appréciable pour faciliter la lisibilité. En effet, parfois cela
devient peu lisible si l’image tire vers le blanc.
Autre point, sur le screenshot ci-dessous le curseur est sur le logo photo, nous
sommes bien mode photo et non vidéo. Ce curseur peut prêter à confusion et
n’est à mon sens pas assez clair. Le choix de couleur grises et noires n’est pas
judicieux. Une surbrillance bleue comme celle des onglets ouverts et des
options actives aurait été préférable. Mais ce curseur est commun a n’importe
quelle application photo. Vous aurez surement remarqué que des barres noires
apparaissent sur les côtés lorsque nous passons en mode photo. Je vous
précise que ce ne sont pas des barres mais uniquement le background noir qui
13
apparait. Ceci est du au fait que l’image passe en format 4/3 au lieu du 16/9 car
je l’ai paramétré ainsi
Screenshot 7 Bleu pour montrer l'actif, mais pourquoi pas partout ?
1.5 Localisation
Comme traité plus haut, l’utilisateur peut se repérer aisément grâce à la
surbrillance des titres des onglets ouverts. Le peu de choix et le fait que les
onglets ne soient que d’un seul niveau pour les réglages principaux à
gauche (un item -> un onglet, et non un item -> un onglet avec plusieurs
items ouvrant plusieurs onglets …) évite à l’utilisateur de se perdre. Ceci
permettant une navigation et un retour plus rapide en arrière. Pour les
réglages plus techniques, dont on accède par les items à droite, c’est
différent. Ceux ci sont composés d’onglets sous plusieurs niveaux mais une
flèche permet un retour rapide au niveau supérieur. Il reste néanmoins facile
de se rappeler dans quel item nous sommes et cela sans fil d’ariane, même
si la présence de celui ci aurait été appréciable.
14
Screenshot 8 Onglet de niveau -1 de réglages caméra
Screenshot 9 Onglet de reglage de niveau -2 sous Caméra
15
2. CHARGE DE TRAVAIL
OPTIMISER LE NOMBRE D’ACTIONS DEMANDEES A L’UTILISATEUR
2.1. Brièveté (Concision & Actions Minimales)
Je mettrai un mauvais point pour le fait de devoir passer par l’étape de la
page d’accueil de l’application à chaque démarrage plutôt que d’atterrir
directement sur la prise de vue.
Il est aussi regrettable que tous les paramétrages concernant la prise de vue
photo ou vidéo de soient pas dans un seul et même onglet. En effet, le choix
de la résolution et de la vitesse (nombre d’images par seconde), pour ne
citer que cela se fait par l’onglet accessible par l’item de droite alors que le
choix de la vitesse d’obturation et des iso se fait par la gauche. Le pourquoi
de ce choix de disposition m’échappe et j’espère que cela sera corrigé sur
une prochaine mise à jour.
2.2. Densité de l’information
L’interface de l’application permet à l’utilisateur de se concentrer sur sa
prise de vue car elle n’est pas surchargée. Pour cela les développeurs ont
préféré la sobriété et limiter le nombre d’informations présentes. Ceci va
aussi de paire avec les choix de réglages et de fonctionnalités qui vont à
l’essentiel. Bien que l’objet soit high-tech, l’utilisateur a un choix de réglages
assez limité, peut être trop. Mais c’est ce qui permet de rendre ce produit
accessible au plus grand nombre et de ce fait, d’en faire un produit grand
public, non réservé à une élite de professionnels de l’image. C’est donc un
choix marketing.
16
3.CONTROLE DES UTILISATEURS SUR LEURS ACTIONS
LAISSER L’UTILISATEUR CONTROLER LE DEROULEMENT
(INTERRUPTION, REPRISE) DE SES ACTIONS ET L’EN AVERTIR SI CE
N’EST PAS LE CAS
3.1 Actions explicites
Comme pour toute caméra et tout appareil photo muni d’un viseur
électronique, à l’instar des réflex, chaque changement de paramètre influant
sur le rendu de la prise de vue est visible automatiquement et
immédiatement sur l’écran de retour.
Par exemple si je change la vitesse d’obturation pour passer d’une vitesse
rapide 1/500 à une vitesse d’obturation lente 1/50, l’apport de lumière au
capteur sera visible immédiatement. Cela permet à l’utilisateur un réglage fin
en fonction de ses besoins. Les réglages possibles pour la prise de vue
photo et vidéo sont :
• Les ISO
• La vitesse d’obturation
• Le nombre d’images par secondes
• La possibilité de filmer à 120 images par secondes pour faire du
slowmotion avec résultat final visible en temps réel lors de
l’enregistrement.
3.2 Contrôle utilisateur
Pourquoi ? ho pourquoi l’utilisateur ne peut pas éteindre facilement
l’application depuis son écran de smartphone. Voici donc un gros problème
sur cette application, il n’y a pas de bouton pour l’arrêter. Il y a néanmoins
deux techniques :
Appuyer sur le bouton d’allumage et d’arrêt de sur le manche du
stabilisateur, cela propose d’arrêter le stabilisateur ou de le mettre en veille.
Si l’utilisateur choisi Power Off, le stabilisateur s’arrête et l’application aussi.
17
Tout irait bien, si cela n’était pas aléatoire. En effet, parfois le message
s’affiche et parfois non.
Screenshot 10 Screenshot du choix d'arrêt ou de la mise en veille de appli
L’autre solution consiste à passer directement par l’interface de l’OS
Androïd par le biais d’un jonglage des doigts et de manipulations aléatoires.
Le but étant d’accéder à la fenêtre ci-dessous pour pouvoir arrêter
l’application.
Screenshot 11 Arrêt depuis l'OS
18
4. ADAPTABILITE DE L’APPLICATION AUX BESOINS DES
UTILISATEURS
LAISSER L’UTILISATEUR PERSONNALISER ET CONTROLER UNE
INTERFACE EN FONCTION DE SES BESOINS (NOTIFICATIONS,
TABLEAUX DE BORDS, COULEURS …)
4.1 Fléxibilite
L’interface de application n’est pas personnalisable et l’utilisateur devra se
contenter de la disposition des éléments tels qu’ils le sont nativement.
Néanmoins les réglages de prise de vue le sont et sont sauvegardés
automatiquement une fois changés.
4.2 Prise en compte de l’expérience utilisateur
L’application offre un espace profil à l’utilisateur. Celui-ci peut y sauvegarder
les informations le concernant. L’intérêt est d’offrir notamment à l’utilisateur
une sauvegarde de ses vidéos et photos sur un cloud et de les partager,
mais aussi d’offrir la possibilité d’interagir avec d’autres utilisateurs via un
forum ou avec le service après vente via des formulaires. L’utilisateur se sent
important, privilégié et pris en compte.
19
5. GESTION DES ERREURS
EVITER, REDUIRE ET CORRIGER LES ERREURS LORSQU’ELLES
SURVIENNENT
5.1. Protection contre les Erreurs
Bien que la totalité des items présents soient cliquables, les choix
importants en noir se distinguent des moins importants en gris. Aucune
erreur grave ou de déparamétrage par accident n’est possible depuis
l’interface de prise de vue. Les paramétrages qui eux s’effectuent via les
items de paramètres ; Camera pour tout ce qui incombe à la prise de vue,
Gimbal pour tout ce qui incombe au contrôle multidirectionnel et
5.2. Qualité des Messages d’Erreurs
Il est regrettable que les messages d’erreur, aussi peu nombreux soient ils,
ce qui est une bonne chose, ne soient pas très clairs et ne permettent pas
de remédier au problème depuis le popup, lorsqu’il s’agit d’une
incompatibilité entre deux paramètres, comme cela peut être le cas sur
d’autres applications.
20
6. HOMOGENEITE ET COHERENCE DES CODES
CONSERVER LES CHOIX DE CONCEPTION ET CODES GRAPHIQUES
POUR DES ELEMENTS ET ACTIONS SIMILAIRES POUR FAVORISER
L’APPRENTISSAGE
Comme évoqué précédemment, l’application se divise en deux grosses
parties distinctes la partie prise de vue et contrôle du stabilisateur et la partie
administration du compte avec tout ce qui va autour. Chacune des parties à
sa propre charte graphique.
• La partie Administration a la même charte graphique que le site
internet de la marque ce qui est cohérent. La navigation est brouillon
et déroutante. On ne comprend pas non plus pourquoi Editor a une
chartre graphique claire pour la sélection des rushes et une sombre
qui ne rappelle pas le reste de cette partie de l’appli pour l’édition.
• La partie Camera a la même charte graphique que n’importe quelle
application photo, ce qui favorise l’apprentissage et la prise en main.
Screenshot 12 à gauche un screenshot de la partie Editor niveau -1 (choix des rushes) et à
droite un screenshot de la partie Editor niveau -2 (l’éditeur)
21
7. SIGNIFIANCE DES CODES ET DENOMINATIONS
CHOISIR DE MANIERE APPROPRIEE LES MOTS ET LES SYMBOLES
UTILISES SUR UN SITE OU UNE APPLICATION.
Les icones sont bien choisies pour ce qui concerne la partie Caméra. Les
développeurs ont juste repris les standards des applis photo. Il en est tout
autre pour la partie Administration sur laquelle les icones et leurs significations
de sautent pas aux yeux et nécessite un temps d’apprentissage.
22
7. RESUME
1. GUIDAGE : 7/10
La partie caméra est parfaite et mérite un 9/10. La partie
Administration fait baisser la note car on s’y perd.
2. CHARGE DE TRAVAIL : 9/10
La partie caméra est parfaite et mérite un 9/10 car elle va à l’essentiel
sans aucune information superflue.
3. CONTROLE DES UTILISATEURS SUR LEURS ACTIONS : 7/10
L’application permet à l’utilisateur d’avoir une plus ou moins grande
liberté, mais cette partie peut être améliorée.
4. ADAPTABILITE DE L’APPLICATION AUX BESOINS DES
UTILISATEURS : 7/10
Des réglages standards, sommaires mais efficaces pour la prise de
photos, l’enregistrement vidéo et le calibrage du stabilisateur. Les
paramétrages de la partie Administration sont complétement inutiles
et n’ont presqu’aucun intérêt pour l’utilisation de l’application.
5. GESTION DES ERREURS : 5/10
L’application gère très mal les erreurs car elles manquent
d’explications et de call to action pour remédier aux problèmes
indiqués.
6. HOMOGENEITE ET COHERENCE DES CODES 5/10
En dehors de la partie Caméra, l’application manque de cohérence
dans les choix graphiques notamment au niveau des couleurs.
7. SIGNIFIANCE DES CODES ET DENOMINATIONS 6/10
Idem pour la partie précédente.

More Related Content

Similar to Analyse ergonomique de l'application Dji Go sur Androïd par Antoine Borzeix

Comment faire de bonnes photos et vidéos ?
Comment faire de bonnes photos et vidéos ?Comment faire de bonnes photos et vidéos ?
Comment faire de bonnes photos et vidéos ?SWiTCH
 
eosrt3-eos1100d-bim2-c-es.pdf
eosrt3-eos1100d-bim2-c-es.pdfeosrt3-eos1100d-bim2-c-es.pdf
eosrt3-eos1100d-bim2-c-es.pdfARTRGZ
 
Sauvegarder et restaurer l'état des applications mobiles
Sauvegarder et restaurer l'état des applications mobilesSauvegarder et restaurer l'état des applications mobiles
Sauvegarder et restaurer l'état des applications mobilespprem
 
Les logiciels d'animation image par image
Les logiciels d'animation image par imageLes logiciels d'animation image par image
Les logiciels d'animation image par imageRessources Ecole
 
Apprendre à faire des photos efficaces
Apprendre à faire des photos efficacesApprendre à faire des photos efficaces
Apprendre à faire des photos efficacesSud Vendée Tourisme
 
Comment trouver et fixer des memory leaks dans une app Vue/Nuxt
Comment trouver et fixer des memory leaks dans une app Vue/NuxtComment trouver et fixer des memory leaks dans une app Vue/Nuxt
Comment trouver et fixer des memory leaks dans une app Vue/NuxtJonathanMartin201
 
Tester, Monitorer et Déployer son application mobile
Tester, Monitorer et Déployer son application mobileTester, Monitorer et Déployer son application mobile
Tester, Monitorer et Déployer son application mobileMicrosoft
 
Microsoft experiences'16 - Tester, Monitorer et Déployer son application mobile
Microsoft experiences'16 - Tester, Monitorer et Déployer son application mobileMicrosoft experiences'16 - Tester, Monitorer et Déployer son application mobile
Microsoft experiences'16 - Tester, Monitorer et Déployer son application mobileAdrien Siffermann
 
Essai de mise en ligne Lisieux
Essai de mise en ligne LisieuxEssai de mise en ligne Lisieux
Essai de mise en ligne Lisieuxtdeszpot
 
Le guide de l'apprenti Graphiste
Le guide de l'apprenti GraphisteLe guide de l'apprenti Graphiste
Le guide de l'apprenti GraphisteOP1C
 
2-historique d'android.pdf
2-historique d'android.pdf2-historique d'android.pdf
2-historique d'android.pdfFethiBenYahia1
 
Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...
Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...
Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...Microsoft
 
DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...
DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...
DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...Olivier Destrebecq
 
Microsoft Windows 10 Technical Preview sur une machine virtuelle Virtualbox
 Microsoft Windows 10 Technical Preview sur une machine virtuelle Virtualbox Microsoft Windows 10 Technical Preview sur une machine virtuelle Virtualbox
Microsoft Windows 10 Technical Preview sur une machine virtuelle VirtualboxMaggiC solutions, Liège, Belgium
 

Similar to Analyse ergonomique de l'application Dji Go sur Androïd par Antoine Borzeix (20)

Af port view2 - Beginner
Af   port view2 - BeginnerAf   port view2 - Beginner
Af port view2 - Beginner
 
Af vue des portes - Débutant
Af   vue des portes - DébutantAf   vue des portes - Débutant
Af vue des portes - Débutant
 
Comment faire de bonnes photos et vidéos ?
Comment faire de bonnes photos et vidéos ?Comment faire de bonnes photos et vidéos ?
Comment faire de bonnes photos et vidéos ?
 
eosrt3-eos1100d-bim2-c-es.pdf
eosrt3-eos1100d-bim2-c-es.pdfeosrt3-eos1100d-bim2-c-es.pdf
eosrt3-eos1100d-bim2-c-es.pdf
 
Guide pratique appareil photo numerique
Guide pratique appareil photo numeriqueGuide pratique appareil photo numerique
Guide pratique appareil photo numerique
 
Sauvegarder et restaurer l'état des applications mobiles
Sauvegarder et restaurer l'état des applications mobilesSauvegarder et restaurer l'état des applications mobiles
Sauvegarder et restaurer l'état des applications mobiles
 
Les logiciels d'animation image par image
Les logiciels d'animation image par imageLes logiciels d'animation image par image
Les logiciels d'animation image par image
 
Proteger vos images
Proteger vos imagesProteger vos images
Proteger vos images
 
Eye tracking
Eye trackingEye tracking
Eye tracking
 
Apprendre à faire des photos efficaces
Apprendre à faire des photos efficacesApprendre à faire des photos efficaces
Apprendre à faire des photos efficaces
 
Avec pas de caméscope
Avec pas de caméscopeAvec pas de caméscope
Avec pas de caméscope
 
Comment trouver et fixer des memory leaks dans une app Vue/Nuxt
Comment trouver et fixer des memory leaks dans une app Vue/NuxtComment trouver et fixer des memory leaks dans une app Vue/Nuxt
Comment trouver et fixer des memory leaks dans une app Vue/Nuxt
 
Tester, Monitorer et Déployer son application mobile
Tester, Monitorer et Déployer son application mobileTester, Monitorer et Déployer son application mobile
Tester, Monitorer et Déployer son application mobile
 
Microsoft experiences'16 - Tester, Monitorer et Déployer son application mobile
Microsoft experiences'16 - Tester, Monitorer et Déployer son application mobileMicrosoft experiences'16 - Tester, Monitorer et Déployer son application mobile
Microsoft experiences'16 - Tester, Monitorer et Déployer son application mobile
 
Essai de mise en ligne Lisieux
Essai de mise en ligne LisieuxEssai de mise en ligne Lisieux
Essai de mise en ligne Lisieux
 
Le guide de l'apprenti Graphiste
Le guide de l'apprenti GraphisteLe guide de l'apprenti Graphiste
Le guide de l'apprenti Graphiste
 
2-historique d'android.pdf
2-historique d'android.pdf2-historique d'android.pdf
2-historique d'android.pdf
 
Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...
Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...
Concevoir une expérience SoLoMo (sociale, locale, mobile): retours d'expérien...
 
DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...
DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...
DevMobCA #16: Comment arrêter de perdre des clients sur votre site ou appli s...
 
Microsoft Windows 10 Technical Preview sur une machine virtuelle Virtualbox
 Microsoft Windows 10 Technical Preview sur une machine virtuelle Virtualbox Microsoft Windows 10 Technical Preview sur une machine virtuelle Virtualbox
Microsoft Windows 10 Technical Preview sur une machine virtuelle Virtualbox
 

Analyse ergonomique de l'application Dji Go sur Androïd par Antoine Borzeix

  • 1. ERGONOMIE ANTOINE BORZEIX DEUST TMIC 1 2016-05-10 ANALYSE ERGONOMIQUE DE DJI GO (L’APPLICATION SMARTPHONE DU DJI OSMO) CAMERA STABILISEE ET CONNECTEE Osmo est la toute nouvelle caméra de la marque DJI, célèbre pour ses drones Phantom. En plus d’être pilotable et réglable depuis un smartphone, cette caméra 4K est stabilisée sur 3 axes motorisés. Nous allons ici évaluer l’application de contrôle selon les critères de Bastien et Scapin.
  • 2. 2 SOMMAIRE 0. AVANT PROPOS 1. GUIDAGE 2. CHARGE DE TRAVAIL 3. CONTROLE DES UTILISATEURS SUR LEURS ACTIONS 4. ADAPTABILITE DE L’APPLICATION AUX BESOINS DES UTILISATEURS 5. GESTION DES ERREURS 6. HOMOGENEITE ET COHERENCE DES CODES 7. SIGNIFIANCE DES CODES ET DENOMINATIONS 8. RESUME
  • 3. 3 0. AVANT PROPOS PETIT TOUR D’HORIZON ET DÉCOUVERTE DU PRODUIT Caractéristiques techniques Les caractéristiques techniques du produits sont disponibles en détails sur le site du constructeur DJI et sur le DJI Store. Modes de prise en main de la caméra Pour bénéficier de la meilleure prise de vue à tout moment, on peut utiliser le stabilisateur DJI Osmo dans différents modes : • Upright : permet d’obtenir un plan large plutôt classique qui sera probablement le mode que vous utiliserez le plus. • Underslung : pour des prises de vues en position basse comme par exemple une prise de vue à ras du sol. • Flashlight : permet de tenir votre stabilisateur comme une lampe torche afin de filmer droit devant soit. • Portrait : permet de tenir l’Osmo de façon horizontale. Présentation du l’application DJI GO L’application DJI GO permet d’obtenir de nombreuses informations sur les paramètres comme l’ISO, la vitesse d’obturation, la focale, la correction de l’exposition, le nombre de photos restantes et l’autonomie de la caméra. Pour la photo • Prise unique : Normale, retardateur de 5 ou 10 secondes et HDR. • Photo rafale : Rafale à 3, 5 et 7 photos par seconde, bracketing d’exposition (AEB) pour réaliser 3 à 5 photos à 0.7EV.
  • 4. 4 • Panorama : Auto (la caméra tourne pour réaliser 8 photos pour un rendu 360°) ou Selfie (même principe mais la caméra est tournée vers le caméraman). • Intervalles : Les photos sont prises toutes les 5, 10 ou 30 secondes. • Timelapse : Possibilité de prendre des photos toutes les secondes si on désactive le format JPEG+Video. Une stabilisation est appliquée si l’on dépasse les 2 secondes d’intervalle. Pour la vidéo • Auto : la vidéo sera enregistrée en fonction des paramètres que vous aurez configuré dans les réglages. • Slowmotion : Enregistré en 1080p à 120 images par seconde. Environnement de test : Smartphone : LG G3 Taille d’écran : 5,5 pouces OS : Androïd 5.0
  • 5. 5 Méthodologie : J’ai choisi d’évaluer l’application DJI selon les critères de Bastien et Scapin car ils sont plus faciles d’accès par des non-spécialistes (comme moi) et permettent une évaluation plus large et l’utilisation de termes plus libres. Toutes les illustrations qui composeront la suite de ce document ont été prises par moi. Les photos de l’application sont des screenshots réalisées à même le téléphone.
  • 6. 6 1. GUIDAGE CONSEILLER, ORIENTER, INFORMER ET CONDUIRE L’UTILISATEUR TOUT AU LONG DE SON PARCOURS 1.1. Incitation dans les actions à effectuer Au démarrage de l’application, l’utilisateur peut sembler perdu et percevoir cette étape comme superflue. En effet, avant de pouvoir commencer à contrôler la camera pour photographier et filmer, il faut passer par l’étape d’ouverture de l’application. Cette étape passe par une page sur laquelle l’utilisateur peut effectuer plusieurs choix. Screenshots 1 Page d'accueil de l'application (à gauche l’appareil est reconnu et connecté, à droite il n’est pas reconnu mais l’application propose un tutoriel pour savoir comment procéder)
  • 7. 7 1. On nous confirme que nous utilisons une application pour contrôler le DJI Osmo. Il est à savoir que cette même application permet aussi de contrôler tous les autres appareils de la marques (drones Phantom, Inspire). 2. Par sa couleur, un bouton ressort par rapport aux autres. C’est un call- to-action qui invite l’utilisateur à se connecter à la Camera. 3. Learn more nous envoie vers le magasin en ligne de la marque. Son appellation est trompeuse. Il est grisé ce qui implique qu’il n’est pas recommandé d’appuyer dessus en premier. L’utilisateur le fera probablement par curiosité. 4. La série de 4 items (Equipment, Editor, Explore, Me) n’est pas assez explicite. Seuls Editor et Me ne nécessite pas de réflexion pour l’utilisateur. Editor ouvrant sur l’éditeur de vidéos et Me ouvrants sur l’interface de gestion de l’utilisateur. Equipment ici en noir nous indique vraisemblablement que nous sommes sur la page de l’équipement bien que nous soyons sur l’accueil de l’application. Cette partie n’est pas très claire. 5. Cette partie de l’application est destiné uniquement aux possesseurs de drones car elle regroupe les enregistrements de vols. Elle est donc superflue pour les utilisateurs de de camera Osmo. Le logo est plus ou moins bien choisi si l’on arrive à identifier ce que c’est. 6. Ce logo qui ressemble, pour moi, à un chapeau de diplômé donne accès au didacticiel de cours en vidéo pour apprendre à se servir du matériel. Il n’y a que deux vidéos concernant le Dji Osmo. Logiquement l’utilisateur se laissera guider et appuiera sur le bouton qui est le plus visible, celui du call to action, soit ici CAMERA. Dès lors, cet utilisateur identifie bien qu’il se trouve sur une application de prise de vue, grâce à une interface standard semblable à toutes les applications photo. Cette interface permet donc la visualisation des principales fonctions et actions possibles grâce à un regroupement des items plutôt classique. Regroupement qui s’appuie sur la théorie de la continuité et de la forme de la célèbre loi de Gestalt. L’interface est claire et va à l’essentiel.
  • 8. 8 Il n’y a aucune information superflue qui viendrait pourrait perdre l’utilisateur. La taille et les formes des items sont elles aussi particulièrement bien choisies pour capter le regard et permettre à l’utilisateur de savoir ce qui est cliquable ou non. Découverte de l’interface 1. En image principale, l’utilisateur a la visualisation de la prise de vue qui permet le cadrage. 2. À gauche, on retrouve tous les boutons que l’on retrouve habituellement sur une appli photo (comme l’appli Photo native d’Android en Screenshot 2). 3. À droite, se trouvent l’item de retour à l’accueil de l’application et les items de réglages qui mériteraient d’être plus identifiables comme items de réglages. 4. En haut, les informations sont un peu plus techniques et ne sont pas cliquables, elles avertissent sur les paramètres d’enregistrements actifs. Screenshot 2 Application DJI GO en mode photo
  • 9. 9 Screenshot 3 L'interface de l'application photo/camera native sous Android Il n’y a pas de fil d’ariane à proprement parler, mais grâce à un système d’onglets et de mise en surbrillance des items parents, l’utilisateur sait quel onglet il a ouvert et dans lequel il se trouve. Dans l’exemple ci-dessous l’utilisateur a ouvert l’onglet permettant de sélectionner le mode d’enregistrement vidéo (automatique ou slowmotion). La surbrillance de l’item Auto nous indique aussi que c’est pour le moment le mode qui est actif. Dans le screenshot 4 ci-dessus, nous remarquons le bouton rouge. C’est un call to action qui nous invite à commencer l’enregistrement. Screenshot 4 Choisir son mode d'enregistrement par onglet
  • 10. 10 Screenshot 5 Un autre exemple avec l'onglet de paramètres de prises de vue Screenshot 6 Un exemple d'onglets et de surbrillance aussi en mode photo 1.2 Groupement/Distinction entre Items Comme précisé dans le chapitre Guidage, les boutons sont assez bien agencés et leur regroupement permet une compréhension rapide.
  • 11. 11 1.3 Feedback immédiat Lors des actions effectuées, l’utilisateur est tenu au courant de la validation de cette action grâce au feedbacks. Néanmoins l’application DJI GO manque de feedbacks et souvent l’utilisateur ne sait pas si l’action demandée est en cours ou non. C’est le cas pour la plus importante d’entres elles qui est l’enregistrement. En effet, le rond du déclencheur devient un carré entouré d’un rond de même taille que le rond original. Il arrive que certains paramètres ne soient pas compatibles avec d’autres. C’est alors qu’apparaissent des messages pour en alerter l’utilisateur. Cette alerte ne propose malheureusement pas à l’utilisateur de changer les paramètres par un message de type « souhaitez vous modifier les paramètres – Oui ou Non » ni une redirection vers les dits paramètres bloquants et c’est dommage.
  • 12. 12 Screenshots 7 Messages d'erreur 1.4 Lisibilité Le police d’écriture, bien que très petite permet une bonne lisibilité, les logos sont assez explicites pour une personne habituée des applications photos basiques. Un réglage automatique de l’opacité du background des onglets, en fonction de la luminosité ou de la couleur des éléments filmés et donc en retour sur l’écran, aurait été appréciable pour faciliter la lisibilité. En effet, parfois cela devient peu lisible si l’image tire vers le blanc. Autre point, sur le screenshot ci-dessous le curseur est sur le logo photo, nous sommes bien mode photo et non vidéo. Ce curseur peut prêter à confusion et n’est à mon sens pas assez clair. Le choix de couleur grises et noires n’est pas judicieux. Une surbrillance bleue comme celle des onglets ouverts et des options actives aurait été préférable. Mais ce curseur est commun a n’importe quelle application photo. Vous aurez surement remarqué que des barres noires apparaissent sur les côtés lorsque nous passons en mode photo. Je vous précise que ce ne sont pas des barres mais uniquement le background noir qui
  • 13. 13 apparait. Ceci est du au fait que l’image passe en format 4/3 au lieu du 16/9 car je l’ai paramétré ainsi Screenshot 7 Bleu pour montrer l'actif, mais pourquoi pas partout ? 1.5 Localisation Comme traité plus haut, l’utilisateur peut se repérer aisément grâce à la surbrillance des titres des onglets ouverts. Le peu de choix et le fait que les onglets ne soient que d’un seul niveau pour les réglages principaux à gauche (un item -> un onglet, et non un item -> un onglet avec plusieurs items ouvrant plusieurs onglets …) évite à l’utilisateur de se perdre. Ceci permettant une navigation et un retour plus rapide en arrière. Pour les réglages plus techniques, dont on accède par les items à droite, c’est différent. Ceux ci sont composés d’onglets sous plusieurs niveaux mais une flèche permet un retour rapide au niveau supérieur. Il reste néanmoins facile de se rappeler dans quel item nous sommes et cela sans fil d’ariane, même si la présence de celui ci aurait été appréciable.
  • 14. 14 Screenshot 8 Onglet de niveau -1 de réglages caméra Screenshot 9 Onglet de reglage de niveau -2 sous Caméra
  • 15. 15 2. CHARGE DE TRAVAIL OPTIMISER LE NOMBRE D’ACTIONS DEMANDEES A L’UTILISATEUR 2.1. Brièveté (Concision & Actions Minimales) Je mettrai un mauvais point pour le fait de devoir passer par l’étape de la page d’accueil de l’application à chaque démarrage plutôt que d’atterrir directement sur la prise de vue. Il est aussi regrettable que tous les paramétrages concernant la prise de vue photo ou vidéo de soient pas dans un seul et même onglet. En effet, le choix de la résolution et de la vitesse (nombre d’images par seconde), pour ne citer que cela se fait par l’onglet accessible par l’item de droite alors que le choix de la vitesse d’obturation et des iso se fait par la gauche. Le pourquoi de ce choix de disposition m’échappe et j’espère que cela sera corrigé sur une prochaine mise à jour. 2.2. Densité de l’information L’interface de l’application permet à l’utilisateur de se concentrer sur sa prise de vue car elle n’est pas surchargée. Pour cela les développeurs ont préféré la sobriété et limiter le nombre d’informations présentes. Ceci va aussi de paire avec les choix de réglages et de fonctionnalités qui vont à l’essentiel. Bien que l’objet soit high-tech, l’utilisateur a un choix de réglages assez limité, peut être trop. Mais c’est ce qui permet de rendre ce produit accessible au plus grand nombre et de ce fait, d’en faire un produit grand public, non réservé à une élite de professionnels de l’image. C’est donc un choix marketing.
  • 16. 16 3.CONTROLE DES UTILISATEURS SUR LEURS ACTIONS LAISSER L’UTILISATEUR CONTROLER LE DEROULEMENT (INTERRUPTION, REPRISE) DE SES ACTIONS ET L’EN AVERTIR SI CE N’EST PAS LE CAS 3.1 Actions explicites Comme pour toute caméra et tout appareil photo muni d’un viseur électronique, à l’instar des réflex, chaque changement de paramètre influant sur le rendu de la prise de vue est visible automatiquement et immédiatement sur l’écran de retour. Par exemple si je change la vitesse d’obturation pour passer d’une vitesse rapide 1/500 à une vitesse d’obturation lente 1/50, l’apport de lumière au capteur sera visible immédiatement. Cela permet à l’utilisateur un réglage fin en fonction de ses besoins. Les réglages possibles pour la prise de vue photo et vidéo sont : • Les ISO • La vitesse d’obturation • Le nombre d’images par secondes • La possibilité de filmer à 120 images par secondes pour faire du slowmotion avec résultat final visible en temps réel lors de l’enregistrement. 3.2 Contrôle utilisateur Pourquoi ? ho pourquoi l’utilisateur ne peut pas éteindre facilement l’application depuis son écran de smartphone. Voici donc un gros problème sur cette application, il n’y a pas de bouton pour l’arrêter. Il y a néanmoins deux techniques : Appuyer sur le bouton d’allumage et d’arrêt de sur le manche du stabilisateur, cela propose d’arrêter le stabilisateur ou de le mettre en veille. Si l’utilisateur choisi Power Off, le stabilisateur s’arrête et l’application aussi.
  • 17. 17 Tout irait bien, si cela n’était pas aléatoire. En effet, parfois le message s’affiche et parfois non. Screenshot 10 Screenshot du choix d'arrêt ou de la mise en veille de appli L’autre solution consiste à passer directement par l’interface de l’OS Androïd par le biais d’un jonglage des doigts et de manipulations aléatoires. Le but étant d’accéder à la fenêtre ci-dessous pour pouvoir arrêter l’application. Screenshot 11 Arrêt depuis l'OS
  • 18. 18 4. ADAPTABILITE DE L’APPLICATION AUX BESOINS DES UTILISATEURS LAISSER L’UTILISATEUR PERSONNALISER ET CONTROLER UNE INTERFACE EN FONCTION DE SES BESOINS (NOTIFICATIONS, TABLEAUX DE BORDS, COULEURS …) 4.1 Fléxibilite L’interface de application n’est pas personnalisable et l’utilisateur devra se contenter de la disposition des éléments tels qu’ils le sont nativement. Néanmoins les réglages de prise de vue le sont et sont sauvegardés automatiquement une fois changés. 4.2 Prise en compte de l’expérience utilisateur L’application offre un espace profil à l’utilisateur. Celui-ci peut y sauvegarder les informations le concernant. L’intérêt est d’offrir notamment à l’utilisateur une sauvegarde de ses vidéos et photos sur un cloud et de les partager, mais aussi d’offrir la possibilité d’interagir avec d’autres utilisateurs via un forum ou avec le service après vente via des formulaires. L’utilisateur se sent important, privilégié et pris en compte.
  • 19. 19 5. GESTION DES ERREURS EVITER, REDUIRE ET CORRIGER LES ERREURS LORSQU’ELLES SURVIENNENT 5.1. Protection contre les Erreurs Bien que la totalité des items présents soient cliquables, les choix importants en noir se distinguent des moins importants en gris. Aucune erreur grave ou de déparamétrage par accident n’est possible depuis l’interface de prise de vue. Les paramétrages qui eux s’effectuent via les items de paramètres ; Camera pour tout ce qui incombe à la prise de vue, Gimbal pour tout ce qui incombe au contrôle multidirectionnel et 5.2. Qualité des Messages d’Erreurs Il est regrettable que les messages d’erreur, aussi peu nombreux soient ils, ce qui est une bonne chose, ne soient pas très clairs et ne permettent pas de remédier au problème depuis le popup, lorsqu’il s’agit d’une incompatibilité entre deux paramètres, comme cela peut être le cas sur d’autres applications.
  • 20. 20 6. HOMOGENEITE ET COHERENCE DES CODES CONSERVER LES CHOIX DE CONCEPTION ET CODES GRAPHIQUES POUR DES ELEMENTS ET ACTIONS SIMILAIRES POUR FAVORISER L’APPRENTISSAGE Comme évoqué précédemment, l’application se divise en deux grosses parties distinctes la partie prise de vue et contrôle du stabilisateur et la partie administration du compte avec tout ce qui va autour. Chacune des parties à sa propre charte graphique. • La partie Administration a la même charte graphique que le site internet de la marque ce qui est cohérent. La navigation est brouillon et déroutante. On ne comprend pas non plus pourquoi Editor a une chartre graphique claire pour la sélection des rushes et une sombre qui ne rappelle pas le reste de cette partie de l’appli pour l’édition. • La partie Camera a la même charte graphique que n’importe quelle application photo, ce qui favorise l’apprentissage et la prise en main. Screenshot 12 à gauche un screenshot de la partie Editor niveau -1 (choix des rushes) et à droite un screenshot de la partie Editor niveau -2 (l’éditeur)
  • 21. 21 7. SIGNIFIANCE DES CODES ET DENOMINATIONS CHOISIR DE MANIERE APPROPRIEE LES MOTS ET LES SYMBOLES UTILISES SUR UN SITE OU UNE APPLICATION. Les icones sont bien choisies pour ce qui concerne la partie Caméra. Les développeurs ont juste repris les standards des applis photo. Il en est tout autre pour la partie Administration sur laquelle les icones et leurs significations de sautent pas aux yeux et nécessite un temps d’apprentissage.
  • 22. 22 7. RESUME 1. GUIDAGE : 7/10 La partie caméra est parfaite et mérite un 9/10. La partie Administration fait baisser la note car on s’y perd. 2. CHARGE DE TRAVAIL : 9/10 La partie caméra est parfaite et mérite un 9/10 car elle va à l’essentiel sans aucune information superflue. 3. CONTROLE DES UTILISATEURS SUR LEURS ACTIONS : 7/10 L’application permet à l’utilisateur d’avoir une plus ou moins grande liberté, mais cette partie peut être améliorée. 4. ADAPTABILITE DE L’APPLICATION AUX BESOINS DES UTILISATEURS : 7/10 Des réglages standards, sommaires mais efficaces pour la prise de photos, l’enregistrement vidéo et le calibrage du stabilisateur. Les paramétrages de la partie Administration sont complétement inutiles et n’ont presqu’aucun intérêt pour l’utilisation de l’application. 5. GESTION DES ERREURS : 5/10 L’application gère très mal les erreurs car elles manquent d’explications et de call to action pour remédier aux problèmes indiqués. 6. HOMOGENEITE ET COHERENCE DES CODES 5/10 En dehors de la partie Caméra, l’application manque de cohérence dans les choix graphiques notamment au niveau des couleurs. 7. SIGNIFIANCE DES CODES ET DENOMINATIONS 6/10 Idem pour la partie précédente.