RAPPORT FINAL / DUT MMI - TARBES MéTIER DU

RAPPORT FINAL / DUT MMI - TARBES
Métier du multimédia et de l’internet /
ancenis enzo / arnaud mathieu
mortele axel / claire COSTE
renier marvin / flores cindy
SOMMAIRE
/Introduction
p02
/LOGO p03/04/05
TACHE DE L’IDENTITE VISUELLE
RESUME DE LA TACHE
PRODUCTION
/Site web p06/07/08
RESUMÉ DE LA TACHE
PHASE DE REFLEXION
PRODUCTION
Objectifs fixé et objectifs atteint
/Print
p09/10/11
Présentation du projet
Avancement du Projet
Difficultés rencontrées
Pendant les JPO
/Annexes
p11 à 29
/CONCLUSION
p30
iut-tarbes-mmi_rapport final_journée porte ouverte_page01
INTRODUCTION
Cette année, le groupe Signalétique –
In Situ avait pour tâche de réaliser la
communication pour les JPO. L’objectif étant
d’attirer des futurs étudiants à l’I.U.T. et de les
faire participer au jeu transmédia afin qu’ils
découvrent de manière ludique la formation
dispensée en MMI.
Plusieurs actions ont été menées afin de
réaliser cet objectif.
iut-tarbes-mmi_rapport final_journée porte ouverte_page02
TACHE DE L'IDENTITE VISUELLE
Tâche Logo / Charte graphique / Print
RESUME DE LA TACHE
La charte graphique se définit à la base
comme un document de travail qui contient
l’ensemble des règles fondamentales d’utilisation
des signes graphiques qui constituent l’identité
graphique d’une organisation, d’un projet,
d’une entreprise. Pour la réalisation de
cette tâche, notre objectif a donc été
de présenter les règles d’utilisation de
’identité visuelle pour l’événement des portes
ouvertes.
Suite à ce travail nous avons soumis une
planche de tendance (annexe 1 : croquis
(2 à 17) à notre commanditaire qui nous a
exprimé un intérêt vis à vis d’une proposition
en particulier (voir ci-dessous)
Ainsi seront présents dans la charte graphique :
- Le logo de l’événement, sa typographie…
- Les éléments de la tâche Web (la
structure du site, l’ensemble des pages…)
- Les éléments graphiques de chaque
support imprimable (affiches, flyers…)
Cette tâche se résume donc à être en lien
direct avec les autres tâches, elle a pour
objectif de se mettre à jour en insérant les
règles d’utilisations en fonction de l’avancée
des tâches.
Travail en amont du nom officiel de
l’événement
Le nom de l’événement a mis du temps à
être déterminé, c’est pourquoi nous avons
commencé un travail de recherche en amont
afin de faciliter et d’accélérer la création
du logo car nous avions une contrainte de
temps.
Premièrement nous avons réalisé un travail
de recherche web et graphique sur les
images et les représentations associées au
multimédia, au robot NAO, à l’aspect jour/
nuit qui est la temporalité de l’événement, du
monde de l’informatique et du digital. Ces
éléments sont le cœur de la formation et
surtout de l’événement à promouvoir.
La même planche a été envoyé à notre
professeur tuteur. Celui-ci nous a indiqué
que les propositions y compris celle qui
avait intéressée le commanditaire n’était
pas réellement en adéquation avec les
contraintes graphiques et nous a soumis des
idées de logos pour rediriger notre travail.
Suite à cela nous avons reçu le nom officiel
des JPO.
iut-tarbes-mmi_rapport final_journée porte ouverte_page01
PRODUCTION
Travail en aval du nom officiel de l’événement
Le travail du groupe est donc repartit de
zéro. Nous avons repris nos recherches
graphiques puis soumis nos propositions
à notre professeur tuteur. Ces nouvelles
propositions (annexes 2 (croquis-v2 ( 2 à 5
)) ont satisfait à la fois notre professeur et
le commanditaire qui a validé un des logos.
( croquis-v2 (1) )
iut-tarbes-mmi_rapport final_journée porte ouverte_page03
Nous nous sommes alors lancés dans la retranscription digitale de ce logo en le
vectorisation via Illustrator.
Semaine inter-semestre
Plusieurs déclinaisons ont alors été proposées et un logo définitif a été validé. Avec une
typographie sans serif, sans empattement avec un aspect géométrique.
Logo pour la JPO :Le personnage est la représentation des personnes entrant dans l’événement.
La barre verticale symbolise le passage de l’interface entre la réalité et le numérique sous la
forme d’une porte d’entrée, celle de la JPO. Une fois que le personnage passe la porte, il se
pixelise sur la partie droite du logo.L’emplacement du mot
« IMMERSIONS » du côté gauche montre les visiteurs qui s’immergent, ainsi le mot
« DIGITALES » du côté droit montre la digitalisation de chaque visiteur entrant dans les portes
ouvertes.
iut-tarbes-mmi_rapport final_journée porte ouverte_page04
Nous nous sommes alors penchés sur les autres éléments composant la charte graphique (voir
annexe : charte graphique 1.0.)
Tout comme le logo et la typographie, les éléments graphiques seront composés de visuels
géométriques simples.
Il nous a rapidement semblé évident de reprendre les couleurs de l'IUT et de les associer à
d'autres couleurs inspirées du flatdesign, des couleurs basiques et minimalistes.
Nous avons ensuite décliné les éléments graphique notamment les couleurs pour
les adapter aussi bien à une utilisation web (RVB) qu'à une utilisation Print (CMJN)
Objectifs fixés / Objectifs atteints / Réflexion sur la tâche
Le logo devait représenter l'événement des portes ouvertes qui traite ainsi de notre formation
MMI et donc du multimédia.
La charte graphique a eu pour unique objectif l’adoption de règles pour un même thème visuel.
C’est-à-dire que chaque code couleur, chaque typographie utilisée soit la même pour chaque
tâches.
L’objectif a été pleinement atteint, malgré un départ difficile notamment dû au retard de
l'annonce officiel du nom de l’événement.
Ensuite la charte graphique, la typographique ainsi que la colorimétrie ont été trouvé rapidement,
nous avons retouché la colorimétrie pour que celle-ci soit adaptée pour le web et pour le print.
Le logo et la charte graphique ont bien été utilisés dans l’ensemble des supports de
communication.
Plusieurs éléments nous invitent à une réflexion quant à l’utilité de la charte graphique.
En effet au début du projet, nous nous demandions à quoi bon réaliser une charte graphique,
serait-elle vraiment d’une grande utilité ?
Nous n’imaginions pas alors l’ampleur du projet et le nombre de documents auxquels nous allions
avoir à faire.
Son utilité est ainsi apparue évidente.
Nous avons put constater que notre travail sur la charte graphique fut très utile dans la
réalisation esthétique du site web et du print et qu'elle a permit un gain de temps et de
productivité évident.
Ce gain de temps et de travail nous a grandement aidés à la réalisation du projet JPO.
iut-tarbes-mmi_rapport final_journée porte ouverte_page05
SITE WEB
Création site web / Journées Portes Ouvertes
RESUMÉ DE LA TACHE
Un site internet permet d’offrir une visibilité
optimale comparée à tout autre dispositif de
communication car il est accessible partout
une fois en ligne. La possibilité de modifier
les éléments tout au long de la phase de
communication est également un avantage.
Cela nous permet d’être plus pertinent et
efficace et ainsi de rendre notre site dynamique.
Nous avons dû évaluer les différentes
contraintes avec le commanditaire. Le site
dois rendre compte de l’évènement lors de
la journée porte ouverte et ainsi mettre en
valeur la formation mmi à travers les différents
pôles d’activité tels que le graphisme, la
production audiovisuelle, la photographie, et
l’informatique.
PHASE DE REFLEXION
Nous nous sommes inspirés de plusieurs sites
basés sur la même structure, c’est-à-dire des
sites one page. Les sites one page sont
des sites battis en une seule page. Un site
basé sur ce principe nous a particulièrement
inspiré, http://Nasaprospect.com.
Nous
voulions reprendre l’idée du cosmonaute
comme élément graphique principal en le
remplaçant par le robot NAO et intégrer
des contenus en rapport avec les journées
portes ouvertes. (voir plus grand annexe 1)
Suite à cela nous avions l’idée, en collaboration
avec le groupe charte graphique, d’intégrer
au site un style graphique épuré. Un
graphisme du style Flat design, à savoir des
couleurs et un design plat, avec des éléments
graphiques simples. (voir plus grand annexe 2)
N’ayant aucunes directives au niveau
graphique et technique nous nous sommes
laissé une certaine liberté concernant l’aspect
visuelle finale du site. Cependant nous nous ne
sommes pas attardés sur l’aspect technique,
à savoir le développement. Cela nous a par
la suite causé des soucis. En effet, l’animation
du robot Nao nous demandait beaucoup de
temps, que nous n’avions pas, mais également
des compétences en développement plutôt
technique.
La validation de la charte graphique par
M. Boularand (commanditaire du projet), à
savoir le logo, les couleurs et la typographie,
nous a donné les premières bases, nous
permettant de commencer la conception du
site web.
PRODUCTION
La phase de conception a débuté lors de
la semaine intersemestre. Le groupe site web
à obtenu l’aide de 3 étudiants à cette occasion : Louis Debraine en première année
et Léo Heitz et Nicolas Gruwé en deuxième
année.
Nous avons repartit les différentes taches lors
iut-tarbes-mmi_rapport final_journée porte ouverte_page06
de cette semaine en fonction des différents niveaux de compétences technique de chacun. Les
tâches se sont repartit au fur et à mesure de la semaine.
Nous avons commencé a développer la navigation du site avec un menu. Trois menus ont
été proposé avant de sélectionner le définitif. Tout d’abord, un menu circulaire a été testé,
malheureusement ce dernier ne s’adapté pas au mode de fonctionnement d’une architecture
one page. Nous avons donc décidé de tester un second menu latéral. Ce menu apparaissait au
survol de la souris à gauche de l’écran. Cependant ce menu a rencontré le même problème que
le précédent. Au final, nous avons trouvé un menu s’adaptant parfaitement à notre architecture.
(annexe : photos menu). Nous avons donc intégré un menu fixe en haut de la page, contenant
les différents liens qui permettent de naviguer à les slides.
Le slide représente une page sur le site dédié à un évènement proposé lors des journées
portes ouvertes. Chaque lien sur le menu correspond à un slide. (ci-dessous)
Les éléments graphiques ont été réalisés en collaboration avec le groupe print afin de permettre
de garder une cohésion graphique sur l’ensemble du projet. (annexe 4)
iut-tarbes-mmi_rapport final_journée porte ouverte_page07
Concernant le contenu du site nous avons
collaboré avec les différents groupes de
PTUT afin de récupérer des images, du texte
ou encore des vidéos en rapport avec leurs
projets.(annexe 5) Le contenu a été rédigé
par les groupes s’occupant des événements
afin de donner des informations détaillés des
ateliers proposaient lors des journées portes
ouvertes.
L’ensemble des éléments technique et
graphique ont été intégré pour donner le
résultat final. Le site a été mis en ligne et a
permis de donner une meilleure visibilité de
l’événement.
Objectifs fixé
et objectifs atteint
Notre principal motivation a été de
proposer un site web à l’architecture moins
conventionnel que la plupart des standard
afin d’utiliser des technologies récente et
de donner envie aux visiteurs de naviguer
simplement en montrant le fait qu’il est
important pour nous de rester à l’écoute
des technologies récentes. Par ce biais notre
objectif été de montrer les compétences en
création de site web, promouvoir l’évènement
« immersion digital » ainsi que promouvoir le
département SRC/MMI ainsi que l’IUT.
Le site achevé nous nous sommes rendu
compte que nos objectifs ont été atteints,
autant d’un point de vue technique que de
la communication autour de l’événement.
iut-tarbes-mmi_rapport final_journée porte ouverte_page08
PRINT
Groupe signalétique / Journées Portes Ouvertes
Présentation du projet
Cette année, le groupe Signalétique – In Situ
est composé de Cindy Flores et Axel Mortelé
pour les responsables de Ptut ainsi que de
Clothilde Royer, Amélie Mondolonie, Audrey
Brugat, Soraya Boulac, Mélissa Quéral,
Clément Pouyatos en tant qu’aide lors de la
semaine inter semestre.
Outre les personnes affectées à la tâche,
nous pouvons également citer les différents
acteurs et commanditaires de la tâche. Les
principaux acteurs ont été la direction de
l'IUT (qui commandite la tache), Mr Boularand
en qualité de commanditaire intermédiaire,
Mr Mikolajczak en tant que professeur Tuteur,
le service communication et l'ensemble des
départements de l'IUT.
Cette tâche avait pour objectif d’attirer
des futurs étudiants à l’I.U.T. et de les faire
participer au jeu transmédia afin qu’ils
découvrent de manière ludique la formation
dispensée en MMI.
Plusieurs actions ont été menées afin de
réaliser cet objectif :
•Les Flyers (annexe 1 et 2): durant l’évènement,
les visiteurs se verront délivrer un flyer de
400x200mm faisant office de programme
ainsi que de support pour l’enquête. Un plan
a été intégré afin d’aider les visiteurs lors des
journées portes ouvertes.
•Les affiches (annexe 3): différentes affiches
ont été réalisées certaines annonçant les
différents évènements se déroulant pendant
les journées portes ouvertes(en A3),
et
d’autres expliquant la complexité de certains
atelier (en A4).
•Les tickets de métro (annexe 4): ce sont
en fait des supports ce type carte de visite
en papier cartonné qui adopte une forme
inspirée de vieux tickets de métro. Ces tickets
de métro ont pour but de faire parler des JPO
dans les lycées et donc aux futurs étudiants.
La tâche a débutée lorsque les bases de
la charte graphique furent posées. Elle ne
se termina qu’à la fin des 20 ans. En effet,
elle comptait également comme objectif
l’affichage et la suppression des différents
supports de communication mis en place.
Nous avons tout d’abord réalisé un état des
lieux sur ceux qui avaient été utilisés par le
passé. Par la suite nous avons établi une
série de supports susceptibles d’être utilisée
pour l’évènement. La semaine inter semestre
nous a ainsi permis de réaliser ces supports
en coordination avec les autres groupes et
les commanditaires.
Nous avons très vite identifié notre cible
comme étant les futurs étudiants donc
notre communication devait surtout plaire
aux jeunes. Cela se traduit principalement
par un visuel fort et attrayant plutôt qu’une
grande quantité d’information, les jeunes sont
curieux et débrouillard, si quelque chose les
interpellent ils feront des recherches d’eux
même et c’est là que le site internet des
journées portes ouvertes intervient.
•Comment obtenir une unité visuelle dans
la communication papier et web ?
La charte graphique laissant une grande
part de liberté, nous avons cherché, avec
le groupe Web, à avoir une identité visuelle
proche voire commune. Nous avons donc
décidé d’utiliser des aplats de couleur en
concordance avec la charte graphique
bien évidemment. Ces aplats serviront de
fond pour les affiches et les flyers. Ensuite nous
avons convenus de pictogrammes communs
pour représenter les différents évènements.
Le reste de la charte graphique a complété
notre unité visuelle.
•Comment obtenir les meilleurs prix pour
minimiser au maximum les dépenses en
impression?
Pour obtenir les meilleurs prix il nous fallait
iut-tarbes-mmi_rapport final_journée porte ouverte_page09
comparer les différents tarifs des imprimeurs
capables de réaliser l’impression des supports
de communication. Or cette tâche est longue
et fastidieuse. Heureusement Pierre Garcia
nous a conseiller une personne qui compare
et s’occupe de commander chez l’imprimeur
le moins cher dans les environs de Pau. Nous
avons donc fait appel à cette personne
pour l’impression de notre communication.
Avancement du Projet
La semaine inter-semestre
Réalisation flyer
Nous avons réalisé deux types de Flyers
un flyer jour, pour tous les visiteurs des
journées portes ouvertes, et un flyer nuit
pour l’ensemble des personnes présentes
pendant la nuit des JPO.
•Le flyer jour : (annexe 1)
De couleur rouge, le flyer rouge est aux
couleurs de l’I.U.T. L’ensemble du flyer a été
réalisé en accord avec la charte graphique
que ce soit pour les couleurs comme pour les
typographies.
En première page, nous avons utilisé les lettres
de l’abécédaire que nous avons réalisé
à partir de lettres découpées dans des
journaux et des magazines afin d’écrire le
titre « Menez l’enquête » qui rappelle le style
des lettres anonymes que l’on peut voir dans
certains films ou séries. Nous avons également
placé le logo des Immersions Digitales.
En deuxième page, une présentation du jeu
transmédia permet aux visiteurs de prendre
part à l’enquête, l’encadré blanc servant de
bloc note où les visiteurs pourraient inscrire
les indices qu’ils auraient trouvé tout au long
du jeu.
En troisième page, un programme renseigne
sur les différents ateliers proposés pendant
les JPO. Nous avons choisi de représenter ce
programme sous la forme d’une horloge pour
proposer un programme original visuellement
et non un programme basic ordonnée comme
une simple liste.
Enfin, un plan est imprimé en dernière page
avec les couleurs de la charte graphique
reprises pour les différentes affiches.
•Le flyer nuit : (annexe 2)
Pour le flyer nuit nous avons repris la même
structure mis à part que nous avons préféré
le violet (couleur présente dans la charte
graphique) car le violet est la couleur se
rapprochant le plus de la nuit.
•Ticket de métro : (annexe 4)
Le ticket de métro est sobre. Aucun graphisme
ou autre illustration n’a été utilisée car nous
avons misé sur l’originalité du format et sur la
curiosité des lycéens. Nous avons néanmoins
respecté bien entendue les couleurs de la
charte graphique.
•Affiches : (annexe 3)
Les affiches annonçant les différents ateliers
sont inspirés du logo des immersions digitales.
En effet, nous avons conservé l’aspect pixellisé
du logo pour diviser l’affiche en deux parties,
une partie nette et une partie pixellisée
symbolisant le coté digital de l’événement. Les
couleurs sont celle de la charte graphique.
Les pictogrammes utilisés sont en partie les
même que ceux utilisés pour le site web afin
de garder une unité graphique sur l’ensemble
du groupe identité visuelle.
Difficultés rencontrées
•Une charte graphique modifiée trop souvent
au début de la semaine inter-semestre
•Un planning des évènements en constante
évolution
•Les différents groupes ne nous consultaient
pas et c’était à nous d’aller les voir pour
savoir s’il leur fallait une affiche ou non
•L’imprimeur est resté injoignable pendant
une longue période retardant lourdement le
devis et du coup l’impression
Pendant les JPO
Devis, impressions, mise en place des affiches ;
L’imprimeur initialement choisi, a longtemps été
injoignable quelques semaines avant les JPO,
entraînant un énorme retard dans l’impression
des flyers et provoquant également
l’abandon de la production et la diffusion
des tickets de métro.
Les délais étant devenus trop cours, nous
iut-tarbes-mmi_rapport final_journée porte ouverte_page10
avons dû imprimer nous même les flyers. Pas de chance pour nous la photocopieuse de la salle
mac, seule imprimante couleur de l’I.U.T., ne s’est pas montrée coopérative malgré nos efforts ainsi
que ceux de monsieur Pierre Normand que nous remercions quand même par ailleurs.
En dernier recours, nous avons imprimés 50 flyers jour en couleur à la bibliothèque en espérant
que l’imprimante de la salle mac veuille bien marcher le lendemain. Malheureusement, cela n’a
pas été le cas est nous avons dû imprimer le reste des flyers en noir et blanc à notre grand
regret.
Du coup nous avons produit environ 400 flyers dont 50 en couleur, flyers que nous avons dû
découper et plier à la main.
ANNEXES POUR LE PRINT
Flyer jours / recto / verso - ANNEXE 1
iut-tarbes-mmi_rapport final_journée porte ouverte_page11
Flyer nuit / recto / verso - ANNEXE 2
iut-tarbes-mmi_rapport final_journée porte ouverte_page12
Affiches - ANNEXE 3
Sans titre-2 1
10/01/2014 15:44:26
Sans titre-2 1
10/01/2014 15:43:56
Sans titre-2 1
10/01/2014 15:47:20
Sans titre-2 1
10/01/2014 15:46:53
Sans titre-2 1
10/01/2014 15:42:57
Sans titre-2 1
10/01/2014 15:45:45
Sans titre-2 1
10/01/2014 15:43:19
Sans titre-2 1
10/01/2014 15:45:26
Sans titre-2 1
10/01/2014 15:45:03
iut-tarbes-mmi_rapport final_journée porte ouverte_page13
Sans titre-2 1
10/01/2014 15:44:46
Sans titre-2 1
10/01/2014 15:47:41
Sans titre-2 1
10/01/2014 15:46:15
Sans titre-2 1
10/01/2014 15:46:34
Ticket de métro - ANNEXE 4
iut-tarbes-mmi_rapport final_journée porte ouverte_page14
ANNEXES POUR La
charte graphique
annexe 1 : croquis (2 à 17
iut-tarbes-mmi_rapport final_journée porte ouverte_page15
iut-tarbes-mmi_rapport final_journée porte ouverte_page16
iut-tarbes-mmi_rapport final_journée porte ouverte_page17
(annexes 2 (croquis-v2 ( 2 à 5 )
iut-tarbes-mmi_rapport final_journée porte ouverte_page18
iut-tarbes-mmi_rapport final_journée porte ouverte_page19
iut-tarbes-mmi_rapport final_journée porte ouverte_page20
annexe : charte graphique 1.0.
CHARTE GRAPHIQUE JPO
#339999
#FECB04
#996699
#3399CC
#CC3333
Charte graphique SITE WEB
#E42420
#000000
#FFFFFF
Charte graphique LOGO
Charte graphique Typologie
GROS TITRE :
( Caviar Dreams )
LOREM IPSUM DOLOR SIT AMET.
LOREM IPSUM DOLOR SIT AMET.
IMPORTANT - Uniquement en majuscule !
Sous titre :
( Caviar Dreams )
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Texte :
( Champagne & Limousines )
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam tincidunt laoreet dictum. Integer dignissim felis arcu, eu ullamcorper nisl sollicitudin ac. Ut lobortis laoreet commodo. Duis pellentesque vitae
metus a placerat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
Morbi a metus lacus. Mauris sit amet pharetra metus. Nulla lacinia odio sed odio elementum vulputate.
Fusce sagittis, sapien quis semper porta, eros ante fermentum dolor, suscipit cursus dui odio a mi. Nunc
vel malesuada ipsum, id porttitor nisi. Quisque laoreet nunc in magna laoreet aliquam.
iut-tarbes-mmi_rapport final_journée porte ouverte_page21
iut-tarbes-mmi_rapport final_journée porte ouverte_page22
iut-tarbes-mmi_rapport final_journée porte ouverte_page23
ANNEXES POUR Le site
web
ANNEXE 1
ANNEXE 2
iut-tarbes-mmi_rapport final_journée porte ouverte_page24
ANNEXE 3
ANNEXE 4
iut-tarbes-mmi_rapport final_journée porte ouverte_page25
ANNEXE 5
iut-tarbes-mmi_rapport final_journée porte ouverte_page26
iut-tarbes-mmi_rapport final_journée porte ouverte_page27
iut-tarbes-mmi_rapport final_journée porte ouverte_page28
iut-tarbes-mmi_rapport final_journée porte ouverte_page29
CONCLUSION
Malgré des difficultés rencontrées durant le projet,
notamment des problèmes de communication interne
et externe, certains soucis ont été résolus grâce aux
réunions et aux personnes ratachées à nos tâches lors
de la semaine inter-semestre. Cela a permis une réelle
cohérence graphique, ce qui revient à dire qu’il s’agit
d’un projet qui « tient la route » finalement..
iut-tarbes-mmi_rapport final_journée porte ouverte_page30
RAPPORT FINAL / DUT MMI - TARBES
Métier du multimédia et de l’internet /
Ancenis enzo / arnaud mathieu
mortele axel / clairE COSTE
renier marvin / flores cindy