JeuWeb - Crée ton jeu par navigateur
[Avis] Graphisme d'acceuil - Version imprimable

+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Art, graphisme, audio (https://jeuweb.org/forumdisplay.php?fid=50)
+--- Sujet : [Avis] Graphisme d'acceuil (/showthread.php?tid=1010)

Pages : 1 2 3


RE: [Avis] Graphisme d'acceuil - didawin - 05-05-2014

Bon j'ai étudier tout ça, c'est vrai que flexbox nous aide grandement dans le positionnement Smile
EDIT: Pour ceux qui ne connaissent pas, je vous conseil grandement flexbox c'est pas super complexe à comprendre, mais c'est tellement pratique Smile
ça ne reste qu'une "ébauche" de la page, bien sur les images sont à changé n'en prennait pas compte ^^
voici ce que ça donne, qu'en pensez vous ?

Je compte aussi centrer le texte de présentation et les images de la galerie.
Sur les côtes vous ne trouvez pas que ça fait "vide" ?

www.haishin.fr/register3.php

[Image: register3.jpg]

EDIT : Le menu de connection serait donc mieux comment ? comme sur le premier post ? ou dans la barre de menu faire une zone de connection sur une ligne et non pas déroulante ? ou sur un des côtés ?


RE: [Avis] Graphisme d'acceuil - didawin - 06-05-2014

Second "jet", suite à vos remarques/conseils,
(Merci @lucard, je me suis inspiré de ta structure Wink http://i.imgur.com/TJUUDqc.png)
(Merci Xenos pour m'avoir fait découvrir flexbox Wink )

http://haishin.fr/register3.php

[Image: Background-En-Cours2.jpg]

Le rectangle blanc serait un parchemins (Lorsque j'aurais eu le temps de le dessiner Big Grin)
L'ange serait le même mais coloriser, prenant appui avec son pied contre le cadre de gauche, peut être une arme dans sa main ?
Ou alors afin de faire un effet "contraire", que les deux personnages se tournent le dos, effectuer une symétrie et l'ange s'appuierait donc sur le parchemin ?
Le manga assi n'est là que pour illustrer, c'est une image existante que j'ai repris en attendant d'en dessiner mais qui serait dans la même position.

Qu'en pensez vous ?
Sur les côtes vous ne trouvez pas que ça fait "vide" ?


RE: [Avis] Graphisme d'acceuil - @lucard - 06-05-2014

utilise :
background-size:cover;
plutôt que 100%;100%, ça ne déformera pas ton image.

pour le vide, peut-être un poil trop vide en effet,
tu peux donc passer tes div à width:800px; (900 max).


RE: [Avis] Graphisme d'acceuil - Xenos - 06-05-2014

Perso, je pense que le vide n'est pas plus mal: cela recentre l'attention sur ce milieu de l'écran, plutôt que de la disperser aux bords.


RE: [Avis] Graphisme d'acceuil - didawin - 06-05-2014

Citation :utilise :
background-size:cover;
plutôt que 100%;100%, ça ne déformera pas ton image.
Je trouvais aussi que le fond (la forêt) se déformé :/ Merci Smile

Citation :pour le vide, peut-être un poil trop vide en effet,
tu peux donc passer tes div à width:800px; (900 max).
Citation :Perso, je pense que le vide n'est pas plus mal: cela recentre l'attention sur ce milieu de l'écran, plutôt que de la disperser aux bords.
900 est effectivement trop grand :/ j'ai donc mis 800px

Il ne me reste plus qu'à bosser les personnages Smile
Je pense remplacer le personnage assis par un autre personnage dans la même position que l'ange mais alors ça serait un démon afin de montrer deux "camps" possible lors du choix de l'enregistrement
Je trouve ça assez jolie:
http://haishin.fr/register3.php

Est ce que le menu de connection déroulant comme sur la premiere page haishin.fr (menu en haut a droite en bleu) serait ici toujours bien en haut à droite ? ou ne serait-ce pas mieux une zone de connection sur une ligne : textarea(id) textarea(mdp) button(submit) dans le menu ?
ou un mélange des deux ? la zone de connection dans le menu mais qui se déroule ?

EDIT : J'ai ajouter la galerie d'image dynamique, tout fonctionne (c'est pas super jolie pour le moment mais j'ajusterait ça plus tard)


RE: [Avis] Graphisme d'acceuil - Ter Rowan - 06-05-2014

pour la connexion je préfère en ligne (comme dans le lien)

par contre je trouvai sympa la différence d'un gars assis et d'un gars debout

je verrais d'ailleurs plus un démon debout et un ange assis que l'inverse si tu dois bipolariser le monde ainsi


RE: [Avis] Graphisme d'acceuil - didawin - 06-05-2014

Citation :pour la connexion je préfère en ligne (comme dans le lien)
Oui c'est pour ça que je l'ai mis comme ça par rapport au début et que je vous demande vos avis car en me "surfant" sur d'autre site, je remarque que dans la plupart des cas, la zone de connection est directement visible en ligne dans le header, sans menu dérouant etc..,
une façon je pense de simplifier l'action aux joueurs ?

Citation :par contre je trouvai sympa la différence d'un gars assis et d'un gars debout

je verrais d'ailleurs plus un démon debout et un ange assis que l'inverse si tu dois bipolariser le monde ainsi

D'accord merci, je prend ton avis en compte Smile
C'est vrai que si je fait deux perso dos à dos sur le parchemin, ça ferait peut être un peut trop "coller", le personnage assis permet d'eclaircir un peu, d'ou le choix plus judicieux de mettre un ange pour éclaircir plutot qu'un démon ^^
De plus je vois mal un ange debout prêt à se battre et un démon assi qui lit un livre Tongue
-> @Tablette graphique : tu vas chauffer Tongue


RE: [Avis] Graphisme d'acceuil - archANJS - 06-05-2014

J'aime bien la disposition proposée par @lucard. Et je supporte Xenos sur le fait que l'espace vide ne rend pas mal en soi.

Pense à réduire le poids de ton image de fond (avec JPEGmini par exemple). Elle se chargera plus vite, ce qui donnera une meilleure impression à l'utilisateur à la première visite Smile


RE: [Avis] Graphisme d'acceuil - didawin - 06-05-2014

(06-05-2014, 07:30 PM)archANJS a écrit : J'aime bien la disposition proposée par @lucard. Et je supporte Xenos sur le fait que l'espace vide ne rend pas mal en soi.
J'ai repris les idée tu peut voir le résultat ici
http://haishin.fr/register3.php

Citation :Pense à réduire le poids de ton image de fond (avec JPEGmini par exemple). Elle se chargera plus vite, ce qui donnera une meilleure impression à l'utilisateur à la première visite Smile
Merci je ne connaissait pas ce soft Smile je vais faire ça dès que possible, il est vrai qu'elle était assez lourde à chargé.

Merci de me donner vos avis/conseils/remarques Big Grin


RE: [Avis] Graphisme d'acceuil - didawin - 07-05-2014

Petit up,
J'ai encore un peut de mal à me mettre au CSS3, j'ai donc besoin de votre aide, je voudrais faire mon formulaire d'inscription dans le parchemin avec un effets "incruster" : en gros je voudrais des input classique mais sans cadre,sans fond, ainsi je dessinerais une sorte de "ligne" sur le parchemin qui serais en faite une zone de texte, voyez vous ce que je veut dire ? avez vous une idée ?

voici "vite-fait" ce que je souhaiterais (le baton sur la premiere ligne | represente le curseur de frappement de texte)

[Image: formulaire.jpg]
(Ne tenez pas compte des traits "grossier" ça n'est bien sur qu'une esquisse faite pour illustrer le résultat que je souhaiterais obtenir)