Repositorio Institucional de Documentos
Abstract
El trabajo propuesto consiste en la concepción y diseño de un sitio web para la empresa discográfica Vicious Circle, la partici pación en un proyecto en equipo, de rediseño e integración de contenidos del sitio web MediaMag, y el cursado de una asignatura que aporta los conocimientos requeridos para el desarrollo de todo lo anterior. Como fichero MEMORIA queda adjunta la memoria del sitio web para la empresa discográfica. Como fichero ANEXOS queda adjunta la memoria del trabajo en equipo sobre el sitio web MediaMag. Sieso Ortiz, Olga; Houry-Panchetti, Minica
Full text
UNIVERSITÉ PAUL SABATIER IUT DE TARBES DÉPARTEMENT INFORMATION SERVICES RÉSEAUX ET COMMUNICATION LICENCE CISPM ANNÉE UNIVERSITAIRE 2012/2013 CRÉATION D’UN SITE WEB POUR UN LABEL Membres du jury : -PO DUPUY -M.HOURY-PANCHETTI Étudiante: -Sieso Ortiz, Olga
Remerciements Plusieurs personnes ont contribué à l’élaboration de ce mémoire. Tout d’abord, je tiens à remercier Vianney Monge : responsable du pressage CD, de s’être souciée de ma bonne intégration et de l’avancement de mes réalisations sur les différents logiciels. Il a toujours été disponible pour me mettre en contact avec les bonnes personnes pouvant m’aider. Je veux ajouter: J’associe ces remerciements à Laurent Laffargue, responsable de Platinum Records, de m’avoir aidé à solutionner les problèmes rencontrés avec les webmasters J’adresse de chaleureux remerciements à Marijo OTERO, ma professeur de français, qui m’a donné des indications et m’a aidé à comprendre comment rédiger mon mémoire de stage. Je tiens également à remercier Sarah EL HIMDI, qui a corrigé mes fautes de français à chaque fois que je lui ai demandé. Enfin, je tiens à souligner l’investissement de Minica HOURY-PANCHETTI, enseignant-chercheur à l’IUT de Tarbes que je remercie pour son soutien et ses conseils sur mes comptes-rendus hebdomadaires.
1 Index 1. Contextualisation................................................2 1.1 Introduction......................................................2 1.2.Analysedel’entreprise....................................3 1.3.Missiondeposte..............................................7 2. Mémoire de mission............................................8 2.1Exposédelaproblématique...........................8 2.2Analysedelasituationtrouvée......................9 2.3Méthodeutilisée..............................................10 2.4Résultatsobtenus............................................20 3. Préconisations....................................................27 Conclusions........................................................................28 Biographie...........................................................................29
2 Danslapalettedecompétencesliées aumultimédia,lamissiondemon stageétaittrèsconcrète:actualiserle graphismedusitewebd’unlabelde musiqueindépendante. Aprèsavoirprésentél’entrepriseoùa eulieulestageetlamissionelle-même, jevaismontrerquellecaractéristique dustageaétélaplusimportanteeta définimafaçondetravailler,montrer lesrésultatsobtenusetindiquerles préconisationsindispensablespourune missioncommelamienne. Ontrouveraenannexetouslesécransdu produitfinalc’est-à-diredugraphisme définitifdunouveausiteweb.Cesécrans sontlerésultatdenombreuxessais graphiquesquinefigurentpasdansce rapportpourdesraisonspratiques. 1. Contextualisation 1.1 Introduction
3 1. Contextualisation Crééen1993(C’estson20anniversaire) parlesfondateursdufanzineAbusDangereux,lelabelViciousCircle,avecde plusde100productions,atoujoursfait deschoixéclectiquesetparfoissurprenants.Artistesfrançaismaiségalement américains,norvégiens,suédois,allemandsoucanadiensfontpartiedulabel. DeShannonWright(Atlanta),exceptionnelleauteuretcompositeurréputéepour sesalbumsetperformanceslivedenses enémotions(elleaégalementenregistré en2004undisqueavecYannTiersen),à TenderForever(Portland),electro/pop espiègleetinventive. DesBellRays(LosAngeles)àMinor Majority(Oslo),folklimpideetraffinée venuedufroid;duhip-hopdélirantdes Puppetmastaz(Berlin)àla 1.2 Analyse de l’entreprise 1.2.1 Historique de Vicious Circle pop80’sdeKim(Bordeaux),incroyablemulti-instrumentisteaux18albums;des ambiancesnoiresetlangoureusesd’ElysianFields(NewYork)auxchansonsdélicates etinsouciantesdeMansfield.TYA(Paris).MaisaussiGirlsAgainstBoys,Radio4,Calc, JulienPras,TheEx,Denali,JulieDoiron,MenWithoutPants,TheNotwist,etc.
4 1. Contextualisation Lapaletteestdonclargemaisl’exigence dequalitétoujoursprésenteetl’envie intacte.ViciousCirclecroittoujours audisque,toutsimplementparceque ledisqueestavanttoutuneoeuvre artistique,résultatd’unlongtravail etd’uneépoquedelavied’unartiste. ViciousCirclecherchelesémotions partagées,d’éclatsetdecolères,d’amour etd’impatiences. Ilfautécoutertousnosdisquesplusieurs foispourlesapprécierpleinement. Certainsdemandentmêmeuneculture musicalecertaine.Toussontlerefletde notrepassion. LesdisquesViciousCirclesontdistribués enFrance,Benelux,UK,Allemagne, Autriche,Portugal,Suisse,Espagne, Italie,GrèceetPologne.
2. Mémoire de mission 5 Ilyaréellementdeuxlabels,Vicious CircleetPlatinumRecords,quitravaillentensemble.Audébut,j’allais travaillerpourlesdeuxmais,après quelquesmodificationsdemission,ila étédécidéquej’allaistravaillerseulement pourViciousCircle.C’estpourcelaque l’informationprésentéeiciconcerneprincipalementViciousCirclemaisilnefaut pasoublierPlatinumcarpresquetoute l’équipetravaillepourlesdeuxmaisons dedisques. 1.2.2 Postes de travail
12 2.3.1.2 Composition du menu Àpartirdessuggestionsfaitesparlespersonnesinterviewées lorsdesenquêtesréaliséesetdemapropreanalysedusite,jesuis arrivéeà: -Parties indispensables : Enanalysantlesréponsesdesusagersdesitesdemaisonsde disques,j’aitrouvédespartiesdumenuqu’ilfallaitabsolument avoir: News Artistes Concerts Store Contact -Parties importantes mais secondaires : Ilyavaitaussidesutilisateursquidisaientqu’ilétaitimportantd’avoirunesectiondevidéosetdephotosmais,comme cen’étaitpasleplusimportant,onpouvaitlemettredansune autresection,commedanslesNews,oudans«l’universartiste», sous-sectiondelasection«Artistes». Etlapartie«catalogue»étaitaussitrèspratiqueetimportantecar lesemployésdulabeldoiventpouvoircherchertouteslessorties dedisquesdulabelparordrechronologique. Maislecatalogueneseraitpasunepartiedumenuparcequeles employésdulabelsontlesseulsquivontlevisiterhabituellement.Lecatalogueseraitdoncmisdanslasection«store». 2. Mémoire de mission
2. Mémoire de mission 13 2.3.1.3 Le panier des achats L’absencedepanierquiditàl’utilisateurcequ’ilàdéjàchoisi sursalistedeproduitsàacheterestimpardonnablecarlamissiondusitewebestprioritairementlaventeenlignedesproduitsdulabel. Ilfautdoncquel’utilisateursacheàtoutmomentcequ’ilva acheteretcomment,ilfautquetoutsoitvraimentclairpourlui, pourqu’ilsoittranquilleetqu’ilveuilleretournerausitepour continuersesachats.Ilfallaitdoncajouterunpanierdansla nouvelle version du site. 2.3.1.4 La publicité sur le site L’ancienneversiondusiteavaitdesbannièrespublicitairessur lesnouvellessortiesdesalbums.Ilétaitimportantdeconserver unpetitespacepourcontinueràfairedesbannièrespublicitaires surlesnouvellessortiesdefaçonàfavoriserlesventes.
14 2. Mémoire de mission 2.3.2 Étude des sites web généralistes d’actualité Pourlarecherchedesexemplesdesiteswebs,j’aitrouvé beaucoupdesites,qu’onpeutvoirdanslabibliographie. Sontdétaillésplusbasceuxquej’aitrouvésplusimportants soitpourleurdesigngraphique,leurfonctionnementouleur ergonomie. Cessites,quifontvraimentréfléchirpourledéveloppement d’unsitesonttoujoursd’actualité,ontunebonneergonomie etsurtout,ungraphismesurprenant. http://www.awwwards.com/ Unsitepourretrouver l’actualité,lessiteswebs quiontgagnédesprix pourleurdesign,leur ergonomie,leurcréativité... Presquetous lessitesmontrés plusbasse trouvent ici.
2. Mémoire de mission 15 Unsitequim’ainspiré poursesdifférentes propositionsdudesign graphique. http://niice.com/ Weareeliestunsitequim’adonnédesidéespourlasection“artistes”,ilfautvraimentle visiterpourcomprendrelefonctionnementdusitequejepropose. Ici,cequiestfrappant,c’estlescrollvertical,cen’estpaslescrollqu’onvoitdanstous lessites,c’estunscrollquimarcheuniquementparcolonnes.Seulelacolonnequ’on survolebouge.
16 Twitteretsafaçonde montrertoutel’information,lestweets. Àchaquefoisqu’on cliquesuruntweet, celui-cis’ouvreenmontrantplusd’informations,lesréponses,le numérodepersonnes quiontcliquésur«favori»,etc. J’aitrouvéque,sion mettaitlesartistespar colonnescommeça,ce serait innovateur et aussi unefaçondefairela promotiondesartistes. Lesusagerspourront aussitrouverdesgroupes demusiquequ’ils neconnaissaientpas encore. 2. Mémoire de mission http://weareeli.dk/ http://twitter.com/
17 2. Mémoire de mission http://www.uzik.com/LouvreIslamicArts/ http://www.brenninkmeijerenisaacs.com/ Ontrouvedeplusen plusdesiteswebsoùily atoutel’informationqui estdansunsuperscroll quimontretout. Ce sitem’aparuintéressantàcausedesondesigngraphique:lefaitquetoutesles imagessontséparéespourunemargeblanchedonneuneimagepluspropreetélégante.
18 2. Mémoire de mission 1.Ilfautquelesitedonneuneimageindéeavecsongraphisme etfonctionnement. 2.Lemenudoitimpérativementêtrecomposéde: News Artistes Concerts Store Contact 3.Ilfautquelesitesoitinnovateur,qu’ildonneenvied’allerle visiter. 4. Il doit y avoir un catalogue 5.Ilfautundesignquidonneenvied’acheterdelamusique. 6.Lapageartistesdoitserviràfairedécouvrirdenouveaux artistes aux utilisateurs du site. 7.Lafaçond’acheterlamusiquedoitêtretrèssimpleetintuitive 8.Lapoliceutiliséedoitêtreclaire,plutôtfuturisteetélégante, pourdonnerunesensationd’innovationetdeclasse. 2.3.3 Consignes trouvées Commeconclusionauxétudesantérieurementmontrées,ilya quelquesconsignesquidoiventêtreimpérativementexécutées dontvoicilaliste:
19 2. Mémoire de mission 9.Lesitewebdoitprincipalementêtrecomposédes photosdesartistes. 10.L’ergonomiedoitêtreintuitivedanstoutlesite. 11.Lesmargesentrelesphotographiesdoiventdonnerune imagepluspropreetélégante. 12.Ilfautlaisserunespacepourfairedelapublicitésur lesnouvellessortiesdesalbums.
2. Mémoire de mission 20 2.4 Résultats obtenus Aprèsavoiraboutiàlalistedesconsignes,letravailétait moinsdifficile,maiscen’étaitfacilepourautant. Quelquesexemplesquiaidentàcomprendrecommentles consignesontétésuiviessontmontréesetexpliquéescidessous,aumêmetitrequelefonctionnementdequelques partiesdusite,pourfairecomprendresonergonomieetles argumentsdemonchoixdegraphisme.
2. Mémoire de mission 21 Commenttrouverunepage“news”qui montretouslestitresdesdernièresnews d’uncoup,sansnécessitédescroller, etunplus,commentfairepourlireun newssansavoirbesoindechangerde page? Lameilleuresolutiontrouvéelorsde l’analyseétait«Twitter».Ilyauradonc desbandesavecdesphotosdesyeux desartistessurlesquellesontrouvela nouvelle. Unebandepourchaquenouvelle.Onpeutlireenblanclenomdugroupeetletitrede lanouvelle,etquandoncliquedessus,ontrouvelanouvelle: Unefoisqu’onaouvertunebandec’est-à-direunenouvelle,onpeut:continuerà scrollerpourtrouverd’autresnouvelles,fermerlanewsqu’onlisait,toutouvrir,tout fermer,continueràscroller... C’estergonomiqueparcequ’onpeutvoird’uncouplestitresdesdernièresnouvelles, reconnaîtrel’artisteparsaphoto.Etquandoncliquesurunebande,onalanewssans avoirchangédepage.
28 Conclusions Passionnéeparlamusiqueindépendantejem’intéresseégalementàtoutcequiendécoule:clips,créationd’affiches,réalisationdejaquettesd’albumsetwebdesign.J’étaistrèscurieusede découvrircedomainepourapprendreetcomprendrelefonctionnementd’unemaisondedisquesindépendante. Lorsdecestage,l’absencedeconsignesm’apermisd’évolueren tantquegraphiste,enapprenantàmedébrouilleretendéveloppantmonautonomieetindépendance.Grâceàça,j’aipûavoir uneexpérienceinoubliablequim’aenrichitautantpersonnellementqueprofessionnellement(graphisme). Enrésumé,c’étaitvraimentuneexpériencepositivequim’a donnédesconnaissancesdansledomainedugraphismedela musique,etsurtout,m’apréparépourmonavenirprofessionnel.
http://www.viciouscircicle.fr/ http://toulouse.viciouscircle.org/ http://www.platinumrds.com/site/ http://bootik.abusdangereux.net/index.php?manufacturers_id=10 https://twitter.com/WarnermusicFR http://www.awwwards.com/ http://weareeli.dk/ http://bandcamp.com/ http://www.loisjeans.com/web2013/en http://www.mediskokochbar.se/index.html http://35mmdesign.com/ http://www.brenninkmeijerenisaacs.com/work http://g2geogeske.com/menus http://2ammedia.co.uk/print-portfolio-archive/rossall-school/ http://hotdot.pro/en/# Bibliographie 29
http://www.dadaabstories.org/ http://www.uzik.com/LouvreIslamicArts/ http://niice.co/ http://www.kiliwatch.fr/ http://www.behance.net/gallery/TYPE-CIRCLES/6242419 http://www.thefwa.com/site/nivea-a-date-to-remember http://cssremix.com/ http://www.iestudio.co.il/en/portfolio.html http://www.kiliwatch.fr/ http://gramercyparkhotel.com/ Bibliographie 30