Dossier De Conception Ad L Zwk

Adèle Leyris

Dossier
de conception
CRMA 2009

L’expérience ZWK
« Je voulais peindre
ce qui ne se voit pas, le
souffle de la vie, le vent, la
vie des formes, l’éclosion
des couleurs et leur
fusion.»
Issu de deux cultures distantes, l’artiste chinois
Zao Wou Ki arrivé en Européen 1947 a fait exploser son
art en mêlant modernisme et abstraction à la technique
rigoureuse apprise dans son pays natale. Ce double
héritage le détache de tout autre artiste abstrait de son
époque, c’est pourquoi il a retenu mon attention.

Pitch : Est-il possible de rendre hommage à
un artiste sans montrer son oeuvre ? A travers une
expérience sensorielle, l’objectif sera de faire naître chez
l’internaute l’idée de cette oeuvre, avant même de l’avoir
vue, afin de mieux s’en imprégner et mieux comprendre
la démarche de l’auteur.

1.
l’expérience Zao Wou Ki
Dossier de conception

Introduction.................................................................................... 3

Support 1: Web

Partie 1 : Conception
fonctionnalités ................................................................................ 5
scénarii d’utilisation....................................................................... 8
zonings .......................................................................................... 9
Sommaire
Partie 2 ; Chart book
20
charte graphique et typographies ..............................................
charte éditoriale : intensions, registre, contenus éditoriaux ..... 30

Support 2: installation

36
fonctionnalités ............................................................................
ergonomie / principes ................................................................. 38

Moyens de production
planning ..................................................................................... 39
budget ......................................................................................... 40

2.

Introduction

J’ai choisi un support Web pour faire profiter un maximum de personnes de
cette expérience interactive et sensorielle.
Afin de vivre l’expérience à fond, j’aimerais mettre en place une installation
interactive grandeur nature.

Temps moyen d’utilisation :
>> Web : 20 min
>> Installation : 15 min

3.

Support 1 : Web

4.

Partie 1
Conception

fonctionnalités principales

Poste de
l’internaute

emails
Site en FULL FLASH encapsulé dans une page HTML avec des mots clés pour
plus de référencement.
telechargements

Site Internet
Le WEB Serveur

buzz diffusion
de contenu

5.

Partie 1
Conception

Arborescence

Home page

>

>
>

Etape 1 : Surface, Prolongez l’expérience avec
Galerie visiteurs
les limites de l’abstraction l’installation ZWK
>
>

>
Etape 2 : Archéologie Formulaire d’envoie
retrouver l’essence même d’une invitation
de la «substance créative» de Wou Ki
>

>

>
Etape 3 : Module d’appropriation
>

module photo

6.

Scénarii d’utilisation
Partie 1
Conception Scénario découverte
Arrivé sur ZWK.com par
un buzz

Scénario retour
lien ZWK.com en favoris

Etape 1 : Surface
Scénario
niveau expert
article installation ZWK
Arrivé sur ZWK.com en
tapant Zao Wou Ki sur
Google
Etape 2 : Archéologie

Etape 3 : Appropriation

Home

Galerie inscription pour invitation

il en parle autour de lui
Gallerie

validation

Favoris

7.

Partie 1
Conception

Grille de mise en page

Zao Wou Ki est un artiste abstrait
privilégiant le geste et la spontanéité. Mais
il a aussi reçu une culture de la rigueur très
pointue dans son pays natale.
C’est pourquoi la structure de mon site est
si importante.
Basée sur le nombre d’or et des symétrie
centrale (à l’orientale), cette grille permettra
de donner une impression de bonne
organisation de la page malgré un système
aléatoire apparent.

8.

Partie 1
Conception

Zonings

9.

Partie 1
Conception
Home page

son

animation Flash
tournant en boucle

10.

Partie 1
Conception
Etape 1 : Surface

son

l’Installation ZWK I contact I galerie
invitations au
clique ou à la
manipulation

vidéos en
drag and drop

« Surface » : Les limites de l’abstraction.
Interaction sur des vidéos et photos. Enchevêtrement de vidéos qui s’affichent aléatoirement et qui

11.
changent à chaque chargement de page. >> Expérience renouvelée à chaque visite.

Partie 1
Conception

Autres peintures :
Afin de découvrir les influences et l’histoire
de l’artiste chinois Zao Wou Ki, décortiquons son
couche par couche certaines oeuvres du peintre.
Vous disposez de 5 tentatives pour trouver les 5 bonnes réponses
sur chaque couches.


toile de Wou Ki

« Archéologie » : revenir à l’origine d’une oeuvre. Découverte d l’oeuvre couche par couche.
jeu ludique pour redécouvrir les techniques ancestrales chinoises qui sont encrées chez le peintre et qui ne l’ont jamais quittées.

12.

Partie 1
Conception

son

module «photo»


« Appropriation » : Module d’appropriation / lecture
Interaction de vidéos entre elles et avec l’action de l’internaute... Mélange de vidéo, graphisme, dessin, son...

13.
Trouver sa propre vision de ce qui l’abstraction. Faire appel à l’imagination.

Partie 1
Conception
Etape 3 : Appropriation > Photo

Retouchez votre image
avant de la publier ! son


Telecharger

Pat, con hendion henim dolore
voluptat augue vel iure euipisseUt am zzrillu
ptatum zzriliquisse et luptat, vel ut elis euguer
sim nos dolobor in vulluptat, PUBLIER

« Appropriation » : Module d’appropriation
Retouche de sa photo : cadrage / taille / contraste / orientation ...

14.

Partie 1
Conception
La Galerie

son


La galerie est un «lieu de rencontre» des images de tout les participants de cette expérience, sous la

15.
forme d’un large patchwork. Cela permet de découvrir comparer les expériences et la sensibilité de chacun.

Partie 1
Conception
Qu’est ce que l’installation ZWK ? > inscription

L’installation ZWK son

l’Installation ZWK I contact I gallerie
possibilité de
changer la photo
du header
Recevez une invitation gratuite à
Edito l’évenement ZWK à XXX XXX XXX !
um aliquisim nos adionlit
dolobor eraesequat dunt ad
dolorpIm quis ero od estrud Mlle Mme Mr
dipis am veniamet ing et, quat. Nom
Gue magna aliquis nos adionse Prenom
velit dolobor eraesequat dunt ad
Votre adresse email
dolorpagna aliquis nos adionse
velit dolobor eraesequat dunt ad
articles Envoyer
renouvellés
régulierement reception d’une
invitation
Article du 12/12/08
à imprimer
t num aliquisim zzrilla consequissi.
Im quis ero od estrud dipis am veniamet ing et, quat. Gue
magna aliquis nos adionse velit dolobor eraesequat dunt ad
dolorperilla facip el dolute feumsan enim do exeriurer ipsum
prate deliquisl illa faccum irit, veriuscidunt venismolor accum
num veril ex et ad digna facidunt lum del deliqua metuer
lhnkn .
> commentaires

commentaires
de gens qui ont
déjàvu l’expo

16.

Partie 1
Conception
Qu’est ce que l’installation ZWK ? > remerciements

L’installation ZWK son


Edito Merci !
um aliquisim nos adionlit Vous venez de recevoir un mail avec votre
dolobor eraesequat dunt ad inscription, vous permettant d’acceder
dolorpIm quis ero od estrud
gratuitement à l’Expérience ZWK au musée
dipis am veniamet ing et, quat.
XXXXXX
Gue magna aliquis nos adionse
velit dolobor eraesequat dunt ad velit dolobor eraesequat dunt ad
dolorpagna aliquis nos adionse dolorpagna aliquis nos adionse
velit dolobor eraesequat dunt ad velit dolobor eraesequat dunt ad >>> revivre l’expérience

Article du 12/12/08
t num aliquisim zzrilla consequissi.
Im quis ero od estrud dipis am veniamet ing et, quat. Gue
magna aliquis nos adionse velit dolobor eraesequat dunt ad
dolorperilla facip el dolute feumsan enim do exeriurer ipsum
prate deliquisl illa faccum irit, veriuscidunt venismolor accum
num veril ex et ad digna facidunt lum del deliqua metuer
lhnkn .
> commentaires

17.

Partie 1
Conception

Abstraction dynamique interactive
mes références

Interfaces Homme/ Machine
Il y eut ces 20 dernières années, de nombreuses expérimentations utilisant
les mouvements humains comme une interface de systèmes d’abstraction
dynamique.

18.

Un peu d’histoire:

>> Nous avons tous une vision, une signature spacio-temporelle
Wassily Kandisky : notion de synesthésie psychologique et d’ésthétique >
Abstraction Synesthésique 1926
interaction de l’artiste et son medium
Notre perception abstraite fait partie de notre méchanisme
de perception le plus faible >>> notions innée de la beauté,
John Maeda
partagées par tous les êtres humains !
metaphore musicale et analogique

Critères d’évaluation :
Paul Klee > Peinture abstraite dynamique 1920
> Peut-on utiliser l’instrument sans instructions ?
notion de temps
> Combien de temps peut-on utiliser l’outil ?
> Est-ce que notre personnalité se fait ressentir ?
Viking Eggeling
> Notre utlisation de l’outil peut-il s’améliorer avec le temps ?
> «universal language of abstract images»

Oskar Fishinger > Motion painting 1931
Nouveau mode d’expression. Il ne suit pas la musique mais apporte des
Les fondations de notre perception naturelle de l’environnement :
informations suplémentaires, un mode de communication différent que
> direction
celui de la musique, au lieu d’imiter sa structure temporelle.
> orientation
> courbure
Charles Dockum
> vélocité
Projecteur de couleur mobile 1940

1989 : exploration de l’animation abstraite par ordinateur

Travail autour d’une utilisation pour le corps plutot que l’esprit rationnel.
Arrivée de l’animation informatique par tracé humain
> Phénoménologie > comment la perception influence directement la
> mouvement non-méchanique, avec de la personnalité
conscience

19.

Partie 2
Chart book

Charte Graphique et Typographique

Afin de générer une idée d’harmonie, le site sera majoritairement constitué
de formes douces. Mais l’ensemble sera soutenu par des lignes droites évoquant
une certaine autorité et ramenant une certaine froideur caractérisant la culture
d’origine de Zao Wou Ki : La Chine.

Comme les tableaux du maître, les couleurs seront nuancées et «onctueuses»,
tout en restant éclatantes et toujours plus étonnante ou détonnante....

Typographies :
titres : Xenophone corps 14 pt
sous-titres ou textes d’introduction : DIN corps 12 pt

20.
blocs de textes : DIN corps 10 pt

Recherche et analyse stylistique
Les limites de l’abstraction ?

21.

Geste / écriture / automatismes

22.

Partie 2
Chart book

Influences, références
la nature
La synesthésie : association de plusieurs sens.
ex : Une couleur rappelant un son (Kandinski),
une forme rappelant un gout, etc...

23.

Partie 2
Chart book

Art numérique

John Maeda
> Language processing, motion painting

Experience design
Emotional design

24.

Partie 2
Chart book
Jeremy Blake <
retouches de vidéos
juqu’à l’abstraction

Animation abstraite

> «We work
for them» agency
3D

> «NIN visuals»
digital art

25.

diversité des techniques

26.

Zao Wou Ki

27.

Partie 2
Chart book

Recherche de logo

28.

Partie 2
Chart book 40 px
70 px 70 px

#fcde04
#e6ed91 60 px

#aecd00
#769b00 60 px

#3f5406
40 px
#181b0e

29.

Partie 2
Chart book

Charte éditoriale : intentions, registre

1. Qu’est ce qu’on dit ?
2. Qu’est ce que je dis ?
3. Qu’est ce que je veux qu’on dise ?

30.

Partie 2
Chart book

1. Qu’est ce qu’on dit ?
>> quelle idée ont déjà les gens de l’abstraction ?
Etape 1 : Surface, les limites de l’abstraction

Très peu de texte. L’internaute est un peu livrer lui même, mais il y a
suffisamment d’éléments incitatifs pour attirer son attention et le faire agir.

Interactivité I------------------------------------------------------------I
sollicitation intellectuelle I------------------------------------------------------------I
sollicitation émotionnelle I------------------------------------------------------------I

31.

Partie 2
Chart book

1. Qu’est ce que je dis ?
>> ma vision de l’oeuvre de Zao Wou Ki

Cette partie est beaucoup plus guidée et didactique.
On explique à l’internaute les règles du jeu.
Vouvoiement
principe du : «apprendre en s’amusant»


32.

Partie 2
Chart book

1. Qu’est ce que je veux qu’on dise ?
nous
>> ce que je veux qu’on retienne de l’experience :
avons tous notre sensibilité qui est liée à notre
histoire et qui se développe par le partage.

L’internaute est à nouveau livré à lui même, et c’est la curiosité qui le stimule.
C’est la dernière étape : Il a prouvé qu’il méritait d’être là et on le laisse s’impliquer
d’avantage dans l’interfase. Relation de confiance : «surprise de la fin»


33.

Partie 2
Chart book

Menu / navigation

L’avantage d’internet par rapport à tout autre support, c’est que
l’utilisateur a la liberté d’aller et venir n’importe où dans le site, à n’importe
quel moment.
C’est pour cela que les 3 grandes étapes de mon projet restent accessibles
dans n’importe quel ordre, bien que l’objectif initial était de garder une
certaine linéarité dans l’expérience.
Il y est cependant possible de montrer cette notion de temporalité par le
graphisme du menu.

<< Animation type du menu

34.

Support 2 : Installation

35.

Partie 1
Conception

fonctionnalités principales

logiciels nécessaires :
> Flash (Action Script 3) : animation et codage
> Adobe Audition : bruitage
> After effects : effet, animation

contenus /materiel :
> caméra numérique : capte la vitesse et le type de mouvement
> vidéo-projecteur
> tapis avec capteurs : capte la localisation de la personne et son poids

36.

«tout le corps au
Partie 1
Conception
service de l’esprit.»
Comme les grands
calligraphes chinois

mouvement lent Loin du tapis

mouvement
rapide

Contact tapis

37.

Partie 2
Chart book

Ergonomie, mouvement, principes

38.

Moyens
de production

Planning

conception technique
charte graphique
charte éditoriale

graphisme
prise de vue / son
animations / montages
Phase de conception sound design
Phase de production développement Flash
Phase de debuggage/ test tests et débuggages
>
> >
10 jours

39.

Moyens
de production

Enveloppe Budgetaire

Afin d’avoir de favoriser le référencement dans les moteurs de recherches,
il sera envisager de mettre en place une campagne de liens sponsorisés (par des
musées par exemples) sur une durée de 6 mois à compter du lancement du site.

Le devis qui suit, tient donc en compte toute la conceptualisation et la
création du site en ligne, (en passant par l’amortissement du matériel, la main
d’oeuvre supplémentaire éventuelle) ainsi que sa maintenance à long terme.

40.

Stratégie & conseil Internet 5 600 €

Conception, création, production & développement 15 000 €
> Organisation, arborescence
> Définition des principes graphiques et ergonomiques
> Prise de vue vidéo / photo
> Développement des animations Flash
> Développement du moteur du site
Détail du Devis
> Sonorisation /bruitages sur click
> Intégration des contenus
> Prise en compte des retours
> Test & debuggage
> Mise en ligne
Hébergement (durée 6 mois) 1 750 €
> Mise en place d’un serveur dédié
> location : 250,00 €/mois

Installation 10 000 €
Mesure et analyse d’audience 468 €
Conception, création, production
> Coût : 39,00 €/mois
> Développement des animations Flash
> Développement des interactions Vidéo/Homme
Gestion et suivi de projet 3 720 €
> Installation Technique
> Location / achat de matériel et lieu
Total
> Test & debuggage
36 538 €

41.

Dossier De Conception Ad L Zwk

Recommandé

Recommandé

Contenu connexe

Plus de gobz

Plus de gobz (6)

Dossier De Conception Ad L Zwk