Forum InfographiK.fr

Bonsoir,

et bien voila comme je l'ai dis lors de ma présentation, je commence à m'y mettre afin de créer mon 1er site.
Mais étant débutante, les explications de certains Tuto sont pas toujours très clair ou certaines informations manquent à causes de certains logiciels utilisés.
Donc voila en ce qui me concerne je cherche à créer le kit graphique de mon site et j'utilise Photoshop Cs5 pour cela.

Je souhaite faire un Kit moderne, haute en couleur et dynamique. J'ai cherché sur le net site qui me servirait d'exemple où de file conducteur et qui reprendrait l'essentiel de la structure de mon futur Kit et je l'ai trouvé.

Seulement voila, je sais pas par où commencer pour arriver +- au même résultat!

Voici une image + l'url vous menant au site qui me servira de file conducteur:

http://i52.tinypic.com/2h3pjbn.jpg

World of Warcraft

Donc, le screen que j'ai pris du site reprend tous les éléments c-à-d (disposition des icones + leurs animation, cadres, liens, séparation, etc...)

Donc pour voir l'animation de chaque élément veuillez vous diriger vers le site en question: World of Warcraft

Sans pour autant faire du plagia, j'aimerais que mon Kit ai la même structure que l'original.
Cependant en réalisant mon Kit, je changerais la couleur, les titres, l'header, l'image de font d'écran la dispositions de certains cadres et j'ajouterais d'autres petit trucs propre à mon site bien entendu.

Pour terminer ce post:

- pouvez-vous m'indiquer les liens dont j'ai besoin pour réaliser mon Kit?

- ou des personnes courageuses pourrais me faire des Tuto pas à pas me
permettant d'arriver au résultat souhaité si possible svp?

Merci bien.

Je remets ce que j'ai pu mettre dans une autre conversation sur le même sujet...

Bienvenue,

En ce qui concerne le site internet, je pourrais surement t'aider (ainsi que d'autres ) mais il faudrait que tu développe un peu plus... il est de bon ton en général de ce faire un mini-cahier des charges.

Je m'explique, tu doit d’abord identifier ce que tu doit faire, de quoi tu va avoir besoin?

Une newsletter ? un module de commande en ligne ou un simple système de contact? une vidéothèque? une photothèque? un annuaire de produits? un forum ? ... etc

Un fois que tu sais ce dont tu va avoir besoin tu développe leurs fonctionnements. (exemple: un formulaire de contact, un seul destinataire ou plusieurs? possibilité d'attaché une pièce jointe ? une photo? etc etc)

Quand tout cela est bien clair pour toi et ton client, tu établis une arborescence du site.

Exemple d'arborescence :

Menu horizontal
1. Accueil
2. Notre société
2.1 L'équipe
2.2 Les locaux
2.3 Les moyens
2.3.1 Le transport
2.3.2 Etc...


Et une fois que tout ce boulot est fait en amont, après tu peut t'attaqué au design du site car tu sais exactement ce que tu aura comme éléments et comme contenu.

Bien-sur tout cela est un conseil, je te dis juste comment je fonctionne, après chacun est libre de faire ce qu'il veut mais je pense que ces étapes sont primordiales pour ne pas perdre de temps par la suite. De plus elles te permettrons de savoir qu'elle solution tu va rechercher pour développer le site (un CMS, si oui lequel correspond le mieux... etc)

Voila, j'espère avoir été clair et complet
Si tu arrive à faire tout cela soumet le nous ici, nous seront surement plus a même de t'aider concrètement

Bonjour à tous,
mes meilleurs vœux à tous pour cette année 2011 j'espère que tous comme moi vous avez passé de joyeuse fête de fin d'année!

Merci à tous les membres de ce site pour l'aide que vous apportez aux personnes dans le même cas que moi.
Je suis débutante dans ce milieu et donc, je ne savais pas qu'il fallait faire un cahier de charge pour ce genre de demande mais bon maintenant je sais.

Je vais donc tenter de faire ce cahier de charge ci-dessous ce sera la 1ère fois pour ma part, alors n'hésitez pas à m'avertir si il manque des informations.

CAHIER DE CHARGES

Voila comme je l'ai dis sur le post précédent j'aimerais que vous vous inspiriez du site World of Warcraft pour la disposition et l'animation dynamique des éléments lorsque l'on passe la souris dessus.

Les éléments qui composeront le site sont:

Section/Système (Inscription membres, Loggin, News, Médiathèque, Musique, Games, Divers, Mini Tchat, Forum, Recherche, Contact, Newsletter, Box trafic du site) et des emplacements sur le site pour les partenaires et sponsor.

Bon je vais tenter de faire l'arborescence avec une brève description pour chacun des éléments composant le site:

Arborescence:

Au dessus du menu Horizontal, on trouvera le Logo du site et le box Inscription et loggin.

Menu Horizontal

Accueil: – News – Games – Média – Forum – Contact

Menu déroulant des sections ci dessus:

Accueil: Pas de menu déroulant

News: News Games, News Média, News Divers

Games: Blizzard sous menu (WoW, Starcraft 2, Diablo 3) – Aion – Console sous menu ( Xbox 360 - PS3 – WII) – Pc

Média: Vidéos – Musiques – Divers

Forum: Pas de menu déroulant juste la page d'accueil du forum qui s'ouvrira en cliquant dessus.

Contact: Pas de menu déroulant juste la page contact qui s'ouvrira en cliquant dessus.

Bon maintenant je vais détailler chaque élément et section.

La page d'accueil:

cette page sera celle qui s'ouvrira lorsque qu'on encodera l'url du site, la page principal je dirais. Donc dans celle-ci l'internaute verra en un clin d'œil tous ce que le site lui proposera (les News, tous les liens lui menant dans les divers sections...) et là il pourra accéder à tous les autres pages du site. Cette page sera séparer par les différentes catégories bien distinct les uns en dessous des autres.
Donc, juste sous le menu horizontal, il y aura un emplacement News où défilera les nouveautés du jour avec un système de slide/flash cliquable menant direct à la page de l'info désiré.( voir World of Warcraft pour le système de News).

Toujours sur la page d'accueil sous l'emplacement News, il aura l'emplacement Média Vidéo où une galerie d'images représentant les dernière covers des Média vidéo disponibles avec le titre de celui ci cliquable et menant à la page où on obtiendra toutes les infos du média en question et les liens de téléchargement si possible. La galerie des covers de cette section sera composé de 4 images horizontales. Qui sera modifié à chaque fois qu'un nouveau média video sera ajouté bien évidement.

Sous l'emplacement Média Vidéo on trouvera la section Média Games. Celle-ci sera divisé en 4 partie bien distinct: Blizzard – Aion – Consoles - Pc
Comme pour la section News j'aimerais avoir un système qui ferait défiler une image du News des jeux Blizzard, Aion, Consoles, Pc avec un bref descriptif concernant la News du jour et donc, en cliquant sur l'image l'internaute accèdera à la page d'infos plus détaillées.
Je vous laisse le soin et votre sens artistique pour faire ce qu'il faut je suis pas difficile du moment moment que ce soit animé et moderne.

Sous L'emplacement Média Games on trouvera la section Média Music avec exactement les même caractéristique que la section Média Vidéo (en faite c'est juste le mot vidéo qui change).

Et sous la section Média Music on trouvera l'emplacement Divers avec toujours (les même caractéristiques que les 2 autres décrite ci-dessus...).

On est toujours sur la page d'accueil et sous la section divers on trouvera le Footer du site avec ces différents composants, copyright, contacts et divers liens... (Icone Google, Twitter, Facebook, Flux Rss, etc...)

Ensuite vous pouvez mettre des emplacements liens permettant d'accéder à d'autres pages du site à gauche ou à droite de la page d'accueil à vous de voir quel est la manière la plus esthétique de placer tous cela!

Maintenant en ce qui concerne les emplacements du Mini Tchat box vous pouvez le placé quelques part aux extrémités gauche ou droite de la page d'accueil.

Voila je pense avoir fais une description du plus important, il reste l'emplacement Inscription membre, loggin et système Mot de passe perdu que vous pouvez placer à un endroit stratégique et bien visible à vous de voir, j'opterais pour un emplacement situé au dessus du menu horizontal avec le Logo du site pareil pour le box Recherche en ce qui concerne son emplacement (l'internaute pourra trouver tous ce qui aura un rapport avec le mot recherché dans le site...) une page s'ouvrira avec le résultat de la recherche.

Pour pour la section Inscription j'aimerais que le formulaire tous ce qui a de plus basique, l'internaute trouvera le questionnaire de base, Prénom, pseudo, age, sexe, possibilité d'insérer un avatar, sa localisation, pays ville, etc...) centre d'intérêts, hobbys, jeux préférés, possibilité abonnement à la Newsletter.

Le Forum au couleur du site j'aimerais qu'il soit tous ce qu'il y a de plus simple avec les éléments et fonctionnalité de base d'un forum tous à fait normal.
Cependant seule les membres qui se seront inscrit au site pourront également accéder et participer au forum ( pas les invités) ceux ci devront s'inscrire au site pour avoir également accès au forum donc une même inscription pour le site et son Forum.

Euh je crois que j'ai fais le tour, ah oui pour ce qui concerne le fond de page j'aimerais très dark un Kit graphique ayant l'atmosphère Média loisir et qui aurait comme couleur de base le noir genre Funradio.fr : le son dancefloor - Clubbing - Eurodance

Pourriez vous m'indiquer par la suite comment je pourrais administrer le site une fois celle ci terminer svp?

J'ai surement oublié certains détails, j'ai décris ce que je souhaiterais du mieux que je le pouvais, j'attends vos questions pour les informations manquantes.
Vous êtes dans le milieu vous savez surement comment certaines pages devront tournées avec les infos que je vous ai donné, quel lien mènera à tel ou tel autres pages enfin je crois que vous avez compris +- où je voulais en venir, mais bon n'hésitez pas à me posé les questions nécessaires afin de pouvoir avancer!

Voila j'attends vos réactions et merci pour toutes les personnes qui mettront la main à la patte pour ce projet.

Okay, merci pour la réponse, même si a mon avis quelques points restent a éclaircir, je me suis permis de faire, suivant les recommandations énumérées ci-dessus et ma propre expérience, un zoning.

Point de vue de la page d'accueil, pour les utilisateurs lambda.
Vous devez être Membre du Forum pour voir les images

Notes sur le zoning :

Utilisateurs enregistrés :

Je me suis permis de supposé que le forum n'étant pas accessible aux membres non enregistrer il en étais de même pour le chat.

Disposition générales :

Contrairement a ce que j'ai pu comprendre de t'es préconisation, j'ai ajencer un peu differement les differents "blocs" de la page d'accueil afin de disposer d'une meilleure visibilité lors de l'arrivé sur celle-ci ( cette vision est optimisé pour les affichage 1024*768 et plus, soient 90% des utilisateurs.)

Notes générales

D’après ce que j'ai pu comprendre tu est débutantes dans le domaine, je tiens personnellement a te dire que le rendu du site sur lequel tu veux aboutir est extrêmement complexe, la vidéos, la musique, le slideshow, le forum intégré au site, etc etc sont autans de modules à dévelloper, parfois a bidouillé... il te faudra connaitre une sommes de langage et de compétences très importants... (html, css, javascript, php).

Je me permets de te dire ça pour que tu mesure l'étendu d'un projet comme celui ci si tu doit le réaliser en solo. C'est un travail énorme !

Malgré tout, je te souhaite beaucoup de courage, j’essayerai dans la mesure de mes possibilités à continué de t'aider.

Oooh lalaaa,
et bien chapeau cette réalisation est superbe j'aime vraiment beaucoup!

Ce kit graphique est presque parfait à part la zone réservé au Mini Tchat qui s'y trouve pas mais je suppose qu'on pourra le mettre sous la section divers.
Sinon, oui le reste est vraiment super!

Alors oui effectivement, je suis vraiment débutante et tous les langages que vous m'avez énumérés et bien oui, je ne les connais pas.

Vous savez j'ai tellement entendu dire qu'un site aujourd'hui "tous le monde peut en faire un" que bon j'ai décidé de me lancer mais voila, apparemment c'est pas si simple que ca finalement.

Bon, je ne suis pas une fainéante et j'ai vraiment envie d'apprendre mais j'aimerais savoir alors qu'elles logiciels j'ai besoin pour pouvoir réaliser ce que je souhaite en plus de Photoshop Cs5 que j'ai déjà?

Des logiciels faciles à prendre en main pour une débutante et disposant des fonctionnalités nécessaires pour réaliser le site et ces différents modules?

Sinon, pour les différents modules qui composeront le site savez vous où je peux les récupérés?

Existe t-il des modules déjà tous fait, que je puisse directement inséré?

Où dois-je les crées toutes seule?

Savez-vous où je peux trouver des Tutos qui me permettraient de me débrouiller?

Excusez moi si mes questions vous paraissent peut-être idiote mais bon vous savez ce qu'on dit des blondes!

Non mais plus sérieusement, même si ce site prendra des mois à êtres réalisé vue mes compétences, si vous pouvez me guider, j'apprendrais sur le tas.

Sinon, sincèrement merci déjà pour cette réalisation, je n'en reviens toujours pas car je l'adore!

Oooh lalaaa, et bien chapeau cette réalisation est superbe j'aime vraiment beaucoup!

Ce kit graphique est presque parfait à part la zone réservé au Mini Tchat qui s'y trouve pas mais je suppose qu'on pourra le mettre sous la section divers.
Sinon, oui le reste est vraiment super!

En faite, comme je l'avais spécifié, ce n'est pas un kit graphique a proprement parlé, mais un zoning, cela permets de donner un points de vue graphique aux besoins du cahiers des charge que tu as réalisé plus haut.

De cette étape né le design des différentes zones, et le développement des outils adéquats en parallèle.

Vous devez être Membre du Forum pour voir les images

Alors oui effectivement, je suis vraiment débutante et tous les langages que vous m'avez énumérés et bien oui, je ne les connais pas.

Vous savez j'ai tellement entendu dire qu'un site aujourd'hui "tous le monde peut en faire un" que bon j'ai décidé de me lancer mais voila, apparemment c'est pas si simple que ca finalement.

Effectivement, il est vrai dans l'absolu que tout le monde peut faire un site web...
Mais très peu de personne (amateurs j'entend) atteignent un rendu "professionnel"; de plus le site que tu veux obtenir, n'est pas un simple site web, il y a comme je l'avais décris un bon nombre de particularités a adapter.

Bon, je ne suis pas une fainéante et j'ai vraiment envie d'apprendre mais j'aimerais savoir alors qu'elles logiciels j'ai besoin pour pouvoir réaliser ce que je souhaite en plus de Photoshop Cs5 que j'ai déjà?

Des logiciels faciles à prendre en main pour une débutante et disposant des fonctionnalités nécessaires pour réaliser le site et ces différents modules?

Photoshop est déja un logiciel de professionnel, dans l'absolu, il ne te faut que lui et dreamweaver.

Sinon, pour les différents modules qui composeront le site savez vous où je peux les récupérés?

Existe t-il des modules déjà tous fait, que je puisse directement inséré?

Où dois-je les crées toutes seule?

Cela dépend du choix que tu fera pour le développement de ton site web, je pense que tu devrais te diriger vers des CMS

Savez-vous où je peux trouver des Tutos qui me permettraient de me débrouiller?


Comment creer un site professionnel [Résolu]
Créer un site facilement (par exemple CMS) (Clubic.com)
Utiliser un CMS pour créer un site web dynamique.

j'ai trouver ça en cherchant vite fais, j'ai pas trop le temps, mais tu pourras surement trouver par toi même en essayer quelques combinaisons de mots clés sur google...

Excusez moi si mes questions vous paraissent peut-être idiote mais bon vous savez ce qu'on dit des blondes!

Non mais plus sérieusement, même si ce site prendra des mois à êtres réalisé vue mes compétences, si vous pouvez me guider, j'apprendrais sur le tas.

Les seules questions stupides sont celles que l'ont n'expriment pas. Par contre je pourrais te guider un minimum mais a partir d'un moment il faudra qu'une personne orienté un peu plus développement (l’aspect codage si tu veux) intervienne car je reste limité dans ce domaine, si ce n'est les interventions de base.

Sinon, sincèrement merci déjà pour cette réalisation, je n'en reviens toujours pas car je l'adore!

Pas de problèmes

Coucou,
merci pour tous tes explications j'ai déjà compris pas mal de chose et je sais maintenant que cela va vraiment pas être évident!

Bon j'ai acquis grâce à vos conseils, les logiciels suivant ( Dreamweaver CS5 et Illustrator CS5 ) en plus de Photoshop CS5 que j'ai déjà.

Mais j'avoue que quand j'ai ouvert ces logiciels j'ai attrapé illico la migraine tellement y a de fonctions et que j'ai vraiment l'impression qu'il faut être un habituer dans ces domaines pour pouvoir utiliser ces logiciels convenablement.

Mais bon pour le moment je tente d'assimiler leurs fonctionnements.

Maintenant j'aimerais savoir, comment je peux reproduire le zoning (graphiquement) que tu a réalisé?

Avec l'aide de quels logiciels que j'ai à ma disposition je peux utiliser?

Le plus simple de préférence pour ce genre de réalisation graphique!

J'ai cherché sur google après un module "slideshow" comme celui que tu a inséré sur le zoning car c'est exactement celui là qu'il me faut mais je dois vraiment être nul car je ne l'ai pas trouvé.

Faut-il que je le crée moi même?

Merci d'avance pour les réponses

Salut
J'arrive sur le tas j'ai lu en diagonale désolé si je répète certain truc

Dans un premier temps comme l'a dit A-gNa~ il faut ton zoning.
Une fois que tu as ton zoning tu fais ton design sous photoshop. Photoshop te servira en fait a faire toute la partie graphique de ton site, tu te retrouvera donc avec une grosse image comme ci dessous par exemple:

Vous devez être Membre du Forum pour voir les images

Ensuite avec dreamweaver tu vas créer la partie xhtml/css c'est a dire que utu va transformer ton image en "code" de facon a ce qu'on puisse cliquer...

Illustrator lui va plus te servir pour la création du logo de ton site si tu en a un

Enfin le slideshow non tu n'as pas besoin d'en créer un il en existe des centaines sur le net.

Ici par exemple qui sont fait avec la librairie JS motools ou encore ici qui sont spécialement pour wordpress

Enfin vu que tu ne t'y connait pas vraiment en site je rejoins A-gNa~ sur le fait que le mieux pour toi serait d'utiliser un CMS (joomla, dotclear, wordpress, dupral....)

En esperant avoir pu t'aider un peu sans avoir pour autant répéter ce qu'il a été dit au dessus

ok ....
et bien merci pour vos conseils, je vais essayer tous ca et voir si je m'en sort avec l'un où l'autre procédé que vous avez citez.

Je vous tiens au courant si je coince quelque part, ce qui je pense arrivera très souvent.

::

salut jlaw,

la réalisation d'un site internet est très complexe à mettre en oeuvre. parce qu'il existe autant de technologies à utiliser que de ressources humaines à les mettre en pratique que la réalisation est généralement exercée par une enteprise.

pour te rassurer jlaw, tu ne pourras pas tout assimiler en si peu de temps au risque de te décourager vite. et voici les étapes à maîtriser:

recherche et collecte d'informations
définition des besoins (analyse sectorielle et plus différentielle)
définition des technologies (flash, css, php, mysql, amfphp, cms, joomla, typo, etc.)
définition des charges et analyse du public cible
synthèse et rédaction du cahier des charges
agencement et structure des contenus (arborescence, structure et architecture)
design orienté zoning et intégration de l'ergonomie
ergonomie et recherche logique des navigation (menu, modules, recherches, incitation)
design thinking
création graphique (rough, storyboard, technique graphique, psychologie)
maquettage de la structure visuelle
maquettage de la structure ergonomique
maquette graphique et intégration des ergonomies visuelles (gui)
maquettage catalyst (maquette fonctionnelle)
création de la charte graphique
création de la charte technique
création du template (optimisation, slicing, optimisation des tranches)
design et montage de la page (html, css, include, intégration des tags cms)
installation du cms et configuration
intégration du template et test graphiques + fonctionnels
alimentation graphique selon le cahier des charges et la charte graphique
alimentation ergonomique selon le cahier technique
alimentation des contenus éditoriaux
définition des droits d'accès (groupes, accès privilièges, modération, administration) selon le cahier technique

ça c'est pour la partie "direction artistique"
sans parler bien évidemment de la partie "développement"
ou les autres parties selon la technologie employée.

sincèrement, je te conseille de lire un max, les livres sont fait pour ça. tu vas beaucoup apprendre. ça fait bientôt 20 ans que je suis dans les arts graphiques, j'ai commencé typographe continuer vers le graphisme avec une certification adobe flash professionnelle. et crois-moi j'en apprends tous les jours. tu ne peux pas tout comprendre. j'ai dirigé des groupes de travaux ou nous avions 2 ergonomistes et 3 graphistes sans compter les développeurs sur un site extranet. il y avait également 1 intégrateur et 4 designer d'architecture (php, xml, webservices et actionscript).

maintenant, le web a considérablement améliorer les conditions de travail avec notamment l'emploi de template prêts à l'emploi ou des cms. en regardant joomla et yootheme ou rockettheme et jomsocial ou cb on s'aperçoit qu'une com peut être vite montée mais pour cela il faut réaliser des cahiers avant de faire quoique ce soit.

voilà toutes les conditions cine qua non pour réaliser un site internet.
sur amazon tu trouveras des livres bien sympas!

mais je peux également t'aider...

au plaisir.

Bonjour ubyk,

merci pour tous vos informations et renseignements, j'ai bien noté.

Oui effectivement je commence à m'en rendre compte.
Depuis mon 1er post, je continue ma formation en étudiant le Html et les bases de Photoshop Cs5.

Mais comme vous l'avez dit il y a plusieurs autres langages à apprendre pour que je puisse réaliser mon site. Comme je l'ai dit auparavant je suis pas fainéante et je continue ma formation sur les différents langages mais mon site ne verra pas le jour avant plusieurs mois vu la masse de travail qui m'attend.

J'avoue que j'ai faillis me décourager mais vue la somme d'argent que j'ai investi pour acquérir les différentes logiciel je n'ai vraiment plus trop le choix et donc je suis obligé de rentabiliser mon investissement.

Maintenant, il est clair que je ne réaliserais pas ce projet par moi même étant donné que je dois tout apprendre et donc de l'aide serait la bienvenu.

Si vous pouvez m'aider dites moi quel genre d'aide pouvez-vous m'apporter svp?

Merci bien!

J'ai autoriser l'upload des psd jusqu'a 2mo environ, ça devrait etre bon non ?

c'est pas le bon post.
mais je prends note.
merci