SYNTHÈSE DE STAGEMylène Favre

Studio2011 2012• •

BTS COMMUNICATION VISUELLE OPTION MULTIMÉDIA

06 Introduction

07 Inna Studio

08 Clients

09 Missions

10 Club hippique de la Gacilly14 Ville de Plumelec16 Hôtels de la Baie des Trépassées18 Cabinet De Charry19 Camping Les Menhirs20 Bilan22 Remerciements

S O M M A I R E

Introduction SYNTHÈSE DE STAGE6

I N T R O D U C T I O N

J’ai effectué un stage de quatre semaines à l’agence Inna studio. J’étais partie dans l’idée de décou-vrir le monde du web, de la réalisation d’une maquette au fonc-tionnement du code. Objectif que j’ai pu remplir à l’aide de mon tuteur Mr Florian Lemeau qui m’a enseigné les ficelles du métier. Je vous laisse découvrir l’environnement dans lequel j’ai évolué durant ce mois de mai ainsi q’un aperçu de mon travail que je vais tenter au mieux de vous décrire.

Bonne lecture.

SYNTHÈSE DE STAGE Inna Studio 7

Inna est une agence de communication globale spé-cialisée dans le web depuis maintenant six ans.

L’agence se compose de deux patrons M. Xavier Adam, le développeur et M. Florien Lemeau, le graphiste ainsi que d’un commercial, M. Laurent Maréchal.

Elle propose de nombreux services tels que la création de boutique en ligne, site dynamique, gestionnaire de contenu (CMS), site vitrine, logos et supports de commu-nication. Basée sur le bassin de Vannes elle se positionne principalement sur la région Bretagne, où la concurrence est parfois rude. Le bouche à oreille et la préconisation par les clients représentent le meilleur moyen pour eux de se placer sur le marché. elles travaillent pour de petites struc-tures telles que : camping, hôtel, club...

L’ A G E N C E I N N AP R É S E N TAT I O N

Les clients SYNTHÈSE DE STAGE8

D E L’ A G E N C EL E S C L I E N T S

Les clients de l’agence sont pour la plupart des PME. Les prestations web sont très souvent accompa-

gnées de supports papiers. Beaucoup de communication de proximité.

Quelques noms :- L’hôtel Le Churchill (Carnac)- La brûlerie d’Alré (Plougoumelen)- Club Hippique de la Gacilly- Cabinet de Charry (Vannes)- L’Écho Nova (Vannes)- Hôtel de la plage (Damgan)- Ville de Senéetc...

SYNTHÈSE DE STAGE Missions 9

M E S M I S S I O N S

Missions SYNTHÈSE DE STAGE10

L E C L U B H I P P I Q U E D E L A G A C I L LY

StratégieLa première étape de ce travail consistait à procéder à une Audit Concurentiel. Ensuite j’ai étudié la cible et l’impact recherché par le site.J’en ai retiré les informations suivantes:

La cible : Les particuliers, (pratiquants de la région et touristes), les collectivités (écoles et centre de formation).

L’objectif du site : Communiquer avec les internautes et particulièrement les touristes attirés par la région de la Gacilly.

La démarche commerciale : Elle est basée sur le bouche à oreille, elle s’appuiera sur le futur site internet, la presse locale et les ac-teurs de l’information touristique locale (of-fice de tourisme et la Fédération Française d’Équitation). Une action de communication est prévue par la création et la distribution de Flyers.

ConceptionDu logo : Le logo a été travaillé assez ra-pidement car il n’était pas compris dans la commande, il devait me servir d’appui pour la maquette du site.

RecherchesPour ce projet, j’ai travaillé mes recherches directement sur Illustrator.

Réalisation d’une maquette de site pour un centre équestre.”“

SYNTHÈSE DE STAGE Missions 11

Propositions

Logo final

Club hippique

de la Gacilly

Missions SYNTHÈSE DE STAGE12

ConceptionDu site : Le site doit être organisé de ma-nière hiérarchique, j’ai fait une sélection des informations importantes par exemple la mise en avant des actualités. L’idéal est de se mettre à la place de l’internaute (futur client), comment répondre à ses attentes? Qu’attend-il du site?Il est aussi important de faire un wireframe. C’est un prototype du site sous forme de schéma qui consiste à placer les zones du site web, j’y ai également indiqué les élé-ments fixes et les futurs interactions. Il est indispensable dans le web de penser au découpage du site dès la maquette.Ensuite j’ai recherché des motifs, des po-lices, des images et des icônes. L’objectif étant de trouver une harmonie colorée et une cohérence visuelle. Le choix des vi-suels est primordial car ils doivent représen-ter l’esprit du club.

Recherches de maquetteLes maquettes peuvent être réalisées sur Illustrator, Photoshop ou Fireworks.J’ai découvert le fonctionnement de Firework. C’est un logiciel qui est unique-ment dévoué au maquettage de site web. Une fois la maquette validée par le client j’ai codé la page d’accueil et la page type en html, css et JavaScript sur Dreamweaver.

1- Page d’acceuil, maquette finale

Auto-critiqueLa première maquette, image 2, ne me convenait pas du tout, les couleurs étaient trop vives, le logo manquait de prégnance. L’ensemble était peu harmonieux.C’est pourquoi je suis partie sur des tons verts, en rappel à la nature, un fond avec un motif pour donner un côté un peu pré-cieux au site et à l’activité. L’image 1 est la solution finale que j’ai apportée pour la page d’accueil. Entre l’image 2 et l’image 4 on voit la progres-sion du maquettage sur une page type.Ce qui m’a causé le plus de difficultés fut la hiérarchisation des informations.Depuis le site et le logo ont été modifiés par mon tuteur de stage (http://centre-equestre-gacilly.com/index.php).

C O N S E I L D uC H E F !

«Donner de la plus-value au site par le soucis du détail»

«Mettre en avant les informations essentielles»

«Toujours travailler sa maquette à 100 %»

2- Page d’acceuil, maquette

4- Page type, maquette finale

3- Page type, maquette

Missions SYNTHÈSE DE STAGE14

L A V I L L ED E P L U M E L E C

StratégieJ’ai débuté ce travail par une recherche des logos environnants ainsi qu’une sélection de logo de ville qui fonctionne bien.J’ai également fait ma petite analyse de la stra-tégie à adopter. Bien qu’ici contrairement à la mission précédente il n’y a pas de but lucratif.

La cible : Les particuliers, (habitants de la ré-gion et des environs, les touristes), les admi-nistrations...

L’objectif : Communiquer une image dyna-mique et positive de la ville.

La démarche commerciale : Les logos de communes se choisissent souvent par vote, c’est pourquoi dès qu’il y a du «flashy» ça marche. Cependant il faut éviter ça. Le logo doit vraiment être en accord avec l’identité de la ville. Il faut réfléchir à l’impact qu’il va produire.

Le brief : Principal élément fort de la ville, ses trois clochers, mon tuteur m’a donc demandé de partir sur cet axe de recherche. Tenter également de coller à la charte du site de la ville.

Réalisation d’un logo pour la ville de Plumelec.

CroquisLa réalisation de quelques croquis sur papier mon aider à poser quelques idées.

1- Croquis autour des clochers

”“

SYNTHÈSE DE STAGE Missions 15

PropositionsJ’ai utilisé le logiciel Illustrator pour la conception de mes logos.

Ville dePlumelec

PLUMELECVille de

Ville dePlume lec

Logo retenuFinalement, le client trouvait l’idée de faire figurer les trois clochers trop vieillottes et préférait mettre en avant le dynamisme et les acti-vités du village. Le logo retenu a été réalisé par mon tuteur de stage, monsieur Florian Lemeau.

Missions SYNTHÈSE DE STAGE16

L E S H Ô T E L SD E L A B A I E D E S T R É PA S S É SCréation d’une nouvelle charte de site à partir de l’ancien modèle.

StratégieObserver le site existant, relever ce qui ne va pas. Hiérarchiser différemment les informations.

La cible : Les touristes, groupes de séminaires.

L’objectif : Offrir une meilleure communication et lisibilité du site.

Le brief : Design classe, de grands fonds, un site soigné avec menu déroulant.

Ma démarche : Mettre en valeur le lieu, les visuels. La plus grande difficulté était de placer deux hôtels sur un seul site.

PropositionsJ’ai proposé à mon tuteur les solutions suivantes. J’ai réalisé mes maquette sur Photoshop. La n°2 était selon moi la plus convaincante, cependant le client ne voulait plus changer la charte du site mais seulement modifier quelques détails, (boutons, encart actualité...) mon travail n’a donc pas été validé.Le site : http://www.hotelfinistere.com/

Auto-critiqueJ’étais assez satisfaite de ma proposition finale, qui reprenait bien les codes de l’ancienne charte tout en apportant une touche plus graphique et actuelle. J’ai eu quelques difficultés à organiser les informations. J’étais partie dans l’idée de distinguer les deux hôtels dès la page d’accueil, mais finalement, il était plus im-portant de mettre en avant l’onglet Actua-lité, Offres / évènements et la Réservation.

”“

SYNTHÈSE DE STAGE Missions 17

1- Capture écran du site après les modifications

1- Proposition de maquette

2- Proposition finale de maquette

1- Capture écran du site existant

Rendu final

Missions SYNTHÈSE DE STAGE18

C A B I N E TD E C H A R RYRéalisation d’une annonce presse. Parue dans le magazine Elle décoration Bretagne, juillet.

ConceptionUne cliente avait besoin d’aide pour arranger son annonce-presse, elle est arrivée avec une sortie A4 de ce qu’elle souhaitait et une clé usb contenant les photos à intégrer. Mon tuteur m’a laissé prendre en charge la cliente. C’était un travail d’exécution, qui ne demandait pas de compétence graphique particulière. Cela m’a permis d’aborder la relation avec les clients.

Auto-critiqueJ’ai eu quelques difficultés à affirmer mes idées, la cliente était présente tout au long du travail, elle était très indécise et voulait faire sa mise en page sur photoshop car c’est le seul logiciel qu’elle avait chez elle. J’aurais dû dès le début lui faire prendre conscience qu’il fallait le faire sur In-design, mais par manque d’assurance, j’ai suivi ces directives. Au final la mise en page n’était pas vraiment au point. Il a fallu retra-vailler le document sur Indesign.

”“

SYNTHÈSE DE STAGE Missions 19

C A M P I N GL E S M E N H I R SMise en page d’un questionnaire de satisfaction

ConceptionÀ partir d’une sortie A4, contenant les informations à inscrire dans le tableau, je devais faire la mise en page d’un questionnaire de satisfaction Recto/Verso (français/anglais) format A5.La principale difficulté est de placer le maximum d’informations sur un petit format de manière lisible et visuellement agréable, casser la lourdeur du ta-bleau.

Auto-critiqueJ’ai allégé la mise en page par un système de bande nuancée. C’était un petit travail d’appoint, un peu rébarbatif mais qui fait partie du métier.

”“

Bilan SYNTHÈSE DE STAGE20

C’est l’heure du bilan, 4 semaines ça passe très vite, voici les points importants:

Sur le plan professionnel ce stage m’a permis d’aborder une réelle démarche de création web. J’ai particulièrement appré-cié d’avoir en charge un projet de site du début à la fin. En revanche, les travaux d’édition qui m’ont été confiés restaient assez classiques.

Mon tuteur m’a accordé du temps et donné des conseils sur la partie développement htlm/css, tout en me laissant beaucoup d’autonomie en création. Je pense avoir apporté une vision neuve moins formatée, car je ne prenais pas en compte, volon-tairement, toutes les contraintes web durant le maquettage.

Le web design est un domaine qui offre énormément de pos-sibilités de création graphique. Il faut être aux aguets des nou-velles tendances et technologies.

Ce stage me conforte dans ma voix, le métier de graphiste est passionnant et très varié, je garde une préférence pour le web design.

B I L A N D E S TA G E

SYNTHÈSE DE STAGE Bilan 21

Remerciement SYNTHÈSE DE STAGE22

Je tiens à remercier l ’équipe d’Inna Studio de m’avoir accueil l ieet plus particul ièrement mon tuteur de stage M. Florien Lemeau d’avoir eu la genti l lesse

de me faire découvrir son métier, ainsi que pour les conseils qu’i l m’a apportés.”“