Thème « Lucida Simple » pour l’interface SPIP 3

16 septembre 2011,
par Romy Têtue

Mots-clefs associés à cet article :

Rustine CSS expérimentale pour simplifier l’usage de l’espace privé de SPIP 3, ce « thème » apporte :

  • meilleure lisibilité par la charte typo homogène : tout à la même taille, en « Lucida Grande », fonte optimisée pour l’écran ;
  • en simplifiant : moins de filets et de cadres, peu de pictos, titraille allégée, etc.
  • deux colonnes permanentes, dans une plus grande largeur (900 px, mais pourquoi pas pousser jusqu’à adopter 960 Grid System) ;
  • valorisation du contenu, qui passe en premier et remonte dans la page : plus besoin de scroller pour commencer à lire !
  • distinction plus ostensible du mode édition ;
  • signalement du focus pour la navigation clavier.

Graphiquement : pas d’innovation, mais un retour de certains arrondis, avec parcimonie, en non sans nostalgie, en harmonie avec les icônes de Sébastien Desbenoît, qui sont grossies (mais moches, pardon, n’hésitez pas à améliorer). C’est moins un thème abouti qu’une preuve de concept (POC).


Qui dit simplicité, dit élagage : ce thème masque de nombreux boutons et pictos (inutiles), dont l’aide contextuelle (mieux vaut encore rien qu’une aide périmée qui induit en erreur), mais aussi des choses qui me sont inutiles (ce n’est qu’une préférence personnelle) comme le plongeur de rubriques et les outils de travail collaboratif interne (messagerie, agenda, etc.), mais je ne devrais pas le dire car vous n’allez pas vous en rendre compte. Notez que l’espace privé reste fonctionnellement inchangé et donc complètement utilisable.

KISS !

Attention, ce plugin est expérimental et n’a pas vocation à persister. La portabilité multi-navigateur n’est pas assurée et son code n’est pas exemplaire. Il est disponible sur GitHub, où vous pouvez poursuivre son développement.

Voir en ligne : https://github.com/tetue/lucidasimple

{#TITRE,#URL_ARTICLE,#INTRODUCTION}

Vos commentaires

  • Le 7 août 2012 à 09:37, par Romy Têtue En réponse à : Court-circuiter les rubriques de SPIP

    J’ai eu la même réaction qu’@arno à l’usage de l’interface SPIP 3 :

    L’interface de #SPIP-3 étant juste vilainissime et bourrée de détails torchés avec une grosse truelle, je me suis fait un #plugin (« Détails d’interface ») qui en corrige les aspects les plus insupportables

    Voir : http://seenthis.net/messages/81135

  • Le 8 août 2012 à 18:41, par Suske En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Salut tetue !

    Bel exercice et à mon sens plus constructif et efficace que celui que tu cites en commentaire.

    Deux « bugs » sur un spip 3.0.4 avec cette version du « plugin » :

    • les icones de la barre principale sont absentes (j’ai une ligne blanche, sans icone)
    • pas de bouton de validation du changement de statut

    La mise en évidence de la phase édition par des hachures est une piste de progrès : j’ai des rédacteurs qui ne voient pas spontanément où ils en sont dans la rédaction. Là c’est bien souligné.

    Personnellement j’aime l’écran en 3 colonnes mais peu l’utilisent. Ton exercice met en évidence l’intérêt de la suppression : beaucoup de place pour l’édition, c’est sympa.

    Sinon, réduire le nombre de boutons (messagerie, etc. ) c’est vraiment sympa aussi mais du coup, on met les boutons dans un menu principal ? Perso j’utilise la messagerie et les fils ical divers. Avec les notifications, c’est même franchement utile pour une équipe de rédaction. Mais en fait tu as probblement raison, ces fonctionnalités pourraient même sortir du core...

    A+

    Suske

  • Le 8 août 2012 à 19:16, par Suske En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Lol, j’ai retrouvé les icônes mais je n’écrirai pas comment en public :-p

  • Le 2 septembre 2012 à 09:16, par PtitTux En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    J’ai installé ta contribution sur une version 3.0.4 et j’ai pas de soucis a priori...
    C’est super sympa comme visuel par rapport à la version standard. Maintenant si je peux me permettre quelques remarques :

    • Avoir la possibilité d’afficher ou non les titres des menus
    • Le pied avec le logo de spip est un peu trop gros (question de gout)
    • Avoir une zone d’édition encore plus grande (sur les grands écrans c’est vraiment trop petit à mon gout toujours :-) )
    • Les hachures pour noter qu’on est en mode modification est super
    • La suppression de bcp de cadre rend le visuel bcp plus soft

    Sinon super boulot, j’espère que la version core se basera sur ton travail...

  • Le 4 septembre 2012 à 13:42, par Romy Têtue En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Merci beaucoup pour vos retours, c’est toujours très précieux !

  • Le 12 septembre 2012 à 09:21, par Peetdu En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Excellent !

    La zone de travail plus large est vraiment un plus. Le titre hachuré en mode édition également.

    Quelques remarques

    • le bouton « Retour à l’article » me manque un peu.
    • le texte sous les icônes du menu principal également.

    Idée

    • je verrais bien « La date de publication en ligne » passer dans le bloc « Article Numéro XX ».

    Enfin même conclusion que ptitTux : super boulot, j’espère que la version core se basera sur ton travail...

  • Le 16 septembre 2012 à 19:43, par Romy Têtue En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Voyant l’allure de l’interface se dégrader alors que s’annonçait la sortie de version, je m’étais précipitée pour apporter mon aide.

    Pourquoi avoir changé tous les pictos de l’espace privé ? Pourquoi en mettre autant ? si dénués de caractère ? Pourquoi changer la police (en révision 17937) ? Quels partis pris graphiques ont présidé ces choix ?

    L’espace privé de SPIP employait jusqu’alors la Verdana, police réputée pour sa lisibilité à l’écran (rétablie peu après en révision 18435) judicieusement alternée d’Arial. Quitte à changer, j’ai alors suggéré une autre fonte de bonne lisibilité, Lucida Grande (en révision 18239) — sans réaliser qu’il y a presque trois ans, Arno avait de même introduit Lucida pour le texte courant (en révision 14507).

    Mais Helvetica s’imposa finalement en révision 18449. Pourquoi ?
    Pourquoi retenir la même typo que le thème par défaut de WordPress, que Blueprint, etc. l’Helvetica très « pro », imitée par Microsoft sous forme d’Arial, qu’on voit partout ? Helvetica, pour exprimer le rien, c’est parfait rappelait un an plus tôt le graphiste David Rault lors de cette mémorable conférence typographique à Paris Web. Pourquoi rendre SPIP si neutre et insipide ?

    Il y a un an, mon dernier commit pour SPIP {JPEG}J’ai donc poursuivi à part ce travail, d’abord par nécessité d’améliorer mon confort d’utilisation, puis en profitant pour pousser l’expérimentation, publiant finalement ce plugin en quise de POC.

    C’était il y a un an.

    Côté dev il fut considéré, dans un troll qui en dit long sur « SPIP et la représentation graphique des classes dominantes », que « RIEN » de concret n’avait été fait. Sans même essayer. Et SPIP 3 vit le jour ainsi.

    Merci donc, infiniment, pour vos retours d’usage.

    Je reprendrais certainement la suite de ce travail quand j’utiliserais SPIP 3, aussi sentez-vous libres de poursuivre sans attendre.

    Il y a un an, mon dernier commit pour SPIP
  • Le 10 décembre 2012 à 13:11, par Romy Têtue En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    À propos de police de l’espace privé, un plugin récent de Joseph permet de la personnaliser : http://plugins.spip.net/polpriv

  • Le 17 décembre 2012 à 19:20, par bcolo En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Bonjour Romy
    Très bonne idée que cette modification de l’interface. Mais je n’arrive pas à récupérer le texte et les icônes de la barre principale (comme l’a remarqué Suske), ce qui est gênant. Et le texte dans les champs des articles est en courrier, ce qui n’est pas heureux. Comment le modifier ?

  • Le 19 décembre 2012 à 22:49, par bcolo En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    J’ai réussi à retrouver les icônes de la barre principale et à modifier la police des champs texte. En revanche, gros souci avec le changement de statut de l’article, qui n’a pas de validation, donc on ne sait pas si l’article est publié ou pas. Et impossible de caler la date de mise en ligne...

  • Le 14 janvier 2013 à 14:32, par Romy Têtue En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    @bcolo : merci de ton intérêt ! Ce proto expérimental a effectivement des défauts et pas des moindres. D’autres se sont-ils déjà penchés sur ces problèmes ? J’aurais peut-être l’oportunité de l’aboutir à l’occasion d’un prochain projet. Car ce serait dommage d’en rester là, si ça plaît :)

    Le problème que tu signalais est, paraît-il, un bug de SPIP3, corrigé dans sa dernière version.

  • Le 15 mai 2013 à 18:02, par Romy Têtue En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    BootStrap est un framework qui contient tout ce qu’il faut pour monter rapidement des interfaces. Bien qu’il se présente lui-même « By nerds, for nerds », ce serait pertinent de l’utiliser pour construire l’espace privé de SPIP (que seuls quelques dev et/ou pros, donc a priori aguerris, se risquent à personnaliser). Teddy Payet a entrepris ce travail de boostrapisation : Refonte de l’espace privé de SPIP en Bootstrap. Ça réveille l’envie de s’y intéresser !

  • Le 14 janvier 2014 à 15:48, par nicod_ En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Bonjour Romy,
    je tombe seulement maintenant sur ton travail et j’adore !
    Ça donne un back office beaucoup plus lisible. La navigation à droite est une vraie bonne idée.
    Je préfère ton approche à celle qu’avait eu @arno.
    J’ai corrigé deux trois petites pétouilles à mon goût mais c’est déjà très utilisable tel quel.

    J’ai bien envie de faire tester cette « nouvelle » interface à une équipe avec qui je travaille et qui passe sa journée sur SPIP.

  • Le 5 février 2014 à 22:16, par rjadot En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Bonjour,

    Bravo pour ce travail remarquable, présenté comme un simple patch alors qu’il est tout simplement super.

    J’espère qu’il va continuer !

    Raphaël

  • Le 11 décembre 2015 à 14:43, par kriz En réponse à : Thème « Lucida Simple » pour l’interface SPIP 3

    Tout d’abord bravo pour le travail déjà accompli.
    Est-ce que ce projet va continuer ?
    L’archive fournie date de 2011.
    Encore merci !

  • Le 17 juin 2016 à 13:13, par Yohoo En réponse à : Ordre d’appel des styles dans SPIP

    Juste un truc que je ne comprend pas : comment modifie t-on les styles des articles dans l’interface privé à partir de notre dossier squelettes.

    J’ai essayé de mettre typo.css ou typo.css.html a plein d’endroit de mon fichier squelettes ( /css ; /themes ; /themes/spip ). Rien n’y fait ...

  • Le 17 juin 2016 à 13:32, par Yohoo En réponse à : Ordre d’appel des styles dans SPIP

    J’ai trouvé la réponse à ma question ici :
    http://forum.spip.net/fr_247799.html

Répondre à cet article

forum message

Raccourcis : {{gras}} {italique} -liste [bla->url] <q> <quote> <code>.

Qui êtes-vous ? (optionnel)

Suivre les commentaires : RSS 2.0 | Atom