{ }Métaphores visuelleset conception

des interfaces mobiles

Travail Préparatoire de Recherche

Jules Monjarret

Master Conception Production

Ecriture Audiovisuelle et Multimédia

2012 - 2014

SommaireProblématique Introduction Formulation Plan proposéCarte heuristiqueAngles de recherche Ma démarche Pourquoi avoir choisi ces deux OS ? Pourquoi cette problématique ? MéthodologieBibliographie Concernant Forstall Concernant le skeuomorphisme Concernant l’interface Metro Concernant les métaphores visuelles Concernant l’affordance Concernant l’ergonomie Concernant le design d’interfaces Concernant les ressources développeurs Concernant le XEROX PARC

3 3 5 678 8 8 10 1113 13 14 15 17 18 19 20 23 23

3

}Problématique

En 2012, Apple annonçait le départ de Scott Forstall.

Qui est Forstall ? Il était depuis 2007 le responsable de

l’interface et du système d’exploitation d’iOS sur iPhone,

iPad et iPod.

Ce designer était un ardent défenseur du

skeuomorphisme : un élément de design dont la forme ou la

structure de navigation n’est pas directement liée à la fonction et qui reproduit de manière

ornementale un élément qui était nécessaire dans l’objet d’origine. Ce type de métaphore

visuelle permettrait, dans certains cas, d’augmenter considérablement l’affordance (la

capacité d’un bouton par exemple, à suggérer son utilisation et ses effets) des éléments

d’une interface. On peut trouver très facilement des exemples de skeuomorphisme à

travers les interfaces iOS dans les applications de la marque à la pomme : L’interface du

game-center par exemple, avec son tapis feutré, ses boiseries et ses boutons en forme de

jetons rappelant un casino, imaginée par Forstall mais choquante pour ses collègues, a

été fervemment défendue par Jobs. On peut également retrouver le bloc notes ou encore

l’horloge de la même façon qui sont respectivement représentés par un moleskine et une

horloge à aiguilles rétro. Sous la direction de Steve Jobs, qui adhérait en grande partie

aux idées de Forstall, les interfaces skeuomorphiques se sont multipliées depuis 2007

malgré le mécontentement d’une grande partie des designers d’Apple.

Introduction

4{ Avec la disparition de Jobs et la prise en main d’Apple par Tim Cook, les choses

changent : Forstall est évincé et Jonathan Ive - designer du matériel de la Pomme -

passe aux commandes du design global de la gamme, et donc des interfaces. Cette

nouvelle direction d’Apple pourrait entraîner un déclin de l’usage, parfois jugé excessif,

du skeuomorphisme dans les designs de la marque; surtout lorsque l’on connaît le goût

de Jonathan Ive pour les surfaces lisses et épurées. Il ne faut cependant pas oublier que

c’est ce même skeuomorphisme qui a fait le succès de la marque à travers toutes les

tranches d’âge.

Ci dessus l’interface du game-center d’Apple

On peut observer que même le logo du game-

center (ci-contre) est fortement skeuomorphique.

Les représentations iconiques des jeux sont

renforcées par une texture associée à ces jeux.

5

} Formulation Il y a donc deux “écoles” en matière de design d’interfaces : le minimalisme: dire

le plus possible avec peu, rechercher une affordance maximale; et le “réalisme”: montrer

ce que l’on veut que ce soit, tout simplement. Si nous voulons que notre application soit

une bibliothèque d’ebooks, alors nous représentons virtuellement une bibliothèque à la

façon de iBooks.

Cependant, la problématique posée lors des conceptions d’interfaces pour supports

mobiles est bien plus vaste que de simple considérations graphiques et visuelles. Même si

ces points sont importants, il n’en reste pas moins que le concepteur de l’interface passe

par des soucis ergonomiques, psycho-cognitifs, de contextes d’usages, de contraintes du

support, etc. Aussi, nous proposons la problématique suivante :

Toutefois le skeuomorphisme est bien plus ancien que cela. Le concept même de

la corbeille, utilisée en informatique pour se débarrasser de dossiers ou fichiers, est un

exemple probant de ce que nous allons appeler une métaphore visuelle.

Microsoft de son côté, a pris le parti opposé et propose avec Windows Phone

et Windows 8 des interface complètement épurées: les boutons rectangles et carrés

prédominent, accompagnés d’icônes minimalistes. Ces interfaces sont, de plus, basées sur

un système de grille rigoureux, ajoutant encore à la clarté des applications. Originellement

baptisé Metro, ce type d’interface semble inspiré de la charte du King County Metro

régissant les transports de Seattle, ville d’origine des deux foncateurs de Microsoft : Paul

Allen et Bill Gates. Aujourd’hui encore, le siège social de l’entreprise est basé à Redmond,

en banlieu de Seattle.

Cet épisode est l’élément déclencheur de nos recherches car le skeuomorphisme

n’est autre qu’une utilisation poussée de la métaphore visuelle à la fois d’un point de vue

esthétique pur, mais aussi dans une optique de navigation.

6{ Plan proposé Pour tenter de répondre à cette question, et dans un premier temps, nous définirons

et contextualiserons les concepts clés de ce sujet : La métaphore puis la métaphore

visuelle, l’interface, son historique et son état des lieux actuel, et enfin le support mobile,

ses contraintes et son contexte d’usage.

Dans une deuxième partie, nous analyserons plus précisément les dernières

interfaces de l’iOS et Windows Phone à travers leurs aspects graphiques. Nous parcourerons

également les documentations très fournies à destination des designers et développeurs

d’applications pour ces systèmes d’exploitation mobiles. Une analyse des métaphores

visuelles employées sera effectuée à partir de tests utilisateurs élaborés pour notre étude.

Nous nous efforcerons de faire ressortir de ces analyses une série de règles graphiques

et ergonomique tout en prenant en compte les contraintes du support précédemment

évoquées et l’analyse des métaphores visuelles effectuée en deuxième partie.

Comment concevoir des interfaces pour mobiles grâce à des métaphores visuelles à fort degré d’affordance en tenant compte des contraintes du support et des situations d’usage ?

7

}Carte heuristique

8{Angles de recherche Ma démarche

J’ai délibérément choisi de me focaliser sur les deux géants de l’informatique que

sont Windows et Apple et plus précisément sur leurs systèmes d’exploitation mobiles.

L’historique de ces deux franchises au destins liés m’a tout particulièrement intéressé.

D’autre part, ce sont les deux principaux systèmes propriétaires, et ils possèdent

chacun un département Recherche&Développement spécialisé mobile très intéressant

et très dynamique. Les mises à jours sont fréquentes, bien étudiées, et l’évolution de

ces systèmes est pour l’heure peu prévisible ce qui les rend à mon sens encore plus

intéressants.

Un autre point important, Android, le troisième grand OS (Operating System,

le système d’exploitation) est libre et de ce fait ne comporte pas de règles établies en

matière de conception et design. On se trouve donc en face de designs éparses et tout

peut etre différent d’une application à une autre. L’OS de Google se positionne donc en

concurrent indirect de iOS et Windows Phone, ou du moins ne joue pas avec les mêmes

règles de conception. C’est pour cette raison que j’ai choisi de l’écarter de cette étude

comparative.

Enfin, j’ai choisi de ne pas comparer non plus avec BlackBerry OS de RIM car les

téléphones BlackBerry, possédant encore des touches, leur navigation et interface est donc

forcément bien différente. Les contraintes ne sont pas non plus exactement les mêmes

Pourquoi avoir choisi ces deux OS ?

9

}(pas de tactile notamment). De plus, le BlackBerry se veut plus professionnel et se tourne

beaucoup vers les entreprises et moins vers les particuliers. Je suis cependant persuadé

qu’il faudra peu de temps à la firme canadienne pour proposer une nouvelle version

de leur OS et du téléphone avec une disparition du clavier et l’ajout des fonctionnalités

tactiles.

Même si les problématiques de conception de métaphores visuelles existent

également pour les autres OS (Android, BlackBerry OS ou encore Bada et LinuxMobile

dont je n’ai pour l’instant pas parlé), j’ai voulu analyser deux concurrents directs, jouant

sur les mêmes parts de marché et ayant le même type de firme. Finalement, la seule

différence réside dans le fait que l’iOS n’est vendu que sur des téléphones Apple alors

que Windows Phone est disponible sous HTC, Samsung et Nokia. À savoir, HTC vend

également des appareils sous Android et Samsung sous Bada alors que Nokia ne vend

plus que des appareils fonctionnant avec Windows Phone et ce depuis le contrat entre

les deux sociétés en février 2011.

Ci dessus les logos de Apple (à gauche) et de Microsoft (à droite).

10{ Pourquoi cette problématique ? Le sujet de cette problématique semble être la continuité directe de mes études.

D’abord intéressé par le graphisme, j’ai suivi des études dans l’art, et notamment l’art

numérique. Puis, intéressé par les différents aspects de la communication, j’ai poursuivi

sur une licence en information et communication ou je me suis éveillé à la psychologie,

au marketing, à la sociologie et aux sciences du langage. Aujourd’hui au sein du master

conception, production, écriture audiovisuelle et multimédia, ce sont les questions

d’ergonomie et, à nouveau, de graphisme qui retiennent le plus mon attention.

Au courant de l’année 2012, j’apprends le départ forcé de Scott Forstall d’Apple.

Je me suis alors intéressé à un concept qui lui est propre : le skeuomorphisme et plus

généralement les métaphores visuelles. De plus, les conflits présents au sein de l’équipe

de développement et de design d’Apple m’ont interpellés. Tous ces éléments m’ont

amenés à étudier les éléments graphiques constitutifs des interfaces que nous côtoyons

tous les jours dans nos applications, les sites web visités ou même sur le “bureau” de nos

ordinateurs.

Je me suis alors découvert une grande curiosité pour le design d’interfaces, qui me

semble alors être le sujet autour duquel j’ai gravité toutes ces années, regroupant toutes

les disciplines que j’ai aimé lors de mes études.

La question de l’interface mobile est venue naturellement, dans l’étude comparative

des téléphones de mes camarades. La question de la mobilité me parait être d’autant

plus intéressante qu’elle donne de nouvelles problématiques aux designers de par les

spécificités du support et de son usage.

11

} Méthodologie Face à ces nombreuses questions et champs d’analyse, je me dois d’établir une

méthodologie de recueil des données afin de canaliser mon sujet, mes recherches, et de

ne pas dévier de la problématique principale.

Ce recueil de données passe tout d’abord par une lecture approfondie des documents

traitant de ma problématique. Les documents peuvent être trouvés en bibliothèque mais

aussi et surtout sur Internet. La bibliographie traitera plus précisément de ces documents.

Cette collecte d’informations sera néanmoins la plus grosse partie de mon recueil de

données.

Dans un deuxième temps, après avoir mieux cerné le sujet et m’être créé une

expertise acceptable à travers la collecte d’informations, je me lancerai dans une batterie

de tests utilisateurs concernant l’affordance des options de navigation des deux systèmes

d’exploitation mobiles que j’ai choisi : iOS et Windows Phone. Les résultats des différents

tests servirons à établir une série de statistiques et de commentaires qualitatifs sur les

métaphores visuelles employées par les firmes de Redmond et Cupertino.

12{ Pour ce qui est du public cible de ces tests utilisateurs et de la taille du panel,

je rédigerais des tests plus larges où ma présence ne serait pas requise afin de mettre

ces tests en ligne et de pouvoir avoir le plus grand nombre de participants possible.

L’idéal serait trois cents (afin d’obtenir une certaine fiabilité statistique). Le public cible

étant les utilisateurs des systèmes d’exploitation mobiles sans restriction de tranche d’âge

même si l’idéal serait d’obtenir un pourcentage équilibré dans toutes les tranches d’âge

utilisatrices de téléphones intelligents. La seconde série de tests sera plus spécifique et

dirigée en fonction des résultats de la première. Aussi, ma présence sera nécessaire et le

nombre de sujets plus restreint. 2 individus, un de chaque genre, pour chaque catégorie

recensée lors des premiers tests. La catégorie socio-professionnelle n’est pas prise en

compte dans le choix du sujet mais influera sans aucun doute les résultats et devra être

prise en compte lors des tests.

J’aimerais également, mais sans en avoir encore apprécié la faisabilité, interroger

des designers professionnels, notamment dans le domaine du minimalisme, un courant à

la mode qui semble prendre dans le design d’interfaces moderne.

J’aurais aimé conduire plusieurs tests oculométriques pour parachever les tests

utilisateurs. Malheureusement, ces tests étant très coûteux, je ne pense pas que les

laboratoires possédant les machines nécessaires au suivi des mouvements oculaires

acceptent de me les prêter pour la durée des tests. Cela aurait cependant été une

expérience très enrichissante pour compléter la problématique.

13

}Bibliographie Concernant Forstall• Arnaud(29 Octobre 2012). « Scott Forstall quitte Apple, gros redéploiement dans le

management ». sur le site Mac4ever.com > http://www.mac4ever.com/actu/74825_

scott-forstall-quitte-apple-gros-redeploiement-dans-le-management

• Arnaud (1er Mai 2012). « Nouveau design, nouvelles méthodes, la patte de Jony Ive

freine iOS 7 ». sur le site Mac4ever.com > http://www.mac4ever.com/actu/79566_

nouveau-design-nouvelles-methodes-la-patte-de-jony-ive-freine-ios-7

• Apple,ApplePressInfo (29 Octobre 2012) «Apple Announces Changes to Increase

Collaboration Across Hardware, Software & Services». sur le site Apple.com > http://

www.apple.com/pr/library/2012/10/29Apple-Announces-Changes-to-Increase-

Collaboration-Across-Hardware-Software-Services.html

• BiltonetWingfield,Nick (31 Octobre 2012) «Apple Shake-Up Could Lead to Design

Shift». sur le site NYTimes.com > http://www.nytimes.com/2012/11/01/technology/

apple-shake-up-could-mean-end-to-real-world-images-in-software.html

• https://fr.wikipedia.org/wiki/Scott_Forstall

• http://fr.wikipedia.org/wiki/Jonathan_Ive

• Apple,ApplePressInfo « Jonathan Ive Senior Vice-President, Industrial Design». sur

le site Apple.com > http://www.apple.com/pr/bios/jonathan-ive.html

14{• Apple,ApplePressInfo« Jonathan Ive Senior Vice-President, Industrial Design». sur

le site Apple.com > http://www.apple.com/pr/bios/scott-forstall.html

• Feran, Benjamin (30 Octobre 2012) «Deux cadres d’Apple sanctionnés par Tim

Cook». sur le site LeFigaro.fr > http://www.lefigaro.fr/societes/2012/10/30/20005-

20121030ARTFIG00325-iphone-l-application-plans-fait-une-victime-chez-apple.php

Concernant le skeuomorphisme• Cronin, Shaun (13 Juillet 2012) «Skeuomorphism in Interface Design». sur le

site DesignModo.com > http://webdesign.tutsplus.com/articles/design-theory/

skeuomorphism-in-interface-design/

• Meri,Claude(1 Mai 2013) «The Flat Design Era». sur le site WebDesignLedger.com >

http://webdesignledger.com/tips/the-flat-design-era

• Innocente,Florian(11 Septembre 2012) «Interfaces : critiques sur le skeuomorphisme

d’Apple». sur le site Macg.co > http://www.macg.co/news/voir/257111/interfaces-

critiques-sur-le-skeuomorphisme-d-apple

• JKM«Skeu It!». > http://skeu.it/

• http://fr.wikipedia.org/wiki/Skeuomorphisme

• Carr,Austin(9 Septembre 2012) «Will Apple’s Tacky Software-Design Philosophy Cause

A Revolt?». sur le site FastcoDesign.com > http://www.fastcodesign.com/1670760/

will-apples-tacky-software-design-philosophy-cause-a-revolt

• Johnson,Maxime(30 Octobre 2012) «Le futur d’Apple: la fin des skeuomorphismes?».

sur le site MaximeJohnson.com > http://www.maximejohnson.com/techno/2012/10/

le-futur-d%E2%80%99apple-la-fin-des-skeuomorphismes/

15

}• DeWidth,Sebastian(30 Octobre 2012) sur le site Twitter.com > https://twitter.com/

sdw/status/263326598919516160

• Manjoo,Farhad(3 Décembre 2012) «Skeuomorphisme: une application Calendrier,

c’est mieux quand elle ressemble à un calendrier». sur le site Slate.fr > http://www.

slate.fr/story/64809/skeuomorphisme-bataille-design-apple-secteur-technologie

• Sahlin,Tobia(20 Avril 2012) «Skeuomorphism & Storytelling». sur le site TobiaSahlin.

com > http://tobiasahlin.com/blog/skeuomorphism-and-storytelling/

• Bilton, Nick (23 Avril 2013) «The Flattening of Design». sur le site Macg.co >

http://bits.blogs.nytimes.com/2013/04/23/the-flattening-of-design/?smid=tw-

nytimesbits&seid=auto

Concernant l’interface Metro• Wingfield,Nick (7 Janvier 2012) «The Critics Rave ... for Microsoft?». sur le site NYTimes.

com > http://www.nytimes.com/2012/01/08/technology/microsoft-defying-image-

has-a-design-gem-in-windows-phone.html?_r=0&adxnnl=1&adxnnlx=1367334363-

sCn08WQh5SkQa3WNunyswg

• Wauters,Robin(27 Décembre 2011) «Giving Windows Phone A Chance». sur le site

TechCrunch.com > http://techcrunch.com/2011/12/27/giving-windows-phone-a-

chance/

• Gilbert,Jason(27 Novembre 2011) «Windows Mango Review: Beautiful, Functional,

But Where Are The Apps?». sur le site Huffingtonpost.com > http://www.huffingtonpost.

com/2011/09/27/windows-mango-review_n_983268.html

• Pascoal,Daniel (14 août 2012) «Modern UI, le nouveau nom de l’interface Metro de

Windows 8». sur le site CnetFrance.fr > http://www.cnetfrance.fr/news/modern-ui-le-

nouveau-nom-de-l-interface-metro-de-windows-8-39775123.htm

16{• Pimenov,Sergeï(2012) «Create site in Windows 8 style now!» > http://metroui.org.

ua/

• http://en.wikipedia.org/wiki/Metro_(design_language)

• Vaugnan-Nichols, Steven J. (25 Mars 2013) «Windows 8 Metro interface Blues».

sur le site ZDnet.com > http://www.zdnet.com/windows-8-metro-interface-

blues-7000013036/

• LomasNatashaetLundenIngrid (19 Avril 2013) «Another Win For Flat Design As

Facebook Gives Its F Logo & Other Icons A Flatter, Cleaner Look». sur le site TechCrunch.

com > http://techcrunch.com/2013/04/19/facebook-goes-flat/

• Bugnion,Laurent «Metro Design Principles». Présentation sur le site Skydrive.fr >

https://skydrive.live.com/view.aspx?resid=40CFFDE85F1AB56A!1284

• Greif, Sacha (15 février 2013) «Flat Pixels: The Battle Between Flat Design And

Skeuomorphism». sur le site SachaGreif.com > http://sachagreif.com/flat-pixels/

• (11 avril 2013) «25 Best Examples of Flat UI Design Websites». sur le site

TheDesignInspiration.com > http://thedesigninspiration.com/articles/25-best-

examples-of-flat-ui-design-websites/

• War,Marc«FLAT UI DESIGN» sur le site Pinterest.com > http://pinterest.com/warmarc/

flat-ui-design/

• Waddington, Tom (19 Avril 2013) «Official Facebook Logo Updated». sur le

site CnetFrance.fr > http://tom.waddington.me/blog/2013/04/19/facebook-

logo/?utm_campaign=new-facebook-logo&utm_content=stage-1-1&utm_

medium=email&utm_source=chase-up

17

} Concernant les métaphores visuelles

• Arnaud(15 Novembre 2012) «Tendance du webdesign : Windows 8/Metro UI». sur

le site WebDesignerTrends.com > http://www.webdesignertrends.com/2012/11/

tendance-du-webdesign-windows-8metro-ui/

• Arnaud (18 Novembre 2012) «Ressources pour un webdesign au look Metro». sur

le site WebDesignerTrends.com > http://www.webdesignertrends.com/2012/11/

ressources-pour-un-webdesign-au-look-metro/

• Wilson,Mark (31 Octobre 2012) «The Inside Story Of How Microsoft Built The Windows

8 Brand». sur le site FastcoDesign.com > http://www.fastcodesign.com/1671119/the-

inside-story-of-how-microsoft-built-the-windows-8-brand#1

• Vasile,Christian (8 Novembre 2012) «Modern UI Style Design by Microsoft». sur le

site DesignModo.com > http://designmodo.com/modern-ui/

• «Les Métaphores visuelles.». sur le site er.uqam.ca > http://www.er.uqam.ca/nobel/

k23421/pdf/Metaphores_2002.pdf

• «Le rôle de la métaphore dans la conception de décors». sur le site ArtsAlive.ca >

http://www.artsalive.ca/collections/imaginedspaces/index.php/fr/activities-and-

resources/visualmetaphor

• David,Scott(1996) «Métaphore et métonymie visuelles. L’exemple de l’affiche de boxe».

sur le site Persee.fr. Extrait de Communication et Langages, Volume 109, pages 85 à 97.

> http://www.persee.fr/web/revues/home/prescript/article/colan_0336-1500_1996_

num_109_1_2705

• Colombari,Bruno (17 Novembre 2006) «Les métaphores visuelles de Joël Guenoun».

sur le site BrunoColombari.fr > http://www.brunocolombari.fr/+Les-metaphores-

18{visuelles-de-Joel+

• «Degré d’iconicité». sur le site Aasavina.free.fr > http://aasavina.free.fr/IMG/pdf/

degrA_c_d_iconicitA_c_.pdf

• (24 Aout 2004). «Echelle d’iconicité». sur le site Tecfa.unige.ch > http://tecfa.unige.

ch:8888/riat140/160

• http://fr.wikipedia.org/wiki/M%C3%A9taphore

• TheOpenUniversity (2004) «A short history of metaphor ». sur le site Web.Archive.

org > http://web.archive.org/web/20070101145805/http://tscp.open.ac.uk/t185/

html/resources/r2history.htm

• Nordquist, Richard «visual metaphor». sur le site About.com > http://grammar.

about.com/od/tz/g/vismeterm.htm

• «What Is a Visual Metaphor?». sur le site WiseGeek.com > http://www.wisegeek.com/

what-is-a-visual-metaphor.htm

• ThomasScott,BoatmanEdward,PolyakovSofya,MumenthalerJeremy,Wolff

ChrisetBrooksMatt > http://thenounproject.com/

Concernant l’affordance• Deleau,Michel(2006) «Psychologie du développement». Rosny - Collection Grand

Amphi.

• Boucher,Amélie (2011) «Ergonomie Web : pour des sites Web efficaces». Eyrolles -

Collection Accès Libre.

• Gibson,James(1977) «The Theory of Affordances. In Perceiving, Acting, and Knowing».

19

} Concernant l’ergonomie• Méli,Benoit(3 Février 2011) «Ergonomie : les règles d’or d’une appli mobile réussie».

sur le site JournalDuNet.com > http://www.journaldunet.com/ebusiness/internet-

mobile/ergonomie-applis-mobiles/

• Colombi, Teresa (12 Novembre 2012) «10 règles d’or de l’ergonomie pour les

mobiles». sur le site Blog.Ludo-TIC.com > http://blog.ludo-tic.com/10-regles-dor-de-

lergonomie-pour-les-mobiles/

• Busson,Jacinthe > http://www.ergophile.com/

• Tuvie«The Balance Mobile Phone Concept with Ergonomics Design». sur le site Tuvie.

com > http://www.tuvie.com/the-balance-mobile-phone-concept-with-ergonomics-

design/

• Feminella,Eric(9 Mars 2011) «Ergonomics of Mobile Touchscreen Design». sur le site

Editions Robert Shaw and John Bransford

• Norman,Donald (1988) «The Design of Everyday Things». Basic Books.

• Norman,Donald(1999). «Affordance, Conventions and Design». ACM Press.

• Gaver,William (1991) «Technology affordances». ACM Press

• Lockton,Dan(2 Octobre 2008) «Placebo buttons, false affordances and habit-forming».

sur le site DanLockton.co.uk > http://architectures.danlockton.co.uk/2008/10/01/

placebo-buttons-false-affordances-and-habit-forming/

• Soegaard, Mads «Affordances». sur le site Interaction-Design.org > http://www.

interaction-design.org/encyclopedia/affordances.html

20{EricFeminella.com > http://www.ericfeminella.com/blog/2011/03/09/ergonomics-of-

mobile-touchscreen-design/

• http://fr.wikipedia.org/wiki/Ergonomie

• http://en.wikipedia.org/wiki/Human_factors_and_ergonomics

• BoucherAmélieetDrouillatBênoit(2010) Design & Interface. Eyrolles.

• Nogier Jean-François, Bouillot Thierry et Leclerc Jules (2006) Ergonomie des

interfaces : Guide pratique pour la conception des applications web, logicielles,

mobiles et tactiles. Livre Numérique

• DeMontmollin,Maurice (1967) Les Systèmes hommes-machines, introduction à

l’ergonomie. Presses universitaires de France

Concernant le design d’interfaces

• https://fr.wikipedia.org/wiki/Interface_graphique

• https://en.wikipedia.org/wiki/Graphical_user_interface

• Akass,Clive (4 Octobre 2001) «The men who really invented the GUI». sur le site

ComputerActive.co.uk > http://www.computeractive.co.uk/pcw/pc-help/1925325/

the-invented-gui

• Tuck,Michael (13 Aout 2001) «The Real History of the GUI». sur le site SitePoint.com

> http://www.sitepoint.com/real-history-gui/

• Reimer,Jeremy (5 mai 2005) «A History of the GUI». sur le site ArsTechnica.com >

http://arstechnica.com/features/2005/05/gui/

21

}• HooberStevenetBerkman Eric(2011) Designing mobile interfaces. O’Reilly

• VandeKarElsetVerbraeckAlexander (2008) Designing mobile service systems. IOS

Press.

• JonesMattetMarsdenGary (2006) Mobile interaction design. Chichester.

• WarnerJanineetLaFontaine David(2010) Mobile web design for dummies. Hoboken

- Collection For dummies.

• SmashingMagazine(2012) Essentials Of Mobile Design: Not Your Parent’s Mobile Phone:

UX Design Guidelines For Smartphones. Smashing Media GmbH

• Zafar, Selma (1 Octobre 2009). «Introduction to Mobile User Interface». sur le site

SlideShare.net > http://fr.slideshare.net/OpenRoad/mobile-ui-design-user-centered-

design-and-ui-best-practices

• Lentz, James (26 Juillet 2011) «User interface design for the mobile web». sur le site

ComputerActive.co.uk > http://www.ibm.com/developerworks/web/library/wa-interface/

• Smith,Justin(9 Mai 2012) «Applying Fitts’ Law To Mobile Interface Design». sur le site

TutsPlus.com > http://webdesign.tutsplus.com/articles/design-theory/applying-fitts-law-

to-mobile-interface-design/

• (30 Aout 2010) «Designer d’interfaces mobiles». sur le site DesignersInteractifs.org > http://

ressources.designersinteractifs.org/metiers/designer-dinterfaces-mobiles

• Stark, Jonathan (16 Avril 2012) «The 10 principles of mobile interface design». sur le

site NetMagazine.com > http://www.netmagazine.com/features/10-principles-mobile-

interface-design

• Widrich, Léo (4 Février 2013) «Lessons We Learned from Our Biggest UX and Design

22{Mistakes». sur le site ComputerActive.co.uk > http://sixrevisions.com/category/user-

interface/

• Owoh,Brujo (8 Février 2010). «A Quick Look at Mobile Web Designs». sur le site SicRevisions.

com > http://sixrevisions.com/user-interface/a-quick-look-at-mobile-web-designs/

• Dawson, Alexander (18 Aout 2010). «Mobile Web Design: Best Practices». sur le site

SicRevisions.com > http://sixrevisions.com/web-development/mobile-web-design-best-

practices/

• http://en.wikipedia.org/wiki/User_interface_design

• «Qu’est-ce que le design d’interface ?». sur le site Use-Design.com > http://www.use-

design.com/fr/design/design_interface.php

• ChiaHwuetEvanKirchhoff (19 Décembre 2012). «Essential Mobile Design: Interface

Principles and Best Practices for iOS, Android and Windows Phone». sur le site SlideShare.

net > http://fr.slideshare.net/theevank/essential-mobile-design-interface-principles-and-

best-practices-for-ios-android-and-windows-phone-15702688

• Pettinati,Lucas(2 Octobre 2007) «Challenges of Interface Design for Mobile Devices». sur

le site YuiBlog.com > http://www.yuiblog.com/blog/2007/10/02/challenges-of-interface-

design-for-mobile-devices/

• Moll,Cameron(2008) «Mobile Web Design». First Edition

• CartmanJosephetTing Richard(2008) «Strategic Mobile Design». Peachpit Press

• Longoria,Roman (2004) «Designing Software for the Mobile Context: A Practitioner’s

Guide (Computer Communications and Networks)». Springer

23

}• Ballard,Barbara(2006) «Designing the Mobile User Experience». Wiley

• Kortum,Philip(2006) «HCI Beyond the GUI: Design for Haptic, Speech, Olfactory, and

Other». John Wiley & Sons

• Gunderloy,Mike(2006) «Developer to Designer». John Wiley & Sons

• Johnson,Jeff(2007) «GUI Bloopers 2.0: Common User Interface Design Don’ts and Dos».

Morgan Kaufmann

• Galitz,Wilbert(2007) «The Essential Guide to User Interface Design». John Wiley & Sons.

Concernant le XEROX PARC

Concernant les ressources développeurs• http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/

MobileHIG/Introduction/Introduction.html

• http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/

MobileHIG/Principles/Principles.html#//apple_ref/doc/uid/TP40006556-CH5-SW1

• http://msdn.microsoft.com/en-us/library/hh202915%28v=VS.92%29.aspx

• Sahlin, Tobia (16 Mai 2011) «Creation Myth : Xerox PARC, Apple, and the truth

about innovation.». sur le site NewYorker.com > http://www.newyorker.com/

reporting/2011/05/16/110516fa_fact_gladwell

• https://en.wikipedia.org/wiki/Xerox

• Zmoelnig,Christine«The Graphical User Interface». sur le site Sensomatic.com > http://

www.sensomatic.com/chz/gui/index.html

{ }© 2013