Interface

Bonjour, voici deux propositions d'interfaces donc il faudrait rapidement nous faire part de vos remarques et suggestions...

On s'est basé sur la charte graphique de l'asso et les idées de Boris.
Et pour la mise en page, la navigation, nous avons tenu compte des repères de la plupart des internautes (cours d'ergonomie et de webdesign)

voilà il faut soit en choisir une si tout vous convient dedans, soit dire les éléments qui conviennent ou ne conviennent pas dans chacune d'elles dans l'éventualité d'en faire un "mix".

Il n'y a aucune couleur pour l'instant, mais le choix de ces couleurs est fait en fonction de la charte graphique de l'asso : orange, violet et blanc.
Le fond sera blanc pour une lisibilité optimale.
Vous pouvez également voir le principe de double lecture appliqué (infos essentielles plus haut et infos précises plus bas).

je rappelle qu'il est vraiment important de réagir vite pour que nous sachions vers quelle direction se tourner

dernière chose, cette interface représente une page quelconque du site, sauf la page d'accueil ou le cadre de sous menu sera remplacé par une photo et le cadre du milieu contiendra une présentation textuelle du site.

Interface 1 - etape 1 :




Interface 2 - etape 1

tout ça me parait super.
Mais il faut chosir une des 2?
J'aime beaucoup le graphique de l'interface 2.
Beau boulot les gars z'et les filles.

Ouais, difficile de choisir :
J'aime bien le côté "urbain" de la version 2 (le dessin en haut) ça donne bien l'idée du grain de folie qu'on sème dans la ville.
...
mais j'aime bien le côté "afro" et sobre de la version 1

Quel type de dessin comptez-vous mettre en haut de la version 1 ? Ce sera le même sur toutes les pages ?

Si on garde la version 2 je la préfèrerai un peu plus aérée : les dessins et le logo un peu plus réduit pour avoir plus d'espace entre eux et le texte.

J'attends vos réponses pour m'aider à me décider...
Bon courage au deux survivants d'Aix

...un autre truc qui me gène un peu dans la 2, c'est qu'il y a beaucoup de cadre et de contour autour des objets, j'aime bien les formes de rubriques, mais ne peut-on pas les faire sans le contour épais ?

... autre idée (excusez moi) : qu'est ce que ça donne si les deux cadres lecture 1 et lecture 2 sont en colonne plutôt que l'un sous l'autre ? L'idée serait de pouvoir voir simultanément l'image de lecture 2 en même temps que le txte de lecture 1.
... mais ça ferait peut-être des formats (hauteurxlargeur) difficile à utiliser, surtout pour les photos...
j'essai de repasser sur le forum vers 14h avant d'aller au boulot.

Nous vous remercions pour votre réactivité et surtout pour vos observations constructives.

Nous avons eu la même idée que vous, c'est à dire de faire un mix entre les interfaces.

Le cadre du site sera en bambou sur fond blanc. Les boutons de navigation principale (menu haut) seront à l'état initial sur fond violet et au survol sur fond orange, et ce sera le contraire pour le menu secondaire (menu gauche). Le texte sur ces boutons sera blanc.

Voici un apercu (juste pour les couleurs) :

http://batuc3is.ifrance.com/test/sousmenu.htm

pour ce qui est de mettre les deux cadres lecture 1 et lecture 2 en colonne, c'est plutôt une mauvaise idée par rapport au format des photos, comme tu l'as souligné Boris, mais surtout par rapport à la lisibilité qui sera compromise.
les courbes en dessous du logo seront donc abandonnées.

à propos des cadres nous voudrions savoir de quel contour épais tu parles, Boris ? celui autour du texte de lecture ou le cadre général autour de tous les objets ?

pour que tu puisse mieux nous expliquer voici une image avec les cadres dans différentes couleurs. Il te suffit de nous dire si tu parles du rouge (qui auraient du contenir le motif des costumes) ou du bleu.



autre chose, la présence des coins arrondis des cadres et boutons sera peut etre compromise et remplacés par des coins carrés (classiques). C'est embêtant esthétiquement et par rapport à la philosophie de l'asso qui ne se veut pas entièrement carrée, mais on a testé les différentes techniques et sémantiquement c'est pas correct et pas pratique du tout...

enfin, à propos de l'espace entre le logo + illustrations (l'entête quoi) et le texte, il faut savoir que là on a tout compressé dans 410 pixels de hauteur pour donner un aperçu mais que par exemple le cadre de lecture 2 (infos précises s'étendra automatiquement jusqu'en bas de page suivant la longueur du contenu)

de plus, les liens qui reprennent le menu principal seront donc tout en bas de la page

illustration de tout ça ci dessous



donc voilà prenez une décision à propos de : réduire ou non le logo + illustration d'en haut si vous convaincus ou non
Nous pensons que ça sera assez aéré, mais libre à vous de nous dire quoi faire pour cette problématique

Merci pour tes schémas,
concernant les contours, je pensais aux trois, ce qui me gène, c'est ce trait épais, autour de chque objet, mais si dans la version finale, ces cadres sont rempli d'une couleur ou d'un motif et que ce trait noir disparait, c'est ok...
... je sais pas si je suis clair...

Bon, déjà, j'ai réussie à poser l'image... donc dans cet exemple, je préfère la version 2 que la version 1.

Le logo : je préfère la taille qu'il a dans l'exemple 1, bref oui, un peu plus petit, si possible que dans le 2.

Le fond : le fond à motif du 1 fait plus "abouti" que le fond blanc du 2 (j e trouve).

J'aime bien l'idée des bambous, même s'ils sont un peu hors sujet (à part la canne à sucre et l'esclavage, peut-être), j'aime bien la texture et l'utilisation graphique qu'on peut en faire... Donc pour le fond blanc, je rséerve mes réticences et attends de voir ce que ça donne avec le bambou.

J'aime bien les boutons, évidemment sur autre chose qu'un fond uni, ça ferait un peu mal aux yeux...J'aime bien les proportions tailles des boutons/intervalles entre les boutons : ça fait aéré et maniable.

Petit rappel : je voudrais mettre tout le monde à contributions pour lire les textes danbs "ressources", le but : débusquer les phottes d'otokrafe et surtout me dire quels il vous semble pertinent d'expliquer dans le glossaire.

non les contours seront fins et soit d'une couleur

soit inexistants si le cadre a un fond de couleur

mais en aucun cas noirs

j'ai au cathie au tel elle m'envoie les photos + pressbook + son aujourdhui meme

Yup. comme ça c'est cool,
pour le CD, je te retrouve dans le sujet correspondant.

Chers tous,

j'interviens en totale collégialité sur le forum avec mon cher compagnon Jéjé. Je tiens néanmoins à préciser un point celui concernant le choix des bambous. Ce choix est relatif à ce qui suit, ce métaphore vient de l'idée que les bambous poussent toujours unis, très longs et groupés (solidaires), ils sont solides, envahissent le lieu où ils se trouvent, ils sont résistants, communiquent entre eux, ceci explique le fait qu'ils poussent naturellement.... c'est l'idée que je me fais pour la batucada... Voilà cet esquisse est à restructurer pour motiver son choix dans notre dossier et par rapport à vous (membres de batuc à digne)
Merci aussi d'approfondir, si l'idée est acceptée, sa signification graphique pour la bonne compréhension de nos intenautes...

Merci pour ton argumentation André, c'est une vision très positive de notre association,
...la fréquentant depuis 5 ans je la verrais plus sous la métaphore d'une meute de rat mutants ou de cactus psychotiques mais ce serait beaucoup moins esthétique pour les motifs du site.

des rats? des cactus? des bambous? oh faudra peut être penser à arréter les produits psychotropes!!

voici l'interface étape 2

merci de communiquer à André les observations, car je ne serai pas là pdt qq jours (sauf demain soir, vendredi)

je me suis permis de changer en rouge le chapeau du bonhomme du logo et le dessus du surdo et la mailloche en violet nous le dire si ça vous plait pas.

Pas mal du tout !
Je préfèrerais par contre tous les boutons de même forme (tous arrondis ou tous carrés).
Je trouve qu'il y a un léger déséquilibre entre le fonds et le devant, peut-être le violet et l'orange pourraient être un poil moins saturés ou un peu lus clairs.
Toujours pour cette histoire d'équilibre, je verrais les colonnes gauche et droite un peu réduites en largeur afin qu'il y ai un peu plus de fond (de respiration) entre ces colonnes et le texte central.

Mias sinon ça prend une jolie tournure, bravo Jeremy et André !

J'aimerai que Jeremy me dise si il a recu mon colis qui devait arriver aujourd'hui. Merci!

T'as aussi le droit de dire ce que tu pense de l'aspect du site, Cathie (en page 1 de ce sujet)

Cathie,

je le redis ici au cas où tu n'aurais pas vu ma réponse dans le sujet "sons/enregistrements sonores" :

non je n'ai pas reçu ton colis, s'il arrive demain je ne serai pas là je l'aurai donc sûrement lundi.

voici l'interface étape 3

Nous avons rétréci les parties de sous-menu et de menu interactif (bandeau gauche et droit).
Nous avons arrondi les coins carrés des boutons.

Pour les fonds de boutons, l'illustration, les cadres de contenu et le nom du groupe :

Nous avons remplacé la couleur violet #9900FF par la couleur #9966CC (moins saturé).
Nous avons remplacé la couleur orange #FF6600 par la couleur #FF9933 (moins saturé).

qu'en pensez-vous ?

Ils sont où les bambous?
Je trouve le fond de briques trop géométrique...
La couleur orange pas assez chaude [plus de rouge]
Normal que je sois casse roubignolles car j'ai le même caractère que Gimli.

Moi, y me déplait pas ce fond... comment l'avez-vous choisi ou fabriqué ? Il est inspiré des motifs de vêtement ?

Excusez moi mais il faut toujours que je contredise Cathie, sinon c'est pas marrant...le orange un peu plus rouge ok, mais pas plus foncé, 'faut quand même que ce soit pas pénible de lire du texte dessus.

C'est vrai çà, y sont où les bambous ?

les motifs de vêtements pour le fond ça serait cool et d'un effet plus naturel... quand à la couleur, je la trouve simplement un peu sale, trop saturé de marron, pas assez impressioniste mais c'est dur à expliquer...

salut,

un fond avec motif est totalement prohibé à cause de la lisibilité.

c'est déjà compliqué à mettre en place avec les bambous alors il ne faudrait pas plus surcharger la page je pense sinon l'effet d'aération du contenu ne sera pas du tout respecté et l'utilisateur n'aura pas envie de le lire.

pour ce qui est du orange je viens de le changer exprès selon vos désirs (moins pétant pour faire moins mal aux yeux) il vous mettre d'accord sinon on pourra pas avancer!

pour les couleurs, il faut savoir que l'on est limité selon la palette web aussi...
et aussi que l'on a pas tous les mêmes réglages sur nos écrans...

si vous n'arrivez pas à vous mettre d'accord, donnez nous juste le code RVB (rouge, vert, bleu, allant de 0 à 255 pour chaque couleur) au moins tout le monde verra la même couleur. Attention comme souligné qq lignes plus haut, seulement dans la palette des couleurs web.

au pire des cas utilisez le Chromoweb pour etre sur de choisir une couleur web (cliquez sur fond de page par ex, choisissez une couleur, pusi cliquez sur envoyer par mail pour avoir les valeurs RVB)

pour le fond c'est des immeubles, inspiré de la métaphore de la batuc qui envahit la ville (et donc les rues)

les bambous sont tout le long autour, je comprends pourquoi vous dites ne pas les voir... ;p (un pb de lunettes? lol )
d'ailleurs j'aimerais souligner la difficulté technique de les placer dans la page en séparation des différentes parties

T'inquiète, fait comme tu le sens Jeremy, moi, je vois pas l'intérêt de te donner 10 fois mon avis, et si les autres ne viennent pas donner le leur, poursuit sur ta lancée. Ce qu'on te dit c'est justes des détails sans trop d'importance et je suis d'accord avec toi : la priorité c'est la lisibilité, pour l'ambiance, je pense qu'elle est déjà représentative de l'association, après ,c'est le contenu qui doit faire le reste.