Enseignement de l’IHM - CUIcui.unige.ch/isi/wud2011/pdf/wud2011-unige-gf-jg.pdf · ORIGINES /...

RETOUR SUR 10 ANS DE

DÉVELOPPEMENT DE

L'ENSEIGNEMENT DE L'IHM À

L'UNIVERSITÉ DE GENÈVE

Gilles Falquet

Jacques Guyot

Enseignants:

Gilles Falquet

Jacques Guyot

Eugène Horber

Patrick Roth

WORLD USABILITY DAY 2011

CONTENU

Origines et évolution de l'enseignement

Contenu actuel

Observations et leçons à tirer

ORIGINES / POURQUOI UN COURS IHM?

Création d'une équipe de recherche en Interfaces des système d'information

diffusion des connaissances acquises et des travaux réalisés

Généralisation de l'usage du Web, applications Web

importance du design des sites

Un problème récurrent en systèmes d'information

Des travaux d'étudiants ruinés par des interfaces déficientes

DES RÉFLEXIONS STIMULANTES

Le progrès c'est MOINS de fonctionnalités, pas plus

B. Buxton

D. Norman

hyper-text

project Xanadu

Augmenting the human intellect

T. Nelson

D. Engelbart

OBJECTIFS INITIAUX

Sensibiliser au problème de la création d'interfaces

une interface ça se conçoit

la présentation des données n'est pas neutre

Montrer des techniques

de visualisation

d'interaction

de création d'interfaces

de connexion de composants

http://cui.unige.ch/isi/cours/interfaces/ Printemps 2001

http://web.archive.org/web/20010805002243/http://cui.unige.ch/isi/cours/interfaces/

http://web.archive.org/web/20010609161438/http://cui.unige.ch/isi/cours/interfaces/annonce.html

RÉACTIONS

pas assez de "matière dure", enseignement difficile à concrétiser

Évolution

+ prototypage – développement

+ méthodes et modèles d'analyse

+ évaluation et tests d'utilisabilité

As far as the customer is concerned,

the interface is the product

Jef Raskin

CONTENU 2011

Introduction

Analyse des utilisateurs et du

contexte

Analyse des tâches

L’humain

La machine

L’interaction

Techniques d’interaction

Le prototypage à basse résolution

Principes ergonomiques

L’évaluation heuristiques

Conception de l’interaction

Les prototypes interactifs

Les tests d’utilisabilité

Visualisation des données

Principes de visualisatio des données

Composants d'interaction

WIMP, fisheye, lifeline Hypertextes

Génération d'hypertextes/documents

pour visualiser les bases de données

Interfaces

Machine-Machine

Architecture logicielle

des interfaces (MVC)

Recommandations pour le design Modèles:

humain – machine - interaction

Techniques d'interaction

WIMP, post WIMP, hypertexte

Techniques de conception

des interfaces

Prototypage basse résolution

Tests heuristiques

Prototypes interactifs

Tests d'utilisabilité

Analyse contexte, utilisateur

Analyse des tâches

APPRENTISSAGE PAR PROJET

Cours organisé selon les étapes d'un méthode de conception

Les étudiants réalisent toutes les étapes d'un projet

synchronisation cours – projet

temps limité => impossible de fournir toute la théorie nécessaire avant

chaque étape

Ananlyse

Contexte - Utilisateurs

Modèle des utilisateurs

et contexte

Ananlyse

Tâches

Modèle des tâches

Prototypage BF

Proto papier

Introduction

Analyse des utilisateurs et du contexte

Analyse des tâches

L’humain

La machine

L’interaction

Techniques d’interaction

Analyse des tâches

(Boddi & Shiming 2009)

Prototypes papier (basse fidélité)

(Ahmeti, 2010)

Proto papier

Test Rapport

Erreur

Evaluation

Heuristique

Rapport Expert

Prototypage MF

Proto interactif

Expert

« Utili-

sateur »

Proto papier' Le prototypage à basse résolution

L’évaluation heuristiques

Conception de l’interaction

Les prototypes interactifs

"Exécution" du prototype papier

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

http://www.youtube.com/watch?v=w6jyg10ixHE&feature=related

http://www.youtube.com/watch?v=8PhT0U5uhSI

PRINCIPES ERGONOMIQUES

Principes de Schneiderman, Tognazzini, Nielsen, ...

consistance

minimisation des erreurs

anticipation

utilisation de la loi de Fitts

utilisation des couleurs

ergonomie du texte

simplicité & design minimaliste

Par le mauvais exemple ...

25 WORLD USABILITY DAY 2011 © Uni Genève - G. Falquet, J . Guyot

26 WORLD USABILITY DAY 2011 © Uni Genève - G. Falquet, J . Guyot

Par le bon exemple ...

PROTOTYPES INTERACTIFS

Powerpoint

Runrev

(Ahmeti 2010)

(Escallon & Haussman, 2009) © Uni Genève - G. Falquet, J . Guyot 36 WORLD USABILITY DAY 2011

Planifiaction test

Proto interactif

Utili-

sateur Utili-

sateur

Plan expérimental

Tests d'utiisabilité

Rapport efficacité Rapport satisfaction

Les tests d’utilisabilité

Prototypes à haute résolution et

développement final

Soutenance

Analyse des tests

(Boddi & Shiming 2009)

(Ahmeti 2010)

NOS DEVISES

Observer: Tâche – Utilisateur - Contexte

Simplifier:

Eliminer certaines étapes (Business process)

Se focaliser sur la tâche principale

Soulager l’utilisateur (par processus automatique caché)

Ecarter le superflu (les trucs sympa … que personne n’utilise)

Invention (repartir de 0 – si nécessaire – critique de Win/Mac/Web)

Cultiver l’oubli de comment on fait jusqu’à maintenant …

Dépasser les impossibles …

Mesurer & valider avec les utilisateurs

INTEGRATION DE

LA TACHE

PERFORMANCES DES ÉTUDIANTS

Analyse des utilisateurs et des tâches : difficile

Prototypage papier : très bon

Tests : bien expliquer la typologie (détection d'erreurs,

heuristiques, utilisateurs)

Manque de culture scientifique ... chez les scientifiques

justifier scientifiquement un énoncé/choix, sortir de «on a pensé que ...»

utiliser les résultats scientifiques de l'IHM – qui ne sont pas des théorèmes

ROBUSTESSE DU PROGRAMME

Changements technologiques (mobiles, tablettes)

les principes restent les mêmes

développement d'un kit proto papier pour mobiles

aucun problème pour passer aux prototypes sur téléphones et tablettes

ré-utilisation de méthodes propres aux interfaces par écrans (TRIDENT)

Type de public

étudiants BA, MA

étudiants non informaticiens

formation continue : informaticiens, non informaticiens

LIENS AVEC L'INDUSTRIE

Intégration dans la formation continue Nouvelles technologies du

Cours pour praticiens (3 jours) (2010)

Demande de test d'un prototype par une entreprise

Evaluation

Heuristique

Rapport Expert

Experts

Étudiants

Proto interactif

COLLABORATION AVEC LA DIVISION

INFORMATIQUE DE L'UNIGE

Forte implication d'un collaborateur de la Dinf dans le cours

Projets en lien avec la Dinf

PANORAMA ROMAND

HEG - Informatique de gestion –> Ø

HEPIA - Ø

HEIVD - Informatique/Logiciel -> Infographie

HES FR – BSc info -, Interface homme-machine 1 et 2, Interfaces

Multimodales

UNIL - Ø

UNIFR – BA SI -> Ø, BSc CS -> Ø, MSc -> User Centric Design

UNINE /

EPFL – BSc , MSc Infographie, HCI, Personal interaction studio

Institution Bac. U Maitrise U

UNINE ( UNIFR)

HEIVD infographie

HES FR IHM 1

interfaces m. modales

UNIFR user centric design

EPFL infographie

personal interaction studio

HEG + HEPIA

UNIGE IHM interfaces avancées

DIFFICULTÉ DE L'INTRODUCTION D'UN

COURS IHM

Poids de l'histoire dans la construction des plans d'étude

Faible connaissance et sous-estimation de l'importance du

domaine

"C'est de la cosmétique"

"Il n'y a pas de théorie consistante"

peu d'offres d'emploi explicitant cette compétence

Peu de « textbooks »

HISTOIRE

Interaction conversationnelle 1985

au mieux formulaires, touches de fonction

programmation simple

readln(x)

writeln(y)

Focalisation sur

algorithmes, langages de programmation

bases de données et génie logiciel

réseaux et sécurité

gestion du matériel

DES INTERFACES ERGONOMIQUES

OU PLUS D’INTERFACES ...

... mais beaucoup de calculs

RÉFÉRENCES

Escallon, D., Haussman, J. (2009) Concept d'interface pour un e-

Portfolio, Cours ISI, Université de Genève.

Ahmeti, V. (2010) Thèmes et portails institutionnels, Cours IPM,

Université de Genève.

Boddi, J., Shiming, L. (2009) Définition du contexte et de la

technologie, analyse des utilisateurs et analyse des tâches. Cours

IPM, Université de Genève.

Enseignement de l’IHM - CUIcui.unige.ch/isi/wud2011/pdf/wud2011-unige-gf-jg.pdf · ORIGINES /...

Documents

Transcript of Enseignement de l’IHM - CUIcui.unige.ch/isi/wud2011/pdf/wud2011-unige-gf-jg.pdf · ORIGINES /...

fdgdfgdf gf gdf g

teture art culture ournal - isi-ska.ac.id

SKRIP KARYA TARI SAIRANDRI - ISI DPS

Correction TD GF IUT

GF Cohen - des chevaux et des hommes

ISI اصول مقاله نويسي.ppts1.iran-mavad.com/pdf96/ISI principles.iran-mavad.com.pdf · 2017-12-26 · isi ناﻮﺧاﺮﻓ رد جرﺪﻨﻣ تﺎﻋﻮﺿﻮﻣ و

ISI | Institut supérieur d'informatique

ISI 2009/2010

GF Forum 2009 Report en[2]

Méthodes en classification automatiqueantoine/Courses/Master-ISI/ISI-10/... · 2013-02-20 · Méthodes en classification automatique, ISI-10 Choix d’un critère ou d’un modèle

1. PROFIL DE L'INGENIEUR ISI .......................................................

Compil%26THL ISI-INI-PG-Enoncé

Introduction à l’IHM – M2105 TD n° 1users.polytech.unice.fr/~rey/cours/supports/ihm/TP1_IHM_M215_2016.pdf · Introduction à l’IHM – M2105 TD n° 1 L’objectif de cette

Thermo XPress Whip. - iSi GmbH ERP - Home

Introduction à l’IHM – M2105 TD n° 3

Les fondamentaux de l’IHM et du multimédia

GF-232 Manual - PROMAX

Ingénierie des Systèmes Intelligents (ISI) Ingénierie de l ...

DESS ISI Modélisation et implémentation d’une Mémoire ...

RACCORDS DE TUYAUX NORMACONNECT FGRfile/... · 2 Coupelle d’étanchéité EPDM/NBR EPDM/NBR EPDM/NBR EPDM/NBR EPDM /NBR 3 Insert de bande1) 1.4571/PA-GF 1.4571/PA-GF 1.4571/PA-GF