Seuls les membres ayant 30 points peuvent parler sur le chat.

Forum Casio - Vie communautaire


Index du Forum » Vie communautaire » Nouvelle charte graphique pour PC
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Nouvelle charte graphique pour PC

Posté le 10/06/2014 23:54

Bonjour à tous,

Dans la continuité de ce HS, j'ai proposé à la communauté un nouveau design pour le site, et pour ce faire, il faut définir une charte graphique claire et précise pour pouvoir créer un thème Bootstrap correspondant.

Tout d'abord, les grandes lignes : flat design ou design plus réaliste ? Côtés plats ou arrondis ? Dégradés de couleurs ou pas ? Ombrages ? Si oui, où ?

Je complétais ce post plus tard, afin d'ajouter les critères de la charte graphique (qui ne sont ni plus ni moins les variables des sources de Bootstrap), mais si vous voulez en discuter, ça se passe ici !

Edit by Eiyeron : bossant sur le thème aussi, je stocke une page mise à jour à chaque modif que je fais/palra fait sur le thème sur mon serveur.


Pages : Précédente1, 2, 3, 4, 5Suivante
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:25 | #


Ok, on pourrait lancer ça après le bac, j'ai vraiment besoin de réviser, enfin si tu veux créer le repo vas y, puis donnes nous le lien après
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:26 | #


J'verrais bien quelques satellites sauter dans la "version" mobile, genre le générateur de cours de que l'on cacherait uniquement quand on est en sm ou xs.

Ajouté le 12/06/2014 à 15:26 :
J'verrais bien quelques satellites sauter dans la "version" mobile, genre le générateur de cours de que l'on cacherait uniquement quand on est en sm ou xs.
TheprogHors ligneMembrePoints: 1447 Défis: 20 Message

Citer : Posté le 12/06/2014 15:26 | #


Moi j'aime bien
C'est du latin ?
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:26 | #


Palra, t'as déjà une base que je puisse push? Quel site aussi? Gitorious donc?
LephenixnoirEn ligneAdministrateurPoints: 15732 Défis: 136 Message

Citer : Posté le 12/06/2014 15:27 | #


Niveau CSS, on peut dire que "je m'y connais". Je peux vous donner un coup de main si vous le désirez, mais je ne m'y connais que très peu en webdesign.
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:28 | #


Bon bah voilà : https://github.com/palra/bootstrap beaucoup plus simple
C'est du latin oui, le Lorem Ipsum

EDIT par eiyeron : virgule en trop dans l'url
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:28 | #


Le Lorem Ipsum est un faux-txte généré pour avoir un visuel avec du "vrai" texte ordonné comme des phrases, des mots, des paragraphes pour vérifier que tout fonctionne comme prévu

Ajouté le 12/06/2014 à 15:29 :
Palra, t'es sure que ça vaut le coup carrément de forker bootstrap? Il y a des générateur pour changer ses couleurs. C'est une librairie, pas une base.
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:29 | #


Faudra que vous me donniez vos usernames sur Github pour que je vous ajoute en tant que collaborateurs. Quand au subtilitées de Bootstrap, lisez le README si besoin, plus particulièrement en ce qui concerne Grunt
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:29 | #


Eiyeron pour moi.

Ajouté le 12/06/2014 à 15:30 :
Voici un des générateurs dispos : http://pikock.github.io/bootstrap-magic/app/index.html#!/editor
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:30 | #


C'est plus simple de forker Bootstrap parce qu'ils proposent dans leur repo les outils pour compiler les sources plus facilement (Grunt justement), et les générateurs se
limitent à changer les couleurs, je pense qu'on devra aller plus loin que ça

Ajouté
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:32 | #


Au pire, un css permet de patcher le style, non? Bah si tu veux, sio on peut concevoir un thème plus facilement avec bootstrap, pourquoi pas? On peut se baser sur la version incluse de bootstrap? (sans charger le bootstrap.theme.css là) J'aime pas sa façon de rajouter des gradients de partout.
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:36 | #


Pourquoi pas, mais patcher les variables des sources de Bootstrap est plus efficace et plus simple, on est sûr de ne rien oublier comme ça car tous les styles sont définis avec ces variables dans Bootstrap.
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:36 | #


Oui, ok, ça marche, j'ai cloné to nrepo, faut que j'installe node, c'est tout?
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:38 | #


Voilà, puis après t'installes grunt. Je vais uploader sur le repo un HTML contenant tous les composants de Bootstrap à tester, ce sera plus simple de voir les modifs à l'échelle d'un site.
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:39 | #


Ca marche! Pour info, si tu as skype, mon pseudo est le même qu'ici, si tu as besoin de me contacter. Un avantage utile est que 'jai un serv, j'hosterai si je peux les pages de résultat sur le serv.
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:41 | #


Super, bah si tu peux hoster le résultat ce serait pas mal oui
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:42 | #


Héhé, un VPS ça sert beaucoup.
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 15:46 | #


J'ai mis dans le fichier dist/index.html tous les éléments de Bootstrap à tester.
git pull

Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 15:46 | #


C'est noté

Ajouté le 12/06/2014 à 15:56 :
http://geekbros.tk/~eiyeron/bootstrap/

^Template.

Ajouté le 12/06/2014 à 16:17 :
Fais gaffe, compiler bootstrap fait supprimer KitchenSink.

Ajouté le 12/06/2014 à 16:20 :
Mettons-noud 'accord sur les couleurs d'abord.
PalraHors ligneMembrePoints: 276 Défis: 0 Message

Citer : Posté le 12/06/2014 16:35 | #


J'ai fixé le problème de suppression du Kitchen Sink. Pour les couleurs, déjà on garde le même rouge, soit #A91616. Ensuite faut que les autres couleurs collent avec, donc ça fait qu'on a la variable @brand-danger qui vaut #A91616 (dans less/variables.less) puis faut proposer d'autres qui aillent avec.
Calculatrice : Graph 35+ modée
Système d'exploitations : Apricity OS - Windows 10
EiyeronHors ligneAncien modérateurPoints: 5513 Défis: 57 Message

Citer : Posté le 12/06/2014 16:42 | #


Ptoing j'ai envoyé une nouvelle branche de mon pseudo pour te montrer ce que j'ai fait pour le moment. J'ai crée un mixin du nom de "brand-planet-casio" qui comprend la couleur du @danger avec ton gradient.
Pages : Précédente1, 2, 3, 4, 5Suivante

Planète Casio v42 © créé par Neuronix et Muelsaco 2004 - 2019 | Il y a 90 connectés | Nous contacter | Qui sommes-nous ? | Licences et remerciements

Planète Casio est un site communautaire non affilié à Casio. Toute reproduction de Planète Casio, même partielle, est interdite.
Les programmes et autres publications présentes sur Planète Casio restent la propriété de leurs auteurs et peuvent être soumis à des licences ou copyrights.
CASIO est une marque déposée par CASIO Computer Co., Ltd