Nicole Pignier et Benoît Drouillat. Penser le webdesign. Modèles sémiotiques pour les projets multimédias



Documents pareils
Les 10 étapes incontournables pour réaliser un site internet performant et accessible

IAFACTORY. sommaire MATERIALIZE YOUR NEXT SUCCESS. étude marketing, expérience utilisateur, ergonomie étude concurrentielle. principes.

AGENCE DE COMMUNICATION INTERACTIVE LES POSTES CLEFS EN AGENCE WEB

sentée e et soutenue publiquement pour le Doctorat de l Universitl

Méthodologie des projets de communication

L E C O U T E P r i n c i p e s, t e c h n i q u e s e t a t t i t u d e s

Dévéloppement de Sites Web

PLAN 1. A PROPOS 2. EXPERTISE 3. NOS RÉFÉRENCES 4. TECHNOLOGIES 5. CONTACT

LES CARTES À POINTS : POUR UNE MEILLEURE PERCEPTION

ers Pas vers le E-Commerce

Ce site intègre des technologies et fonctionnalités à la fois simples et très innovantes pour offrir une interface pratique et performante.

Maximisons les performances de votre stratégie digitale

R. A. A. Bébian. Mimographie, ou essai d écriture mimique. París, 1825

Brief créatif site e-commerce

Tux Paint. 1. Informations générales sur le logiciel. Auteur : Bill Kendrick et l équipe de développement de New Breed Software

WEB design. Pierre Chassany Comstone.ch vocables.com

Situation d apprentissage Les traits vivants avec le logiciel LopArt DUO (#P002)

demander pourquoi mon site n'apparaît pas sur google ou pourquoi mon site n'est pas référencé par les moteurs de recherche?

Rédiger pour le web. Objet : Quelques conseils pour faciliter la rédaction de contenu à diffusion web

Présentation Colibrix

DOSSIER FLASH «ASK.FM»

BABEL LEXIS : UN SYSTÈME ÉVOLUTIF PERMETTANT LA CRÉATION, LE STOCKAGE ET LA CONSULTATION D OBJETS HYPERMÉDIAS

Compte-rendu de la rencontre «Etre parent avec une tablette numérique» - le 9 avril 2013

UTILISER UN SITE COLLABORATIF


PROFIS Installation. Module 4: Module 3D Design

Toute personne souhaitant maîtriser les techniques liées à la conception de produits multimédia et à la création de sites Web.

Formation à la systémique pour consultants et personnels RH

MARIE VACHER MARIE VACHER

SPECIFICATIONS TECHNIQUES : Gestion des Médicaments et des commandes de médicaments

Concevoir son premier espace de cours sur la plateforme pédagogique Moodle

«Le portail unique des solutions de logement pour les seniors»

Trucs et astuces d un Expert Jimdo pour un site réussi

BOOK REFERENCES ERGONOMIQUES Gfi Informatique

DÉFINITION DE LA NEWSLETTER : OUVERTURE DU LOGITIEL ETARGET

William Pezet

C EST QUOI L ESPACE?

LE METIER DE CONSEIL EN ERGONOMIE OU D ERGONOME-

VOUS PRÉSENTE. 69, rue Gorge de Loup LYON // Tél. : // contact@o2sources.com

Première société de turbomédia en France

Méthodologie des projets de communication

FICHES MÉTIERS BY SHEFFERD

Cahier des charges pour la création d un site internet dédié au Matrimoine

SOMMAIRE. Accéder à votre espace client. Les Fichiers communs. Visualiser les documents. Accéder à votre espace client. Changer de Workspace

Un écrivain dans la classe : pour quoi faire?

M2S. Formation Management. formation. Animer son équipe Le management de proximité. Manager ses équipes à distance Nouveau manager

Créer un site Internet dynamique

numérique Votre rendez-vous mensuel Ergonomie et optimisation du taux de conversion du site internet (partie 2/2) Le tunnel d achat

IAFACTORY. sommaire MATERIALIZE YOUR NEXT SUCCESS. offres en architecture de l information cartographie. principes. objectifs.

Je sais utiliser. Logiciel gratuit de gestion des photos. Étude en 5 parties

FORMATION CONTINUE DÉTAIL DU PARCOURS.

Lancer et réussir sa campagne de collecte

AnaXagora LMS v3.0. Guide d utilisation

Académie de Créteil. Projet présenté autour de l album «Trois souris peintres» d Ellen Stoll Walsh

MEMOIRE DE SPÉCIALISATION

Créer et gérer des catégories sur votre site Magento

Portail collaboratif Intranet documentaire Dématérialisation de processus

Le nouvel acheteur de solutions informatiques. Les lignes d affaires adoptent les technologies Cloud Infobrief IDC, sponsorisée par Cisco mars 2015

ANICOTTE Guillaume GUFFROY Matthieu LIMA Juliette SALLOUH Chamsseddine CAHIER DES CHARGES SI 28

Les Ateliers Numériques avril Alboussière

Les différents parcours en S4

Un ordinateur, c est quoi?

I - Pour créer un site web

DGCIS Service de l industrie Sous-direction de la mode, du luxe, des biens de consommation et du design Bureau du design et de la création

LES APPRENTISSAGES DES ELEVES Qu est-ce qu apprendre?

CAHIER DES CHARGES SITE WEB : Steve Mind Magicien Close-up & Mentaliste - 1 -

Manuel utilisateur Netviewer one2one

Table des matières. Partie I La marque en idée Remerciements... XVII Avant-propos... XIX Introduction... 1

Présentation Intactile DESIGN

QUI SOMMES NOUS? Notre équipe se tient à votre disposition pour vous apporter de plus amples informations et vous conseiller.

LA NÉGOCIATION COMMERCIALE EN PRATIQUE

Manuel d utilisation 26 juin Tâche à effectuer : écrire un algorithme 2

Exemple de problématiques

Présenté par Cédric Piazza Directeur Général. Se lancer dans le E-commerce en 2015: Quelle stratégie gagnante??

Besoin d en savoir plus?

«Quand le territoire devient source d inspiration et souffle d expression créative : Présentation du Festival Art-Pierre-Terre»

L ARBORESCENCE. Qu est-ce qu un dossier? L arborescence?

DÉCOUVREZ L INTRANET NATIONAL PLÉIADE

iil est désormais courant de trouver sur Internet un document

PMA.. Quand l intelligence émotionnelle s invite dans le monde de l entreprise La méthode PMA La «Pensée Musicale Active»

1. Cahier des charges de la boutique en ligne ChezMike.fr

N avez-vous jamais rêvé d une nouvelle façon de faire un film? gettyimages.fr/film. Guide de l utilisateur

Utiliser le site Kahoot pour créer des quiz interactifs

Content Management System V.3.0. BlackOffice CMS V3.0 by ultranoir 1

Plateforme AnaXagora. Guide d utilisation

ATELIERS D ARTS à Paris

Fiche métier : Le Community Manager

Lycée polyvalent Langevin-Wallon Champigny sur Marne Val de Marne

VOLUME 1 CRÉATION D UN SITE WEB

c o n c e p t i o n Un savoir-faire et des experts pour concevoir des sites efficaces et durables

GRAVER LA PAIX Projet de création artistique collective dans le cadre des Rencontres de Genève Histoire et Cité Construire la Paix (

Connected to the FP World

LES RÉSEAUX SOCIAUX ET L ENTREPRISE

Solution informatique pour l accueil, le suivi et l accompagnement de l usager. DOCUMENT DE FORMATION «Volet administratif»

Cours Numération Mathématique de base 1 MAT-B Alphabétisation

Optimiser le référencement naturel de son site web

Bosch DCN Next Generation Applications

eevision 2 Guide utilisateur Mail : contact@naotic.fr Tél. +33 (0) Fax. +33 (0)

Comment protéger vos idées?

Transcription:

Nicole Pignier et Benoît Drouillat Penser le webdesign Modèles sémiotiques pour les projets multimédias 1

Plan de l ouvrage Introduction Première partie : Nourrir l inspiration créative dans les projets web I.1. Le brief créatif ou les instructions créatives. Pourquoi un brief? a. Penser la valeur ajoutée du média web b. Proposer des problématiques à résoudre, rationaliser l'approche créative. I. 2. Analyse des pratiques sectorielles et concurrentielles : le benchmark a. Sur quels critères repose le benchmark? b. Une méthodologie d analyse concurrentielle c. Exemple d analyse benchmark I.3. L'inspiration graphique : la conception de planches de tendances a. Pourquoi réaliser une planche de tendances? b. Exemples de planche de tendances pour la Samaritaine c. Réagir face à la standardisation de la communication en ligne : le cas de la typographie Deuxième partie : Aborder l expérience utilisateur II. 1. Définir la promesse d interface 2

a. Les types de site b. Les types de stratégies d énonciation c. Définition de la promesse d énonciation ou contrat de lecture. II.2. Pourquoi et comment formaliser l architecture de l information? a. L arborescence b. Le zoning c. Les différents modes de structuration spatiale et qualitative de la page d. Comment évaluer la pertinence de l organisation de la page web? II. 3. Règles ergonomiques et plastiques. a. Le concept d usabilité et les techniques d écriture fonctionnelles b. Le traitement de l information par l internaute : un message fort doit-il être traité en vision fovéale? c. Où placer les informations à traiter en vision fovéale? d. Travailler la qualité sensible d une zone d informations e. Comment l ergonomie et la plastique ouvrent le sens II. 4. l orchestration des genres dans le site. a. Comment un genre utilitaire tel l annuaire en lignepeut-il répondre à une promesse symbolique ou exploratoire? b. Comment orchestrer un genre commercial, incitatif et un genre institutionnel, persuasif? c. Comment allier dans un même genre information, persuasion et incitation? d. Les critères constitutifs d'un genre de communication II. 5 Scénariser l information : une narrativité pour le web a. Définir les acteurs et leurs rôles 3

b. Définir la structure du story-board c. Intégrer l internaute dans le scénario d. Penser une pluralité de parcours possibles dans le scénario e. Synthèse de la narration pour le web Troisième partie : l expression graphique des concepts III. 1. Pour une interactivité porteuse d interaction III. 2. Pour une écriture multimédia stratégique : gérer l orchestration des langages visuel, sonore, dynamique, verbal. a. L incorporation du langage verbal b. Les différentes rhétoriques d orchestration entre modalités c. Logiques, rhétoriques d écritures syncrétiques et stratégies d accès au sens III. 3. Communiquer à l international a. L uniformisation des cultures b. La pluralité ou juxtaposition des cultures c. L orchestration ou le métissage des cultures d. Bilan sur le traitement interculturel de la marque : le cas Renault III. 4. Donner un corps sensible à l information : des sens au sens a. Une expérience réelle de la polysensorialité b. Une expérience symbolique de la polysensorialité via le multimédia c. Générer des figures sensibles d. Figurer une expérience synesthétique 4

Conclusion Lexique Bibliographie 5

III. 1. Pour une interactivité porteuse d interaction Lorsque le webdesigner exploite les potentialités d animation des logiciels multimédias, il doit se demander quelles fonctions il attribue à l énoncé alors interactif. Est-ce pour signaler un lien? Est-ce pour faire rêver? Est-ce pour faire défiler du texte? Est-ce pour faire vivre un récit? Parce que l interactivité ne porte pas en soi de fonction spécifique dans la relation énonciateur/internaute, parce qu elle ne favorise pas obligatoirement l interaction- il convient de différencier les deux notions : interactivité /interaction. Nous retiendrons, en l occurrence, la définition que Philippe Quinton (Quinton, 2003 : 74) donne de l interaction des designs interactifs, différenciant bien l interactivité comme propriétés dynamiques et animations cinétiques des médias informatisés, de l interaction 1 comme construction d une relation entre énonciateur et co-énonciateur impliquant l internaute mentalement et physiquement. L intégration du mouvement l interactivité- dans l écriture verbale et/ou visuelle peut soit : - faire défiler du texte dans un espace restreint ; dans ce cas, l interactivité a une fonction pratique ou technique puisqu elle facilite et rend possible la lecture par déchiffrage, codage-décodage, dans une saisie dénotative. La relation à l internaute n engage pas de faire et être nouveaux. On dira alors que l interactivité n engage que peu d interaction autre que mentale. Il y a interactivité sans (ou presque) d interaction, le concept d interaction désignantrappelons-le-, l engagement, la participation physique et mentale de l internaute. On parlera d interactivité non ou peu interactionnelle ; 1 Il est courant, dans les ouvrages d informatique, d utiliser l un pour l autre le terme d interactivité et celui d interaction, ou encore celui d interactif (porteur d interactivité) et celui d interactionnel (porteur d interaction). 6

- impliquer une mémorisation même involontaire, retenir l attention de l internaute. La page d accueil de Samsung.fr, www.samsung.fr, prévoit sur le côté gauche des espaces dynamiques pour présenter des offres et des nouveaux produits en priorité. Ces zones interactives retiennent systématiquement l attention. Elles jouent sur les typographies, formes, couleurs animées pour aller chercher coûte que coûte l internaute. Ce type d interactivité engage une relation ou saisie analogique entre contenu et contenant facilitant la mémorisation par ancrage visuelle et sensible. L interactivité a une fonction pratique dans la mesure où elle fait défiler le texte de l offre et une fonction analogique dans la mesure où les images, les couleurs, les formes et tailles des typographies animées illustrent le contenu de l énoncé. Ce type d interactivité n est pas nouveau ; les spots télévisuels pratiquent largement la technique de l insistance polysensorielle. Simplement, sur le web, l interactivité pratique et analogique oblige l interaction au moins mentale, force l interaction physique par les tournures impératives clignotantes, souvent rouges, du type Cliquez ici. Autrement dit, ce type d interactivité soumet impérativement la participation mentale et sensorielle, voire physique ; on parlera d interactivité impérative fortement interactionnelle, l action et la pensée de l internaute étant ordonnées par l énoncé ; - animer l énoncé pour ouvrir un espace symbolique qui fonde de manière suggestive une participation imaginaire et sensible de l internaute. Le site de Dior, http://www.dior.com, ouvre les pages de collections women sur des animations du logo Dior fortement artistiques, faisant éclater les lettres de la marque en un bouquet, les métamorphosant en épée avant de se stabiliser en logo identifiable. En l occurrence, l énoncé devient une source sensible créant une interaction symbolique, poussant l internaute à s intriguer. Cependant, 7

la télévision sait produire ce type d interactivité qui ne débouche, pour le cas de Dior, sur aucune participation physique : l internaute ne peut pas agir sur le logo, il est spectateur passif sur le plan narratif. En outre, lorsque s affichent les pages de collection, la seule participation concrète se résume au passage de la souris à l écran au cours duquel s ouvre un bref descriptif des vêtements. Par l usage qu elle fait de l interactivité, la marque Dior établit ainsi pour ou contre son gré? - une relation à l internaute esthétique mais distante. On a affaire à une interactivité suggestive peu interactionnelle ; - animer l énoncé pour ouvrir un espace en devenir, sensible et narratif dans lequel l internaute peut se dépayser et s immerger, c est le choix par exemple de l agence Incandescence ayant réalisé le site d Yssey Miyake, http://www.isseymiyake.com. Les collections du créateur de mode font émerger un univers qui n est plus un décor à contempler mais un monde à parcourir et à vivre : l internaute peut réaliser un parcours narratif fait de multiples programmes ; à tel clic correspond tel événement, à tel passage, tel autre événement dans l énoncé. Ainsi, c est par interaction sensible et narrative que l internaute a accès à l univers symbolique donné en partage. Les animations ou interactivités qui ne donnent pas lieu à une implication narrative telle la page annonçant la collection printemps-été 2004 dans un énoncé polysensoriel qui évoque un monde exotique- sont ainsi équilibrées par d autres interactivités stimulant la participation de l internaute à la fois mentalement, corporellement. De surprise en surprise, le parcours favorise une représentation symbolique émotionnelle et intime au lieu d une représentation symbolique distante. Ce type d interactivité choisit de brouiller ou retarder la vue pour laisser place à la vision, au contact et à la respiration. Il place l énonciateur 8

dans une forme de sensibilité spécifique, dans une manière de donner en partage une énonciation singulière. Il s agit d une esthésie, du grec aisthèsis, c est-à-dire d une forme de connaissance sensible ou forme de sensibilité (Ouellet, 2000 : 24). On parlera alors d interactivité suggestive fortement interactionnelle. Enfin, l absence d interactivité n est pas forcément synonyme d absence d interaction sensible et mentale ; certaines pages, à l instar d images inédites, travaillent le flou et le dépaysement de la pensée via le son et/ou la vue et/ou le contact évoqué par la texture. On parlera alors d interaction non interactive, puisque les outils numériques ne sont pas utilisés dans leurs potentialités cinétiques. Ceci dit, certains sites comme celui du restaurateur Fauchon, http://www.fauchon.fr, présentent leur marque et leurs produits sur le web un peu comme ils le feraient sur support papier : la pauvreté plastique du texte et des images plus fonctionnels qu esthétiques ne déploient que peu les valeurs rarissimes, originales et recherchées revendiquées par la marque Fauchon. L absence d interactivité se double en l occurrence d une absence d interaction sensible et narrative : quelques liens permettent par simple utilité de passer d une page à l autre, sans que l énoncé puisse faire émerger un monde à vivre. Fauchon.fr exprime un univers statique. On n a alors ni interactivité ni interaction véritable. Voici les articulations logiques des différents types d interactivité avec l interaction : 9

Articulations de l interactivité et de l interaction Créer des animations, cela engage des choix dans la promesse internaute/annonceurs qu il convient de préciser en fonction des valeurs que la marque veut exprimer. Le directeur artistique doit s interroger sur la cohérence stratégique entre les objectifs du site, les valeurs de la marque et/ou des produits, les différents types d interactivité qu il utilise ou qu il n utilise pas. Les animations interactives soulèvent une autre question, de l ordre de l écriture multimodale ; comment, en fonction des stratégies de communication choisies, gérer l orchestration entre les différentes modalités visuelles, verbales, sonores, cinétiques? Autrement dit, sur quelles rhétoriques d orchestration multimodale se construisent les stratégies démonstrative, monstrative ou imagée, mythique, ou encore exploratoire? 10