JeuWeb - Crée ton jeu par navigateur
Créer une interface - 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 : Créer une interface (/showthread.php?tid=1344)

Pages : 1 2 3 4 5 6 7


Créer une interface - Racktor - 29-05-2014

Bonjour à tous,
Je reviens vous embêter avec mes indécisions ... Cette fois c'est pour l'interface...

Voila après avoir coder au final plein de petit truc je n'arrive plus a bien les présenter, j'ai fais des modifs à partir de la forme que j'avais.

Bon pour garder mes joueurs il faut que je trouve une présentation sympas, oui j'ai des gens qui viennent maintenant mais la présentation rebute et pendant longtemps je ne savais pas quoi faire.

J'aimerais avoir vos avis et conseils :
je vous présente vite fait les éléments ...

- Je veux rassembler les éléments outgame dans une barre spécifique : cela se résumerait à Ma cité - Forum -Aide - Déconnexion
- Ensuite un menu pour avoir a disposition diverses informations (un résumé de la cité, des stocks, des besoins des chantiers, du marché) : c'est ce que j'ai essayé de faire avec le menu accordéon - ce type de menu permet de stocker plein de données dans un espace restreint.

-un menu pour naviguer dans la cité : c'est le menu gauche

-ensuite un corps de texte pour afficher les informations

-et enfin un menu actions : pour les actions ...
-et un bloc historique pour les MAJ du secteur

Voila alors maintenant il faut présenter cela ...

j'ai refait un peu la présentation sur une page et j'aimerais avoir votre avis avec l’autre présentation. IL faudrait vous connecter sur mon jeu avec le compte test (mdp :12345)

et aller sur cette page pour la nouvelle présentation : http://www.polis.power-heberg.com/espace_membres/vos_habitants_administration.php

et cliquer sur "habitation" pour avoir l'autre présentation (cette page)

je tiens à préciser que dans la nouvelle présentation je pense enlever la bannière, et je trouve que l'historique n'est pas bien placer : je propose de créer un onglet historique par exemple, juste après l'onglet "objectifs".

En vous remerciant par avance.


RE: Créer une interface - Globe - 30-05-2014

Bon alors je vais essayer de répondre en fonction de ce que j'ai bien pu comprendre.

Avis personnel : DÉBARRASSES TOI DE CET ACCORDÉON.
Pour faire plus constructif que ce commentaire simple, c'est absolument pas ergonomique, je me retrouve à faire des allez-retours avec ma souris pour accéder aux informations. Il faut penser au joueur sur la durée, moi au bout d'un moment ça va m'ennuyer de perdre autant de temps sur un menu.

En fait je ferais quelque chose de bien plus simple à ta place. Un menu "ressources" qui contient les infos de "Population". En fait c'est bien simple, là si je construis quelque chose je suis obligé de dérouler le menu pour voir si j'ai assez d'or. Si tu veux gagner de la place dans ce cas là je conseille une solution d'ergonomie bien connue : l'infobulle. Les joueurs savent que si ils passent sur l'icone d'une ressource ils ont en général le nom de cette ressource et parfois diverses informations (production/h par exemple)

L'inventaire, je ne connais pas ton jeu mais je me demande un peu ce qu'il fait là haut, tu as plein de place en dessous de ton menu d'actions et de toute manière tu en as pas besoin sur la plupart des pages de cet inventaire il me semble.

Pour le commerce une simple icone ferait tout aussi bien l'affaire.

Pour les chantiers soit un bouton dédié avec en infobulle les ressources qui lui manquent, soit un bloc dédié, je trouve que tu as assez de place au final.

Je trouve que l'historique n'est pas mal placé après je trouve ça un peu bête de le charger systématiquement même si le joueur en a pas besoin.

Donc voilà je t'ai fait un petit schéma rapidos : http://www.hostingpics.net/viewer.php?id=985350exemple.jpg
C'est pas une démo d'esthétique mais plutôt d’organisation un peu plus ergonomique je trouve. Aussi je trouve que c'est important sur tes icônes à gauche d'avoir une infobulle css réelle qui s'affiche rapidement en plus de ton alt. En gros tu dois penser à la fois à la lisibilité mais aussi à l'accessibilité. Dérouler un accordéon c'est usant, surtout pour des informations principales telles que la quantité d'or. Là l'espace occupé par l'exemple est inférieur à celui de ton menu accordéon. Le joueur veut son info vite et il veut également changer de page vite. J'exagère mais je trouve que dérouler un accordéon ça me prend quasiment autant de temps qu'un captcha.

J'espère t'avoir aidé après je suis pas expert mais je pense que faire quelque chose de genre rendrait la navigation des joueurs plus efficace et plaisante Wink

EDIT: Ce sujet devrait sans doute être déplacé en graphismes.


RE: Créer une interface - Racktor - 30-05-2014

Désolé pour le charabia du premier post ...

Et si je vais quelque chose comme cela (ici) ?

En gros :
- je rajoute un menu en haut a droite, un menu dans le cadre principal et ta barre...
- j’enlève le menu de droite et l’accordéon

Pour le menu de gauche (lotissement/ économie/militaire) :
si je fais des icones comme tu as fait (un petit dessin et un texte) avec une infobulle c'est mieux alors ?


RE: Créer une interface - Globe - 30-05-2014

Oui je trouve que ça clarifie. Après il faut que tu fasses ce que toi tu penses être le mieux aussi mais niveau accessibilité je pense que c'est mieux d'avoir le plus de chose à vue sans devoir dérouler / déplier / glisser. En gros je pars du principe que c'est comme en voiture imagines si t'avais un cache qui se refermait sur ton compteur de vitesses et que tu devais le déplier à chaque fois pour vérifier ta vitesse.


RE: Créer une interface - Racktor - 30-05-2014

je posterais ce que cela donne :le menu en haut a droite je vais le photoshoper et ca risque d'être trés laid mais au moins le découpage sera bien fixé.


RE: Créer une interface - Racktor - 31-05-2014

j'ai fait le découpage, il ne me reste plus qu'a placer le reste des boutons :
[Image: mini_917928interface.png].

Je préférai ton set d’icônes au demeurant ... Big Grin

Voila j’espère qu'il y a déja une amélioration non ?


RE: Créer une interface - Racktor - 01-06-2014

BHon je repost encore ...
[Image: mini_855588interface.png]
Voila le découpage a peu prés finalisé ... si cela convient alors j'affinerais les boutons, les menus, etc ...

J 'espère que c'est une amélioration ...


RE: Créer une interface - SorenS - 03-06-2014

Sans être méchant, je trouve que rien ne va avec rien en fait. Pourquoi le menu de gauche et les icônes en haut à droite sont en blanc sur fond gris ? on ne retrouve du gris nul part ailleurs.

Je pense que même icônes et même texte iraient mieux en fond transparent et couleur de texte noir ou rouge foncé par exemple. Clairement, ça manque d'unicité


RE: Créer une interface - Arkhanz - 03-06-2014

(03-06-2014, 09:34 AM)SorenS a écrit : Sans être méchant, je trouve que rien ne va avec rien en fait. Pourquoi le menu de gauche et les icônes en haut à droite sont en blanc sur fond gris ? on ne retrouve du gris nul part ailleurs.

Je pense que même icônes et même texte iraient mieux en fond transparent et couleur de texte noir ou rouge foncé par exemple. Clairement, ça manque d'unicité

Je suis ton avis sans aller aussi loin. Il est toujours délicat de penser et concevoir une interface qui a une personnalité, du style et un rapport direct avec l'univers de jeu. A ce que j'ai compris sur d'autres post tu débute avec photoshop, difficile donc de faire des design très poussés et complexes mais je trouve que ton travail est déjà très satisfaisant mais comme le dit SorenS, il manque un peu d'harmonie.

- Tu as des cadres bien droits, d'autres arrondis;
- Les boutons en haut sont un peu trop massifs, simple détail de taille;
- Les boutons relatifs au menu (en haut comme à gauche) ne font pas assez "bouton"; des petits détails en plus comme un contour, une texture ou même une ombre portée changeraient la donne.
- Entre les boutons du menu de gauche et ceux du haut, il y a clairement une différence de style.

Ça reste de l'ordre du détail, mais tu tiens le bon bout, bon courage !


RE: Créer une interface - @lucard - 03-06-2014

Généralement en Graphisme, on utilise 4-5 couleurs rarement plus, le reste sera des dégradé de ces couleurs...
tout dépends de l'ambiance du jeu...
je crois me souvenir que c'était à peu près ces couleurs (peut-être plus claires?) :

████████ ████████ ████████ ████████ ███████
#26272A - #B2A595 - #A08C6C - #CBB8A0 - #CFC7B7

je conseille donc pour faire les bases:
Kuler.adobe
ou encore
colorHunter qui permet, lui, de partir des couleurs d'une image.

je regarderais plus attentivement ce topic quand je serais chez moi pour donner mon opinion personelle sur le sujet (le boulot me bloque l'accès aux jeux en ligne...)