Conseil(s) pour le design d'un site

Conseil(s) pour le design d'un site - Web design - Graphisme

Marsh Posté le 29-07-2006 à 23:33:23    

Bonsoir, bonsoir,  :jap:  
 
Je suis en train de plancher sur le design du site web du groupe de mon frangin...
 
Mais n'étant pas un expert du design... mais plutot un programmeur... Ouais personne n'est parfait ;) ; j'aurai voulu avoir votre avis et vos conseils suite à ma première réalisation sous Photoshop.
Voici le lien
 
Pour faire propre avec la charte du forum, voici la description officielle :
L'idée : Site du groupe de HardCore amateur Fight Burst.
L'approche artistique : J'ai voulu créer quelque chose de simple et de standard pour le moment...
Et au niveau des couleurs, on doit paufiner ça avec le groupe, étant donné qu'ils n'ont pas réfléchi à un logo... (si y'a des amateurs par hazard) ;)
Logiciels utilisés : pour le moment Photoshop.
 
Merci d'avance.  :D


Message édité par jordel le 29-07-2006 à 23:56:17
Reply

Marsh Posté le 29-07-2006 à 23:33:23   

Reply

Marsh Posté le 30-07-2006 à 17:48:59    

Salut !  :hello:  
 
Ça colle pas du tout comme ambiance à un groupe Hardcore. Il faudrait aller jeter un oeil sur les sites officiels de groupes du même genre.

Reply

Marsh Posté le 30-07-2006 à 19:37:56    

Pareil, enfait t'est éléments sont placé convenablement mais on dirait que tu n'a pas choisi de charte graphique, choisi déjà 2 ou 3 couleurs de ton choix qui vont bien ensemble et puis ben refait ton header déjà.

Reply

Marsh Posté le 30-07-2006 à 20:06:55    

c'est devenu vachement corporate le HxC  :D
 

Citation :

Pareil, enfait t'est éléments sont placé convenablement


 
non, je ne pense pas, c'est beaucoup trop corporate. il faudrait vraiment tout revoir en se basant sur les codes visuels HxC/punk. Et en l'occurence, le non-respect de la mise en page traditionnelle en fait partie. le bandeau en haut et les side-bars, c'est pour les sites ebusiness, pas pour un groupe de HxC.
 
en plus j'ai l'impression que tu as prévu beaucoup trop de place pour le texte.
 
rough: http://img160.imageshack.us/img160 [...] rstkc2.png


Message édité par craps_youpla le 30-07-2006 à 20:11:41
Reply

Marsh Posté le 30-07-2006 à 20:52:03    

+1 j'ai eu la même impression..trop classique

Reply

Marsh Posté le 30-07-2006 à 21:30:42    

+2, ca manque de bordel et d'esprit HxC
 
a voir pour inspiration peut etre :
 
www.tagadajones.com
www.spineshank.com
http://www.anti-flag.com/microsite/index.php
http://www.imotorhead.com/index_flash.htm
 
entre autres.


Message édité par GazGaz le 30-07-2006 à 21:31:20
Reply

Marsh Posté le 30-07-2006 à 23:50:57    

Bonsoir,
 
Merci pour les remarques...
 
Pour le style classique, c'est fait exprés ;) car justement, on associe le HxC au bordel etc... Je pensais que ça ferait un peu tilter les gens de voir un groupe pareil avec un site classique !!! :)
PS : les sites de Madball et de Morpain sont assez sobres !!!
 
Sinon, pour les couleurs, je ne sais pas sur quel pied danser, vu que le groupe ne m'a pas donné de préférence au niveau de l'apparence ! ;)
[ces jeunes... j'vous dis pas]
 
@craps_youpla : pas mal... J'en prends bonne note ;)
 
@Gazgaz : merci pour les liens... :)
 
Bon, je look vos liens et j'avise...

Message cité 1 fois
Message édité par jordel le 31-07-2006 à 00:00:11
Reply

Marsh Posté le 31-07-2006 à 00:32:17    

jordel a écrit :

Sinon, pour les couleurs, je ne sais pas sur quel pied danser, vu que le groupe ne m'a pas donné de préférence au niveau de l'apparence ! ;)
[ces jeunes... j'vous dis pas]

Il est pas là le problème. Le problème c'est que tu mélanges gris, bleu et rouge. Ce sont des couleurs qui collent pas dutout. [:spamafote]
 
Bien que ce soit fait exprès, selon toi, je verrais un design plus "arraché" (je suis de l'avis général).

Reply

Marsh Posté le 31-07-2006 à 09:43:24    

Ouais pour les couleurs je plaide coupable... car en fait, j'ai voulu tester les alliances suivantes : gris-noir-rouge et gris-noir-bleu...
 
Pour le côté design plus roots... je regarde mais bon, tous les sites HxC se ressemblent et je souhaite justement casser cette image !!! ;)
Genre : www.e-project.org

Reply

Marsh Posté le 31-07-2006 à 11:22:20    

Pour les couleurs, lorsque que je n'ai pas d'imagination ou que je ne sais pas trop dans quelle direction aller, je me réfugie sur ce site: http://www.colourlovers.com/ et je cherche des palettes de couleurs qui m'inspirent (soit au hasard, soit en utilisants des mots clefs, soit sur une couleur dominante)
 
Je seconderai les autres forumeurs sur le style du site, mais je ne dirais pas qu'il faut un style "arraché" ou "bordelique" mais j'utiliserai plutôt le terme "affirmé".
Un groupe de musique, et les artistes en général ont besoin ou on attend d'eux de l'affirmation (affirmation de soi, de son art, de ses créations, etc... c'est l'essence de l'art), or en utilisant un design trop classique tu risques fort de dissoudre cette affirmation dans ce "trop classique", de le rendre trop fade et de placer le groupe au même niveau d'image qu'une association de sauvegarde du héron cendré près du ruisseau machin truc....
 
Bref, avec ce site web tu joues sur l'image de marque du groupe et de l'idée que s'en feront les visiteurs du site.
 
Style affirmé et formalisme de présentation ne sont pas incompatibles, si l'on prend dans les exemples de liens donnés: http://www.spineshank.com/ qui est des plus classiques et pourtant dégage quand même quelque chose au niveau identité.
 
 
Voici les points que je te conseille:
- épure ton menu, il y a trop de choses et le visiteur se perd vite avec de la sur-information. Certains éléments sont en redondance avec la colonne de droite
- vire les photos de la bannière, des photos bien intégrées dans la bannières ça roxx et si c'est pas super bien fait c'est direct catastrophique
tu peux mettre ces photos à part plus bas dans le contenu
- utilise le nom du groupe en gros dans la bannière, ça c'est de l'affirmation de soi! S'ils ont une police officielle utilise-là en gros, bold et avec de l'anti-aliasing, sinon il y en a plein de chouettes sur http://www.dafont.com
- augmente la taille de la police du contenu pour une meilleure lisibilité
- choisi un palette de couleur harmonieuses ou qui vont ensemble
- évite les longues phrases "cliquez ici pour...." et utilise un style + direct et concis sans phrase
- style les items de tes listes au lieu d'utiliser un tiret (ex: concerts, mp3, actualités)
- évite de mettre trop de bordures sauf si ça fait vraiment partie du style et que cela a un réel intérêt de lisibilité
- pourquoi ne pas arrondir un peu les coins de tes cadres...
- utilise plutôt des niveaux de constrates pour tes cadres/boites plutôt que des différences de couleurs qui claquent
- mets des titres plus gros, bien lisibles
- rend les photos plus chatoillantes, un peu de rajout de couleurs, ou au pire un peu de constrate en plus
- utilise quelques icones pour relever certains éléments (à faire avec parsimonie)
 
Voici pour illustrer mes propos un petit visuel des points dont je t'ai parlé. Bon ok c'est pas tip-top car c'est du très vite-fait:
http://www.image-dream.com/membre/up/mini_anonym/b2722322460a9933b3aff1ed677c7467.png
- Les couleurs et les arrondis sont inspirées de ce site: http://www.minning.de/
- les icones proviennent de celui-ci: http://www.famfamfam.com/lab/icons/silk/
- j'ai placé les concerts en dessous car ces derniers ont un lien dans le menu du haut contrairement à photos et mp3 (retirés)
 
Voilà, je ne possède aucune vérité absolue et ce ne sont que des conseils qui n'ont que la valeur qu'on leur prête. Mais j'espère que ça pourra t'aider.

Reply

Marsh Posté le 31-07-2006 à 11:22:20   

Reply

Marsh Posté le 31-07-2006 à 19:23:51    

Citation :

utilise plutôt des niveaux de constrates pour tes cadres/boites plutôt que des différences de couleurs qui claquent


 
t'as tout bon sauf là, monsieur. En fait c'est le contraire, faut que ça pète, du contraste méchant.
 
crame aussi à mort les niveaux de tes photos sous grotoshop. rajoute de la texture, de la matière en scannant des trucs (traces de doigts, buée, ronds de verres, animaux morts, etc.) et en jouant avec les modes de fusion.
 
encore plus violent, utilise un calque de niveau en Seuil.
 
évite les typos dafont toutes pouilleuses, à la place imprime et trashe la feuille à la main (old-school, au Spontex et à l'huile de coude). sinon tes lettres auront toujours les mêmes déchirures, et c'est absolument ridicule.
 
Il y a une caisse de flyers de Minor Threat / Black Flag / C.O.C. etc. dans le bouquin "Fucked Up + Photocopied / Instant Art of the Punk Movement".
 
Et Morpain c'est des gros cons, on les a fait jouer et ils ont été lourds toute la soirée :D je hais les coreux de toute façon, 'savent pas s'battre :D


Message édité par craps_youpla le 31-07-2006 à 19:25:28
Reply

Marsh Posté le 31-07-2006 à 20:39:48    

je me suis peut-être mal exprimé, je voulais parler de ce genre de différence de couleurs qui claquent pour les boites:
http://www.image-dream.com/membre/up/anonym/ef34c9c3e011658218f8e10f9c6c2fca.png
 
Sinon t'as raison craps_youpla, pour le site web d'un groupe de musique il faut affirmer le style, tout autant que les musiciens le font sur scène, et dans ce cas ne pas hésiter sur les moyens visuels et typographiques.
 
Fut une époque où il y avait plein d'exemples sympa de ce type de style "trash/grunge/punk" dans les galleries de style CSS, puis overdose de sites dans ce style et ils ont fait place aux "hachures", puis au néo-formalisme et puis enfin au style pourrave "à la web 2.0" de sa mère...  
Autant ce style était très peu adapté aux sites ordinaires/généraliste et ce n'était qu'un effet de mode passagé, autant cela reste efficace pour des groupes de rock.
 
Sinon il y a aussi des groupes qui en sont revenu d'un style trop poussé, et sont revenus à des présentations plus classiques. Par exemple Einsturzende Neubauten http://www.neubauten.org/ (bon je sais, ce n'est pas du HxC), ils avaient vraiment des super-présentation sur le web à l'instar de leurs instruments ( http://www.neubauten.org/en-photos-instr.html ). Ils sont venus à un style plus formel, peut-être par pragmastime économique car ils essayent de passer le moins possible par leur maison de disque et de développer un modèle économique direct des artistes au public et aux fans (donc il faut faire vendre via le site).


Message édité par monsieur le 31-07-2006 à 20:46:00
Reply

Marsh Posté le 31-07-2006 à 21:47:14    

monsieur +1.
 
laisse tomber tes gentils petits cadres colorés et tes jolis blocs tout serrés. essaie de faire du web-design, tout simplement.  
 
histoire de donner un meilleur exemple que le site d'EN, Do It Yourself ne rime pas forcément avec amateurisme. le site d'ez3kiel (dub) a aussi été fait en DIY, et il ramone sévère. il y a des trucs puissants dans la catégorie "grafix" qui rejoigne un peu le trip HxC : http://www.ez3kiel.com/
 

Reply

Marsh Posté le 31-07-2006 à 22:32:12    

Bonsoir...
 
Que de réponses, je vous qu'il y a des fans de HxC !!! :)
 
@monsieur :
J'ai bien noté tout tes dires sur l'expression de sa propre image et tout ce qui suit... mais bon, je ne sais pas pourquoi je vais tenter de faire une proposition à mis chemin entre le conventionnel (classique) et l'underground/affirmé. Peut être car j'en ai marre d'aller sur les sites de zikos et de me perdre dans le bordel ambiant... et toujours sombres !!! On verra ;)
 
Ok pour tous ces conseils sauf pour un point :

Citation :

- épure ton menu, il y a trop de choses et le visiteur se perd vite avec de la sur-information. Certains éléments sont en redondance avec la colonne de droite


Donc quand je suis ailleurs que sur la page d'accueil, je peux pas accéder directement à ces rubriques... Pour moi, c'est une faute de convivialité pour le visiteur !
Sinon, tout le reste me paraît judicieux ;)
 
@craps_youpla :
LoL pour les conseils trash... ;)
re-LoL pour Morpain !!! Moi je hais Marcel et son Orchestre pour une raison aussi liée à l'organisation d'un festival... Bande de cons !!! ;)

Reply

Marsh Posté le 31-07-2006 à 23:54:25    

Citation :

Ok pour tous ces conseils sauf pour un point :
Citation :
 
- épure ton menu, il y a trop de choses et le visiteur se perd vite avec de la sur-information. Certains éléments sont en redondance avec la colonne de droite
 
 
Donc quand je suis ailleurs que sur la page d'accueil, je peux pas accéder directement à ces rubriques... Pour moi, c'est une faute de convivialité pour le visiteur !
Sinon, tout le reste me paraît judicieux


 
le fait de vouloir se faire perdre le visiteur peut néanmoins une idée de départ intéressante. Le site Web d'un groupe a deux buts : être un dossier de presse (le sonorisateur doit trouver le plan de scène, le public doit trouver les dates, très prosaïquement), mais aussi être une extension graphique et interactive d'un univers musical.
 
toi tu ne vois que le premier objectif (il est aussi rassurant + facile, évidemment) mais le groupe ne risque t'il pas de voir que le deuxième ?
 
mais là je serai toi je jouerai à fond la carte créative et expérimentale, c'est un tout petit groupe, ils ont pas encore de logo, pas d'univers graphique encore, peut-être que tu as là un terrain vierge où t'exprimer, c'est une bonne occasion de te faire plaisir en faisant de la créa sans contraintes, mine de rien.
 
rassemble une 50aine de screenshots de sites qui te plaisent vraiment , sans te préoccuper de la technique employée (inclus donc des sites en Flash, peu importe). Ensuite rassemble des photos un peu barrées ramassées à droite et à gauche, fais des essais de typos, puis commence à rassembler le tout sur des pistes graphiques, peu importe le format (travailler sur des formats bizarres genre 4000px x 250px oblige à inventer des solutions originales en mise en page). une fois que tu as 5-6 pistes graphiques totalement différentes, pioche dedans et réalise des mise en page 1024px avec les contraintes de contenu que tu t'es fixé (rajoute des blocs de textes, des nav, etc.).
 
chose à savoir : quand tu bosses en agence, avant d'avoir un screenshot valable tu en jettes 10-12 facile, et souvent totalement différents.

Reply

Marsh Posté le 01-08-2006 à 00:13:26    

Merci Craps_youpla pour ta nouvelle réponse ;)
 
Bon... je viens de faire un ptit truc rapidos...
Lien vers nouveau design
 
Y'a des points que j'ai pas eut le temps d'aborder car j'suis HS ce soir ;)
 
Mais, suis je sur la bonne voie ??? :)
 
A++

Reply

Marsh Posté le 01-08-2006 à 00:32:03    

Reply

Marsh Posté le 01-08-2006 à 00:41:24    


spam :o


---------------
Perhaps you don't deserve to breathe
Reply

Marsh Posté le 01-08-2006 à 08:03:08    

jordel a écrit :


Mais, suis je sur la bonne voie ??? :)


 
 
Ca a déjà plus de personnalité.  :)  
 
Je crois que tu devrais essayer de casser l'aspect rigide et linéaire du bloc principal par rapport au fond noir, par exemple ajouter du dégradé entre le noir et le blanc ou mettre le militaire à cheval entre le fond noir et le bloc principal blanc...
 
Tu as déjà prévu quel système (pages statiques/home made php/CMS) tu allais utiliser pour gérer le contenu du site?
Car cet article plus haut considéré comme du spam par Terminapor est très intéressant comme base pour sortir un peu des modèles de conception trop convenu et rigide (en grille), cependant certains CMS sont ne pas assez souples au niveau structure pour pouvoir les y adapter (donc il faut y penser un peu en arrière plan lorsque l'on pense à la maquette, mais pas trop sinon on tombe vite dans le syndrome "php-nuke" ).

Reply

Marsh Posté le 01-08-2006 à 12:18:56    

Citation :

Ca a déjà plus de personnalité.  :)  


Merci... j'ai fait quelques retouches via Photoshop sur les cadres en les dénaturant un peu !!! :)
Par contre, j'ai pas encore trouvé des ptites icones sympas pour remplacer les '-', mais je persévère dans mes recherches !!!
 
Pour l'aspect rigide et linéaire... je sais pas pourquoi mais j'arrive pas à casser cela... Peut être mon habitude de développer des sites plutôt conventionnels, institutionnels et des Intranet !!! mdr Je vais me forcer un peu pour voir ;)
 
Pour le système de gestion des pages, je vais me faire une admin maison... avec ajout de news, d'articles, de photos... donc rien de défini pour le moment !!! :)
Oui, oui j'ai lu l'article... qui est très très bon d'ailleurs !!!

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed