revoir l'esthétique du site

luK · Le 26/11/2009, à 12:44

J'ai fais toutes ( enfin j'espère ) les découpes nécessaires pour le forum:
http://lukdesigner.free.fr/Ubuntu/v4/Decoupes/Forum/

Sur ce, bonne journée

YannUbuntu · Le 26/11/2009, à 16:39

Julientroploin a écrit :

YannUbuntu a écrit :
1) mettre à jour la page http://doc.ubuntu-fr.org/projets/design2009 avec les derniers mockups de la page d'accueil
McPeter s'est proposé de le faire

Fixed: http://doc.ubuntu-fr.org/projets/design2009#design

Julientroploin · Le 26/11/2009, à 17:43

Merci à tous les 2
Les codeurs, vous pourriez confirmer que vous avez tout ce qu'il vous faut? Ça permetra de réagir avant que vous bloquiez sur une découpe manquante.
Merci d'avance.

sam7 · Le 28/11/2009, à 18:41

curieux, mais sur les mockups freezés de l'accueil comme celui-ci
http://doc.ubuntu-fr.org/lib/exe/fetch.php?media=http%3A%2F%2Flukdesigner.free.fr%2FUbuntu%2Fv4%2FaccueilV4.3.png
il n'y a plus le koala ?
je ne me souvenais pas qu'on ai décidé de le supprimé...

Julientroploin · Le 28/11/2009, à 18:46

C'est parce que LuK est reparti de ses sources, pas de mes bidouillages.
Pas grave, ce n'est qu'un détail auquel il faudra tout de même penser plus tard.

Malizor · Le 28/11/2009, à 19:17

Personnellement je préfère qu'il n'y ait rien en fond, vu que ça serait soit invisible soit trop voyant (= gène la visibilité du reste).

L'idéal serait à mon sens de varier un peu l'image de la boite/cd (remplacer le logo Ubuntu de la boite par le koala ?) ou encore de rajouter des minis icônes à côté des liens de téléchargements.

Mais vu qu'à priori c'est trop tard, faites ce qui était prévu

Dernière modification par Malaria (Le 28/11/2009, à 19:18)

YannUbuntu · Le 28/11/2009, à 19:50

attendons de voir ce que ca donne sur le html. il sera toujours temps de l'enlever si ca ne passe pas.

sam7 · Le 28/11/2009, à 21:40

en effet, attendons voir ... surtout ne pas l'oublier, on a tellement batailler à se sujet !

Mpok · Le 29/11/2009, à 12:51

Bon, allez, un petit "coup de pique" facile...
(désolé, les gars, j'ai pas pu m'empêcher, la perche était trop longue...)

YannUbuntu a écrit :

attendons de voir ce que ca donne sur le html

On ne fait que ça...

sam7 · Le 29/11/2009, à 15:18

pour info... il est fort possible que demain soir je ne sois pas dispo... si quelqu'un pouvait assurer le cr de la réunion irc "en live" ici ça serait bien, merci... (et de me poster le log par mail également) merci d'avance

YannUbuntu · Le 29/11/2009, à 15:20

On va bientôt pouvoir remplacer le koala par le Père Noël

D'ailleurs d'après le planning proposé par sam, le koala ne servira qu'une semaine, et sera de suite remplacé par le lynx.
5 mois c'est long, j'espère qu'on arrivera à faire plus court.

@Mc Peter: pour info voici ce que j'obtiens actuellement :

Julientroploin · Le 29/11/2009, à 15:23

YannUbuntu a écrit :

@Mc Peter: pour info voici ce que j'obtiens actuellement :
http://img687.imageshack.us/img687/9035/redisign.th.png

Exactement pareil, mais je pense que c'est normal :
on est dimanche : il bosse dessus pour nous montrer un truc sympa demain

sam7 · Le 29/11/2009, à 23:01

YannUbuntu a écrit :

On va bientôt pouvoir remplacer le koala par le Père Noël
D'ailleurs d'après le planning proposé par sam, le koala ne servira qu'une semaine, et sera de suite remplacé par le lynx.
5 mois c'est long, j'espère qu'on arrivera à faire plus court.
@Mc Peter: pour info voici ce que j'obtiens actuellement :
http://img687.imageshack.us/img687/9035/redisign.th.png

j'espère bien et je souhaite que le KOALA serve plus d'une semaine...
il ne tiens qu'à nous d'accélérer la cadence... mon planning prévisionnel étant au plus "lent"
et il est vrai qu'il va falloir également plancher sur le LINX suivant le même esprit...
j'ai mon idée sur le sujet...

je voulais dire par là qu'il ne faudra pas oublier l'emlacement de l'animal de la version en cours...

j'espère que McPeter est en train de nous concocter quelque chose de sympa...
mettez-moi tout celà de coté svp merci (au cas où)...

quel sera donc l'ordre du jour ?
codage accueil & mockups documentation ?

Poupoul2 sera t'il à nouveau présent ?
(il doit noux préparer quelque chose pour le Planet normalement...)

NB : je crois qu'il serait judicieux de prévoir un bandeau "annonces" comme il existe actuellement
sur accueil & forum ... mais à mettre plutôt sur nos mockups forum & Planet ?

sam7 · Le 30/11/2009, à 21:54

Finalement, je suis là... mais nous ne sommes pas nombreux...
venez nous rejoindre sur IRC canal #ubuntu-fr-devweb

au programme ce soir : la documentation

on se base sur l'idée de départ (pour rappel)
http://doc.ubuntu-fr.org/utilisateurs/yannubuntu/proposition_accueil11
& sur http://forum.ubuntu-fr.org/viewtopic.php?id=235909&p=45 #1119
pour le contenu du bandeau latéral gauche

après réflexion : les rubans sur les tableaux proposés ici
http://lukdesigner.free.fr/Ubuntu/v4/docV4_Array.png
ne sont pas retenus... uniquement ceux de la table des matières

comme le dit julientroploin :

julientropoin a écrit :

je pense que ce qui est icones divers (liens internets, liens apt, etc...) ainsi que les blocs de codes peuvent rester identiques...

& on prendra les boutons "éditer" du mochup ci dessus...
(ainsi que les éléments concoctés au printemps derniers)
avec une petite variante dans le fonctionnement :

julientroploin a écrit :

là, il est ouvert en bas, or c'est ce qui est au dessus qui est éditable. Donc je propose de l'ouvrir en haut (le retourner verticalement en fait)
comme un onglet en bas du bloc à éditer

reste les niveaux des titres à définir (en cours)

voici ce que nous avons retenus comme idées :
premier niveau : gros titre en gras (de la couleur du "-fr")
second niveau : avec ou sans bandeau + ruban ? ... comme l'on trouve ici : http://lukdesigner.free.fr/Ubuntu/v4/forumV4_connecte.png
ensuite : taille en dégradé, et en passant par les 3 couleurs du logo, avec un décallage (tabulation) ?
on reste sur 5 niveaux comme actuellement... avec donc 4 couleurs de titres + 1 ruban (pour le second niveau)

pour être plus précis (par exemple) :
... en se basant sur une taille à "1" pour le texte en police "standard" (schématiquement)

Niveau 1 : couleur du -fr, en gras, taille 2.0em
Niveau 2 : bandeau ... (taille 1.8em ... ou plus petit si nécessaire)
Niveau 3 : une des 3 couleurs du logo, en gras souligné, taille 1.6em
Niveau 4 : une des 3 couleurs du logo, en gras, taille 1.4em
Niveau 5 : une des 3 couleurs du logo, en gras italique, taille 1.2em

(enfin, ça donne une idée du ratio / des proportions minimums entre les différentes tailles...
... quitte à réduire le tout de 80% si nécessaire pour coller à l'actuel)

qui peux donc nous mettre tout ceci en images (rapidement si possible) ? d'avance, merci

luk ? es-tu volontaire ?

merci aux contributeurs de ce soir...

------------
NB : rappel : ça se passe ici : http://doc.ubuntu-fr.org/utilisateurs/julientroploin/test_doc

Dernière modification par sam7 (Le 30/11/2009, à 23:43)

Ner0lph · Le 01/12/2009, à 00:23

Pour les blocs de code, il faut mettre les fonds de couleur claire pour que la coloration syntaxique ne puisse pas rendre illisible le texte.

Julientroploin · Le 01/12/2009, à 10:04

@ Nerolph : clair comment? la couleur actuelle passe bien, non? Tu as un exemple ou ça pose problème pour qu'on se fasse une idée?

*********************************************************************************

Alors pour que LuK n'ait pas besoin d'aller voir à droite à gauche pour les mockups, je regroupe les éléments :

* La table des matière est conservée comme tu l'avais conçue
http://doc.ubuntu-fr.org/_media/projets/03082009_docv4_1.png

* Menu de gauche (pour un utilisateur connecté) : on garde évidement le style freezé pour le forum et le contenu doit être :

ACCUEIL
DOCUMENTATION
* Actions
- index
- Editer cette page
- anciennes révisons
- derniers changements
- liens vers cette page
- S'abonner à la page
- S'abonner à la catégorie

* Divers
- participer à la docmentation
- documentation hors ligne
- télécharger ubuntu
- partenaires
FORUM
PLANET

A noter : la rubrique "édition récentes" de ton précédent mockup_doc n'est pas retenue.

* Pour réfléchir aux composantes listées ici http://doc.ubuntu-fr.org/utilisateurs/julientroploin/test_doc on est parti de tes mockups du printemps.
Plusieurs choses seraient conservées :
notes importante => http://doc.ubuntu-fr.org/_detail/projets/030809_docv4_notes_1.png
notes aide => http://doc.ubuntu-fr.org/_detail/projets/030809_docv4_notes_2.png
citations => http://doc.ubuntu-fr.org/_media/projets/030809_docv4_quote.png

Manquent :
notes classiques
notes astuces
notes warning

avis personnel (non discuté hier soir, je n'avais pas l'idée en tête) : on a 5 types de notes dont la signification est assez différente. Actuellement elles ont des couleurs différentes, ce qui facilite leur identification. Je pense que tout mettre en brun nuirait à la lecture.
Des avis sur le sujet?

* Pour les tableaux, on a trouvé ça sur ton site : http://lukdesigner.free.fr/Ubuntu/v4/docV4_Array.png
ça convient à tout le monde à l'exception des rubans sur sur la 1ereligne ne sont pas retenus...

* les icones divers (liens internets, liens apt, etc...) ainsi que les blocs de codes peuvent rester identiques...
(sauf précision de Nerolph sur son post précédent)

* boutons "éditer" ta proposition visible ici http://lukdesigner.free.fr/Ubuntu/v4/docV4_Array.png
est concervée, avec une petite variante pour éviter les confusions :

là, il est ouvert en bas, or c'est ce qui est au dessus qui est éditable. Donc je proposais de l'ouvrir en haut (le retourner verticalement en fait) comme un onglet en bas du bloc à éditer

* titres :
voici ce que nous avons retenus comme idées en se basant sur une taille à "1" pour le texte en police "standard" (schématiquement) :
- premier niveau : gros titre en gras (de la couleur du "-fr") taille 2.0em

- second niveau : on voudrait voir ce que donnerait un bandeau brun sur 1 ligne avec un ruban à gauche, un peu comme dans le forum http://lukdesigner.free.fr/Ubuntu/v4/forumV4_connecte.png
(taille 1.8em ... ou plus petit si nécessaire)

-niveaux suivants : reprendraient chacuns une coueur du logo, avec une taille décroissante avec un décallage (tabulation?) vers la droite
donc :
Niveau 3 : une des 3 couleurs du logo, en gras souligné, taille 1.6em
Niveau 4 : une des 3 couleurs du logo, en gras, taille 1.4em
Niveau 5 : une des 3 couleurs du logo, en gras italique, taille 1.2em

(enfin, ça donne une idée du ratio / des proportions minimums entre les différentes tailles...
... quitte à réduire le tout de 80% si nécessaire pour coller à l'actuel)

Dernière modification par Julientroploin (Le 01/12/2009, à 10:05)

YannUbuntu · Le 01/12/2009, à 11:03

Actuellement les titres niveau 5 se confondent avec le texte en gras. Et AMHA les titres niveaux 3 et 4, même rouges ne se remarquent pas suffisamment.

idée : pour rendre les titres niveaux 3, 4 et 5 plus visibles, on pourrait y accoler un mini-ruban ou bien un liserai de la couleur du titre :

TITRE NIVEAU 1
Titre niveau 2 ====================================== (bandeau brun)
Titre niveau 3 ======-----
Titre niveau 4 ===--
Titre niveau 5 ___

Pas trop grand pour éviter de confondre avec les titres niveau 2, et ne pas se retrouver avec des barres horizontales partout. Quelques cm a droite suffiraient. Ou bien seulement quelques cm de chaque coté par exemple.

TITRE NIVEAU 1
Titre niveau 2 ====================================== (bandeau brun)
---=====Titre niveau 3=====---
--==Titre niveau 4==--
__ Titre niveau 5 __

bien-sur sans les discontinuités. Je verrai bien un fin liserai comme la vague rouge au-dessus de "Présentation" de la nouvelle page d'accueil.

luK · Le 01/12/2009, à 13:12

Bonjour,

Je ne suis pas sur de pouvoir faire grand chose pendant les 2 semaines à venir
( période de partiels ).
Je vais faire du mieux que je peux.

Sur ce, bonne journée.

Julientroploin · Le 01/12/2009, à 17:17

luK a écrit :

Je ne suis pas sur de pouvoir faire grand chose pendant les 2 semaines à venir

je ferais des ébauches ce WE alors, mais pas avant (vive les conseils de classe).

Ner0lph · Le 01/12/2009, à 19:40

@Julientroploin :
• Voici un exemple de code illisibles : http://doc.ubuntu-fr.org/tutoriel/script_shell
• Pour info, le niveau 1 actuel est déjà à 1.5em.
• On peut utiliser des images dégradées (puisqu'on ne peut pas connaitre à l'avance la largeur et la hauteur du texte du titre, surtout s'il est sur plusieurs lignes).
• D'autre part, je suis contre les soulignements (réservés uniquement aux liens hypertextes) mais pas contre les bordures.

@YannUbuntu : Oui, ça peut faire très joli.

Julientroploin · Le 01/12/2009, à 20:51

Ner0lph a écrit :

• Voici un exemple de code illisibles : http://doc.ubuntu-fr.org/tutoriel/script_shell

en effet, le bleu c'est pas top...

• Pour info, le niveau 1 actuel est déjà à 1.5em.

oui, on est parti de ce qui existait déjà.

• On peut utiliser des images dégradées (puisqu'on ne peut pas connaitre à l'avance la largeur et la hauteur du texte du titre, surtout s'il est sur plusieurs lignes).

j'avais pas pensé du tout à ça...

@YannUbuntu : Oui, ça peut faire très joli.

suis d'accord. faut essayer...

sam7 · Le 01/12/2009, à 23:03

@ julientroploin :
je partage ton avis personnel sur les 5 types de notes...
@ yannubuntu :
j'aime bien ta première suggestion ... on pourrait mettre un début de bandeau en dégradé...
(je préfère tous les titres alignés à gauche...)

ou alors, on pourrait mettre l'ammorce du bandeau avec le ruban à gauche du titre, puis dégradé qui s'estompe très rapidement...

...il faut essayer ! bon courrage julientroploin, & merci

Julientroploin · Le 06/12/2009, à 22:32

Salut tout le monde!

j'ai repris les sources de LuK pour la doc et j'ai mis à jour le menu et fais :

- un mockup pour les notes et les citations :

- un mockup des titres en reprenant les couleurs du logo, bon c'est moche mais comme on en avais parlé, je vous le montre :

- un mockup des titres en reprenant la couleur du -fr pour les 3 premiers niveaux :

je n'ai repris les icones "livre" que sur les niveaux qui figureront dans la table des matières

- un mockup des tableaux :

des suggestions avant la réunion?

Dernière modification par Julientroploin (Le 06/12/2009, à 22:36)

sam7 · Le 06/12/2009, à 23:14

merci julientroploin pour ton travail :

j'aime bien le menu latéral (de tes 4 propositions) , c'est réussi !

j'aime bien la première http://pix.toile-libre.org/?img=1260135387.png

concernant la seconde http://pix.toile-libre.org/?img=1260134693.png
j'aime bien ce qui concerne la table des matières...
... mais pas les couleurs des titres dans les bandeaux, ça ne rends pas bien
... ni au final les bandeaux dégradés, ça ne rends pas bien
je crois qu'il faudrait essayer les couleurs, mais sans les bandeaux
en conservant le bandeau de niveau 2 avec un texte en noir ... de la bonne taille
(comme pour les bandeaux du forum... bien sûr http://lukdesigner.free.fr/Ubuntu/v4/forumV4_connecte.png
ça compensera le fait que pour le forum il y ait une double ligne et pas pour la doc... )

concernant la troisième http://pix.toile-libre.org/?img=1260134814.png
ça n'est pas génial non plus... et pourquoi un ruban sur le bandeau de niveau 3 au fait ?
il faudrait supprimer les bandeaux des niveaux 3 / 4 / 5 ...
...et y mettre les 3 couleurs du logo... par exemple pur la déclinaison "gnome" :
3 = rouge ... en fait, la même couleur que le "-fr" du niveau 1
4 = orange
5 = jaune

concernant la quatrième http://pix.toile-libre.org/?img=1260134890.png
c'est pas mal ... excepté le bandeau avec runban du niveau 3...
bien vu pour le titre sur 2 lignes ! à appliquer au bandeau du titre de niveau 2
c'est bon pour les tableaux ... mais
ne faudrait-il pas également proposer un exemple de tableau à double entrée ?

voilà pour mon humble avis sur la question avant la réunion de demain soir !

qu'en dites-vous ?

julientroploin, pourras-tu mettre en images mes suggestions/propositions ?
d'avance, merci

à demain soir sur IRC canal #ubuntu-fr-devweb vers 21h15 ... ou un peu avant

Dernière modification par sam7 (Le 06/12/2009, à 23:18)

Julientroploin · Le 06/12/2009, à 23:35

sam7 a écrit :

concernant la troisième http://pix.toile-libre.org/?img=1260134814.png
ça n'est pas génial non plus... et pourquoi un ruban sur le bandeau de niveau 3 au fait ?

Cette proposition était inspirée de ce que suggérait YannUbuntu...
le ruban, c'était pour que les 2 niveaux qui apparaissent dans la table des matières (2 et 3) soient présentés pareils, les classeurs de l'icones rappelant la table des matières.

il faudrait supprimer les bandeaux des niveaux 3 / 4 / 5 ...
...et y mettre les 3 couleurs du logo... par exemple pur la déclinaison "gnome" :
3 = rouge ... en fait, la même couleur que le "-fr" du niveau 1
4 = orange
5 = jaune

comme ça?

ne faudrait-il pas également proposer un exemple de tableau à double entrée ?

c'est un tableau à double entrée.
pour un tableau à simple entrée, il suffit d'imaginer que la "Colonne 0" n'est pas là...

Ubuntu-fr

Navigation

Liens de recherche

Annonce

#1151 Le 26/11/2009, à 12:44

Re : revoir l'esthétique du site

#1152 Le 26/11/2009, à 16:39

Re : revoir l'esthétique du site

#1153 Le 26/11/2009, à 17:43

Re : revoir l'esthétique du site

#1154 Le 28/11/2009, à 18:41

Re : revoir l'esthétique du site

#1155 Le 28/11/2009, à 18:46

Re : revoir l'esthétique du site

#1156 Le 28/11/2009, à 19:17

Re : revoir l'esthétique du site

#1157 Le 28/11/2009, à 19:50

Re : revoir l'esthétique du site

#1158 Le 28/11/2009, à 21:40

Re : revoir l'esthétique du site

#1159 Le 29/11/2009, à 12:51

Re : revoir l'esthétique du site

#1160 Le 29/11/2009, à 15:18

Re : revoir l'esthétique du site

#1161 Le 29/11/2009, à 15:20

Re : revoir l'esthétique du site

#1162 Le 29/11/2009, à 15:23

Re : revoir l'esthétique du site

#1163 Le 29/11/2009, à 23:01

Re : revoir l'esthétique du site

#1164 Le 30/11/2009, à 21:54

Re : revoir l'esthétique du site

#1165 Le 01/12/2009, à 00:23

Re : revoir l'esthétique du site

#1166 Le 01/12/2009, à 10:04

Re : revoir l'esthétique du site

#1167 Le 01/12/2009, à 11:03

Re : revoir l'esthétique du site

#1168 Le 01/12/2009, à 13:12

Re : revoir l'esthétique du site

#1169 Le 01/12/2009, à 17:17

Re : revoir l'esthétique du site

#1170 Le 01/12/2009, à 19:40

Re : revoir l'esthétique du site

#1171 Le 01/12/2009, à 20:51

Re : revoir l'esthétique du site

#1172 Le 01/12/2009, à 23:03

Re : revoir l'esthétique du site

#1173 Le 06/12/2009, à 22:32

Re : revoir l'esthétique du site

#1174 Le 06/12/2009, à 23:14

Re : revoir l'esthétique du site

#1175 Le 06/12/2009, à 23:35

Re : revoir l'esthétique du site

Pied de page des forums