1. Thibault Perret CRMA 2009
inspiré par le groupe Rage Against The Machine
Dossier de conception
Entrez dans un monde qui ressemble étrangement à la réalité et
bouleversez l’ordre établi à votre façon pour rendre son sens au mot Unité

2. Synopsis du projet 3
Arborescences 4
Zonings 11
Chart Book 27
Charte technique 28
Charte éditoriale 29
Orientation graphique et sonore 32
Moyens de productions 35
Sommaire
2

3. Synopsis du projet
Rage Against the Machine est un groupe de fusion rap/métal fondé en 1991. Leur musique
et leurs textes rappellent, à ceux qui se laissent imprégner, que le monde est rempli d’injustices, et la
force de leurs actions oblige les plus indifférents à ouvrir les yeux.
Je souhaite retracer le parcours d’un groupe engagé qui n’a pas froid aux yeux, rendre
hommage à ces guérilleros de la Liberté, et développer un support permettant de connaître leurs idées,
leur musique, et surtout intégrer le visiteur dans un combat qu’il n’arrive pas à exprimer.
Pour cela, je souhaite construire un univers, saturé par des messages parasites provenant du
système: un pouvoir parodié , qui évoluera au fur et à mesure que l’utilisateur prendra conscience de la
vérité.
Au travers du parcours des ‘Rages’, je souhaite entraîner l’utilisateur dans une guérilla, et lui
donner les moyens de propager le message. Créer un film, déjouer les pièges de la censure, ou encore
délivrer un message sur des vecteurs inattendus dans une guérilla (Nabaztag).
Enfin, je souhaite positionner le groupe Rage Against the Machine dans le contexte dans
lequel il baigne, en réalisant une sorte de wiki, éditable par une communauté de passionnés, qui
pourront faire connaître leur propre groupe par ce biais, en ce positionnant à leur tour. Créer une
agglomération de contextes, pour que la communauté construise son ouverture sur le monde musical à
une vitesse exponentielle.
Rage Against the Machine, c’est un cri de détresse dans le système. Je souhaite faire de mon
projet un porte voix!
3

4. Faisant suite aux scénarii d’usages développés dans la lettre d’intention, les arborescences nous
donnent un bon aperçu des possibilités de chemins utilisateurs. Toujours en se plaçant du point de
vue de l’utilisateur, on peut se rendre compte des oublis.
Grâce à ses arborescences, on peut également avoir un bon aperçu des différents écrans dans leurs
successions, ainsi que les voies vers lesquelles mènent les choix.
Arborescences
4

5. Arborescence générale
Home
Vidéo accroche Identification
Inscription
Exploration
Validation
Wiki
La mare aux pavés
Lecture biographique
Propaganda!
Pavé dans la mare Mini jeu censure
Liens hypertextes
5

6. Arborescence détaillée
Création de clip
Création de clip
Nouveau projet Chargement projet
Importer vidéo Sauvegarder Combinaison Plan
Mettre de coté Publier
6

7. Arborescence détaillée
Clips en pagaille
Clips en pagaille
Recherche par pseudo Recherche interface
Visionnage
Notation Envois à un ami
7

8. Arborescence détaillée
Mini-jeu de censure
Mini jeu censure
Première écoute de la
chanson
Début du jeu
Score
Lecture des lettres
Entrée dans le top ten
ouvertes
Ecriture d’une
lettre ouverte
8

9. Arborescence détaillée
Wiki
Wiki
Navigation au fil
Recherche
des lectures
Lecture d’une fiche
& écoute d’extraits
Ajout article
Discuter
en rapport
Remise en question Ajout d’élément Discussion
Validation Validation Validation
9

10. Arborescence détaillée
Propaganda!
Web
Lancer action guerilla
Config’ nabaztag/SMS Lecture Propaganda
(Flashmob)
Écriture message
Ralliement ou boycotte
Nabaztag ralliement
Ya Basta! Guerilla radio! Diffusion suivant
Config. membres
Si actus
déjà lus
Récup config
Lecture des High scores
Actus RATM, site
du mini jeu Playlist Mail Nabaztag
Sms
Lecture playlist
Discours Zach de la Rocha
10

11. Tout en traçant une charte fonctionnelle, les zonings permettent de vérifier l’utilisabilité d’un produit
multimédia, de simuler la navigation, et repérer les oublis de navigation possibles.
Les zonings sont un outil de production qui permettra aux designers de travailler efficacement.
Zoning
11

12. logo
login
password
OK!
Inscription
Exploration de l’accroche dans le navigateur 12

13. Inscription
pseudo
password
email de confirmation
Les informations demandées restent à usage stricte d’identification
sur le site
OK!
Phase d’inscription 13

14. logo
. La mare aux pavés
. Pavé dans la mare
. CENSURE
Zone active
. WIKI
. Propaganda!
Zone active
Zone active
Zone active
Arrivée sur la page principale 14

15. logo
. La mare aux pavés
. Pavé dans la mare
. CENSURE
Zone active
. WIKI
. Propaganda!
Zone active
Vidéo parasite
Zone active
Zone active
Survol d’un zone active entraînant le parasitage de l’interface par le ‘système’ 15

16. logo
. La mare aux pavés
. Pavé dans la mare
. CENSURE
Zone active
. WIKI
. Propaganda!
Zone active
Lorem ipsum dolor sit amet, consectetuer
adipisci elit. Suavitate ita tu ad quin graeca
Zone active ut, quadam quae.. Sempiternum cadere etsi
Zone de texte
sine animum, epicuri doloris, nihil plane
+ lien-hypertexte, oucognitione ne
quoniam, scientia placebit vers mini-jeu
nullas quidem quia, erant iste id expetendas
ad aut et
En savoir +
Survol d’un zone active 16

17. logo
. La mare aux pavés
. Pavé dans la mare
. CENSURE
Zone active
. WIKI
. Propaganda!
Lorem ipsum dolor sit amet, consectetuer
Zone active
adipisci elit. Suavitate ita tu ad quin graeca
ut, quadam quae.. Sempiternum cadere quod
esse asperum quaerendi, et inmensae etiam
saepe fieri aut bonorum voluptatem philosophia
animum, solam.. Dissident disciplinam miserius, bonis voluptatem
philosophiae tamquam ea, quae omni ex etsi sine animum, epicuri
doloris, nihil plane quoniam, scientia placebit cognitione ne nullas
Zone active quidem quia, erant iste id expetendas ad aut et Lorem ipsum dolor sit
amet, consectetuer adipisci elit. Suavitate ita tu ad quin graeca ut,
quadam quae.. Sempiternum cadere quod esse asperum quaerendi, et
inmensae etiam saepe fieri aut bonorum voluptatem philosophia
animum, solam.. Dissident disciplinam miserius.
En savoir + 17

18. logo
fonds actions textes
. La mare aux pavés . Les clips
. Pavé dans la mare
. CENSURE Charger un projet
. WIKI Sauver/Publier
Preview Accueil
video
. Propaganda! << retour Preview
fond
categorie1 categorie2
Action/acteur
textes categorie3 Importer vidéo
cancel save
18
Interface de création de clip

19. logo
fonds actions textes
. La mare aux pavés . Les clips
. Pavé dans la mare
x
. CENSURE Charger un projet
. WIKI Sauver/Publier y
Preview video Preview texte
. Propaganda! << retour Accueil
Nommez votre oeuvre
Nom ici…
publier
fond
save couleur
police
Action/acteur Zone de saisie
taille
Défilement:
textes Aucun
horizontal
vertical
cancel save
19
Sauvegarde de la création.

20. logo
. Lamare aux pavés . La mare aux pavés
. Pavé dans la mare
Recherche :
. CENSURE
Rechercher un pseudo
. WIKI
<< Retour Accueil
. Propaganda!
Les différents clips sont tous visibles sur un même écran, déplaçables, ou lisibles par un clic. 20
Seront visibles, de façon aléatoire, les 10 derniers mis à jour, et les 10 mieux notés.

21. logo
Lecture d’un clip
Les différents clip sont tous visible sur un même écran, 21

22. logo
. La mare aux pavés . Pavés dans la mare
. Pavé dans la mare
Recherche :
. CENSURE
Fazermokeur
. WIKI
<< Retour Accueil
. Propaganda!
Résultats de recherche 22

23. logo Nom du groupe
. Wiki extrait1
Rechercher un groupe:
Nom du groupe extrait2
Ajoutez un groupe
extrait3
<<retour
<< Retour
Lorem ipsum dolor sit amet, consectetuer adipisci elit. Est iis recte
offendimur torquatus malum id nec difficilem, quam quae pertinerent
nihil nihil, alii in.. Dicit feramus possint propriae esse ornatum aeque
voluptatem, voluptas est diligi, oporteat morte nos, fieri animi eadem
quod, theophrasti magistra tota, omnis quoque exquisitis se, ob et
vide conciliant in finiri dici aut, huius si nobis et, libidinum videri ab ob
ut voce quod cum, non degendae, declinare natura dolores possimus
metu, admirer quaeque meo.. Ulla omnia amicos, repellendus non
pecuniae firmissimum, albucius tamen potest, non ut et ratione non
laudabilis apertam quam, esse.
Link: URL/blablabla.com
Meta: motclef1; motclef2; motclef3; motclef4
Débattre
23

24. logo
. Propaganda!
Prochaine guérilla
Place d’Italie: 11 Juin 14h
En cours de validation
Lille,Hôtel de ville: 14 Juillet 14h
Prochaine Guérilla
En cours de validation
Fazermokeur lance la guérilla
À 14h, le 11 Juin Place d’Italie
Appel à la révolte
Sujet de révolte:
Mes configs Lorem ipsum dolor sit amet, consectetuer adipisci elit. Moribus
natura constantia optimum satisfacit, copulationes natura
<< Retour
quantumcumque qui rerum poterit, de labore, dicturam
voluptatem neque nam bonum ab, vacuitate percipit res metu
graecum non tum legantur existimare mihi multi amicitiae
moveat venustate ad, interesse nisi quam aut aperta ii si,
existimavit et inducitur etsi, divelli in quem modum plane ea vitae
104 Guérilleros ralliant la cause
46 Renégats boycottant
Rejoindre la Guérilla Boycotter la Guérilla
Ecran de veille sur les événements guérilla (flashmob) 24

25. logo
. Propaganda
Prochaines guérillas
Place d’Italie: 11 Juin 14h
En cours de validation
Lille,Hôtel de ville: 14 Juillet 14h
Appel à la révolte
En cours de validation
Message:
Appel à la révolte
Mes configs
<< Retour
Lieu de révolte:
Date/heure:
Ce message sera publié sous ton pseudo. Seules les Guérillas rassemblant
2 fois plus de ralliements que de boycottes seront diffusées sur les supports.
Valider Laisser tomber
Ecran de lancement d’événements guérilla (flashmob) 25

26. logo
. Propaganda
Prochaines guérillas
Place d’Italie: 11 Juin 14h
En cours de validation
Lille,Hôtel de ville: 14 Juillet 14h
Configuration
En cours de validation
Par quel moyen la guérilla peut me prévenir d’une action?
Appel à la révolte SMS (mon numéro):
Mes configs
Nabaztag:
<< Retour Serial:
Token:
Nom:
Email (sera utilisé l’e-mail d’inscription )
Valider Laisser tomber
Ecran de configuration pour recevoir un message ‘Propaganda!’ 26

27. Le Chart Book se destine à construire les règles et conditions de production du projet.
C’est grâce à cela que rédacteurs, développeurs, intégrateurs, et graphistes pourront créer le produit
fini en cohérence avec la vision du concepteur.
Chart Book
27

28. Charte technique
• Supports de diffusion :
– Le projet est diffusé sur la toile. Le premier support est disponible sur le site web du projet. Lors de l’identification,
l’interface sortira du navigateur pour un affichage en plein écran 1024*768 pixels. Dans le cadre des actions ‘flashmob’,
les mobiles et nabaztags seront utilisés pour diffuser le message 2 jours, puis 1 heure avant l’événement.
• Spécifications techniques :
– L’interface sera gérée via flash AS3. Les membres du site seront enregistrés dans une base de données MySQL. PHP
récupérera les données utiles sous commande de flash, et renverra un objet XML, car AS3 est bien adapté pour le
parsage des objets XML. Un back-office de modération pourra être créé. Il s’agira d’une interface développée sous PHP.
– Pour la configuration du nabaztag, les langages PHP et Java sont nécessaires.
• Configurations nécessaires :
– Pour le projet know your enemy, un poste standard, sur n’importe quelle plate-forme équipée d’une connexion haut-
débit est suffisant. Il s’agit d’un site web, contenant une animation flash, le flash player 9 est donc nécessaire. Le site se
lançant en plein écran, il faut une résolution d’écran minimum de 1024 x 768 pixels.
Pluggin : Flash Player 9
Résolution écran : 1024x768 pixels
Mémoire : 512 Mo
connexion : ADSL haut-débit
28

29. Charte éditoriale
Le projet know your enemy tire son nom de l’intitulé d’une chanson des Rage Against The Machine(RATM), et a été choisie parce que
la plupart des fans du groupe ne connaissent pas ou très peu leur combat. Ce projet veut faire prendre conscience que la vérité ne
sort pas de la bouche des médias et des gros comptes industriels. Le système crée la division entre les classes, creusant un fossé
toujours plus important entre favorisés et défavorisés. Les RATM sont pour une redistribution des ressources menant vers l’unité.
L’utilisateurs va devenir membre d’une communauté subversive, majoritairement consciente des méfaits de l’économie occidentale
guidée par les majors états-uniens. Le site s’adresse également à des passionnés du groupe, et plus généralement, de musique et de
rock.
2 discours sont développés sur le site:
- celui de l’éditeur du site, qui se veut émissaire de l’idéologie des RATM. Ce discours s’adresse à un public averti, qu’il tutoie. Les
champs lexicaux se rapprochent des mots Guérilla, Bastion, Lutte, Justice, Musique, Rock. Le but est de pousser les gens aux
actes de rébellions en dénonçant le système.
- Celui du système, qui va essayer de corrompre l’utilisateur par des messages publicitaires parasitant le site. Ces messages
seront tantôt une dénonciation de la visite du site comme illégale, tantôt des incitations à la consommation de produit douteux
(viagra, casino en ligne, ‘‘you’re the winner’’,…). Les champs lexicaux se rapprochent des notions de bonheur, argent facile,
futur prometteur. Le but est de faire croire à l’utilisateur que le monde est beau et plein de promesses (utopique).
Idéalement, les textes biographiques du groupe RATM sur l’interface principal doivent être, dans un premier temps, assez court
pour être lu en moins de 30 secondes. Une version détaillée est prévue pour le clic sur ‘en savoir +’.
Le module de création d’événements flashmob se nomme ‘Propaganda!’
29

30. Exemple de contenu
• Discours de Zach de la Rocha le 27 Avril 2007 au festival Coachella sur la chanson Wake Up1
« Un bon amis à nous disait que si les même lois étaient appliquées aux présidents US comme elle l’ont été pour les nazis après
la secondes guerre mondiale, chacun des riches hommes blancs suivant la voie de Truman2(44-53), c’est sûr, auraient été
pendus à mort et fusillés. Et le gouvernement actuel ne fait pas d’exception. Il devrait être trainés, et jugés, et fusillés. Tout
comme un criminel de guerre doit l’être.
Mais le défi auquel nous devons faire face, va bien au-delà des élections! Bien au-delà de tous les 4 ans où l’on tire des leviers!
Bien au-delà de tout ça parce que tout ce système pourri est devenu si vicieux et si cruel, que pour se maintenir, il a besoin de
détruire des pays entiers, et profiter de leurs reconstructions, afin de survivre, et ça! Ce n’est pas un système qui change tous les
4 ans! C’est un système que nous devons faire tomber génération après génération après génération après génération!!!
REVEILLEZ VOUS! (WAKE UP!) »
1.Chanson qui dénonce les meurtres de Martin Luther King et Malcolm X présumé par le FBI présidé par J.E. Hoover
2.Truman est le président qui a lancer la bombe atomique et celui sous lequel est né le système pourri puisque c’est le début de la reconstruction de l’Europe,
puis la prise de conscience des pays en voie de développement
30

31. Les règles du wiki
• Le wiki permet à tous les utilisateurs de la communauté de participer, soit en créant des fiches sur des
groupes pas encore recensés, soit en proposant des améliorations d’articles à leurs auteurs.
• La fiche est constituée d’un article sur le groupe, de quelques extraits audio (30 secondes), de mots clefs
liant les groupes entre eux, de liens hypertextes pour une recherche approfondie, et pour valoriser la
véridicité de l’article.
• Pour rellier les articles entre eux, chacun pourra proposer un lien avec les articles, qui pourra être validé
soit par l’auteur de l’article lu, soit l’auteur de l’article à lier. Ce lien devra être justifié soit par une
anecdote, ou plus simplement par une phrase taguée.
• La fiche du groupe RATM ne sera reliée que par l’administrateur du site, pour éviter que trop de fiches
ne se retrouvent en lien direct.
• Les liens entre les fiches de groupes seront représentés graphiquement par des lignes reliant les
groupes. La fiche de groupe sélectionnée sera présente au centre du diagramme. Autour d’une fiche de
groupe sélectionnée, seront affichées les fiches de groupes ayant un lien direct avec celle du centre.
• Il y aura systématiquement 10 fiches de groupes accessibles.
31

32. Les règles du mini-jeu ‘censure’
• Le mini-jeu de censure se déroulera en 2 temps. Tout d’abord, une première écoute de la chanson à
censurer pour repérer les mots ou phrases à censurer, et lire les consignes. Ensuite, le jeu, avec un bip
pour la censure, et une vidéo avec des mots clef qui passent, et sur lesquels il faut cliquer pour censurer.
• Au final, l’utilisateur obtient un nombre de point calculé de la façon suivante:
– Vidéo
• Un mot cliqué par erreur : -3 points
• Un mot à censurer oublié: -1point
• Un mot à censurer cliqué: +1point
– Musique
• Un mot bipé par erreur: -3points
• Un mot à censurer non-bipé: -1points
• Un mot à censurer bipé: +1point
– Le score ne pourra pas être négatif.
• Lorsque le score est délivré, il faut rentrer son pseudo, et écrire une lettre ouverte, pouvant contenir une
revendication, une critique, ou un appel au rassemblement. Cette lettre devra être écrite de façon à ne
pas craindre la censure, pour pouvoir peut-être un jour la diffuser en toute liberté, et être sûr que la
propagande ne soit pas freinée.
32

33. Orientation graphique
• La charte graphique suit les codes de l’univers anarchiste. Les décors sont usés et désordonnés par des
années de lutte et de misère. Les teintes dominantes sont le rouge, le marron, le noir et les gris.
Orientation sonore
• Sur le site, comme pour le nabaztag, la musique utilisée sera celle du groupe Rage Against The Machine.
Sur le site, elle servira à appuyer le sentiment de rage envers le système en reprenant le dessus toujours
plus violemment sur les musiques et bruitages des parasites du système. Elle ne sera pas présente sur le
wiki, ni la création de mini-clip.
• Les bruitages d’interactions doivent faire ressentir la ‘bataille’ que livre les RATM, pour se faire,
j’utiliserais des bruits à base de douilles, des sons métalliques et aigus, qui pourront rappeler une pause
que fait le combattant dans un combat, pour réfléchir et se repositionner.
33

34. 34

35. Échéancier de production, et approche budgétaire
Moyens de Production
35

36. Echéancier
Production média vidéo
Sound-design
Production contenu éditorial
Recherche de visuels
Interfacing
Développement modules
Intégration
Phase de tests
36

37. Budgétisation
Prestations Jours Prix/jour Total€ HT
Production média vidéo 5 600 3 000
Sound-design 3 600 1 800
Production contenu éditorial 4 600 2 400
Recherche visuels 1 500 500
Interfacing 9 500 4 500
Développement modules 10 550 5 500
Intégration 2 500 1 000
Phase de tests 9 550 4 950
23 650
Total HT
37