SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

288 Plugins, 197 contribs sur SPIP-Zone, 222 visiteurs en ce moment

Accueil > Vie de SPIP et autour de SPIP > Iconographie de SPIP > Refonte de l’identité graphique

Refonte de l’identité graphique

10 juillet 2017 – par Jordan Zuchiatti, nicod_ – 36 commentaires

41 votes

Lors de la SPIP Party 2017 à Toulouse, un nouveau contributeur est venu nous présenter son travail sur une refonte du logo.
Au delà de la refonte du logo, c’est une toute nouvelle identité graphique pour SPIP que Jordan nous propose.

Voici une retranscription de sa présentation :

« L’identité graphique de SPIP est perçue comme vieillissante, son logo souffre de quelques faiblesses et les sites de sa galaxie méritent un rafraichissement.

En tant qu’utilisateur régulier de SPIP sur les projets de l’agence 31mille, dont je suis le directeur artistique, voici ma contribution afin de moderniser et restructurer l’image de SPIP.

La refonte de l’identité graphique a pour premier objectif de confirmer à ses utilisateurs l’initiative et la dynamique que porte sa communauté depuis 16 ans. Autre objectif, montrer un visage moderne aux nouveaux venus.

Par cette mise à jour, comme on le fait pour un logiciel, l’évolution de l’identité permet, dans un cadre structuré, plus de flexibilité, la rendant ainsi parfaitement adaptable aux nouveaux médias et supports.

Le concept repose sur la synthèse de l’animal, écureuil / polatouche, et de la lettre « S ».

Pour la typographie, nous créons un caractère gardant le dynamisme d’une sans-serif, renforcé par l’italique, en y ajoutant des empattements discrets de serif. Une partie de la typographie originale du logo existant est conservée dans la courbe des « p ».

Un décrochement dans l’œil du deuxième « p » rappelle l’animal, en symbolisant l’oreille de l’écureuil. Se dessine alors le « mot-écureuil », avec sa tête, son corps, et sa queue en panache.

La force d’un logo réside dans son rythme. La courbe inférieure du panache est répétée à travers les deux « p ». Cette répétition crée une dynamique, renforce la cohérence de l’ensemble et permet la mémorisation et l’identification du symbole « panache ».

Le panache peut facilement être utilisé seul et devient l’identifiant graphique de SPIP.

La modernisation de l’identité passe aussi par le rafraîchissement de sa teinte. Le violet, couleur historique, tend maintenant vers une teinte plus électrique, plus actuelle. L’identité, avec cette couleur, ne passera pas inaperçue...

L’utilisation des deux teintes reste toutefois envisageable en fonction des usages, thématiques et ou supports.

Le symbole posé, une adaptation illustrative peut être utilisée sur des affichages de plus grande taille. Reprise ici d’un code graphique en référence à Firefox.

L’utilisation du symbole « panache » comme identifiant graphique étant convenu, la reconnaissance de SPIP sera faite à la seule vue de la courbe si particulière du panache.
Inscrit dans un rond, le symbole est parfaitement utilisable en petite taille, il devient favicon.

Et voici une proposition de rafraichissement pour les sites de la galaxie :

Voilà l’identité visuelle que j’ai envisagée pour la communauté SPIP. Elle doit en être le porte-parole, son amplificateur.

Jordan Zucchiatti  »

Le constat de départ étant partagé, ce nouveau logo et cette proposition de nouvelle identité graphique ont été accueillis avec enthousiasme par les participants.

Les sources du logo et de ses déclinaisons (favicon, en relief, titre de site et déclinaison mauve) sont disponibles librement sur la zone, aux formats SVG et PNG :

https://zone.spip.org/trac/spip-zone/browser/_graphismes_/logos/spip/spip_2017

Dernière modification de cette page le 11 juillet 2017

Retour en haut de la page

Tout afficher

Vos commentaires

  • Le 23 juillet à 10:25, par siromac En réponse à : Refonte de l’identité graphique

    Bonjour,

    Superbe travail et explications , je suis fan c’est joli !

    Eh les Spipers c’est bien les critiques mais faudrait quand même se décider pour « ce nouveau logo » depuis le temps. On peut critiquer longtemps mais pendant ce temps l’horloge tourne...

    Cordialement .

    • Le 25 juillet à 12:46, par nicod_ En réponse à : Refonte de l’identité graphique

      Comme l’a dit tcharlls, le logo a été intégré dans le 3.2 (version SVN), à la fois dans la dist (le squelette par défaut) et dans la procédure d’installation (la première chose qu’on voit quand on installe SPIP).

    Répondre à ce message

  • Le 24 juillet à 10:15, par Giani En réponse à : Refonte de l’identité graphique

    Le “favicon” est très accrocheur, j’aime beaucoup ! Il est épuré, moderne et en même temps très sympa, la fusion de la queue en panache et du S est un bon choix à mon sens. (Il se suffit presque à lui même).
    Après si on cherche un peu, c’est vrai qu’on ne voit pas trop le coté “polatouche” comme j’ai pu lire dans certains commentaires, pour ma part je n’ai pas de problème avec ça mais je peux comprendre que le fait de s’écarter du symbole d’origine puisse susciter des réactions.
    En tout état de cause avoir un logo flat, minimaliste composé d’une seule couleur dominante est à mon sens le meilleur choix à faire, pour une utilisation polyvalente qui marque bien les esprits et qui vieillira moins vite aussi !

    Coté interface il y a un bel effort de clarté et les couleurs vives viennent renforcer un coté attractif et au goût du jour (qu’on aime ou pas le rose et le violet).

    Je suis la remarque de @siromac, bien sûr il faut discuter des choix sur l’identité visuelle (c’est important), et en même temps étant habitué dans des cadres associatifs à ce genre de décision, les gens ont souvent du mal à trancher car certains aiment toujours trop le logo d’origine et ne parviennent pas toujours à s’en détacher ou voir le potentiel de la nouveauté, mais ce serait dommage de devoir se priver des évolutions en ne concrétisant pas les initiatives qui redonnent de la pêche à l’image (sans oublier que cela risque de démotiver les personnes qui sont force de propositions).
    En somme, super travail de Jordan. Je suis pour ma part comme d’autres 100% favorable à cette belle initiative.

    Maintenant petite question (de simple curiosité), comment voyez vous les choses pour la suite, comment la décision sera validée (si ce n’est pas déjà fait) ?

    • Le 25 juillet à 11:48, par tcharlss En réponse à : Refonte de l’identité graphique

      Maintenant petite question (de simple curiosité), comment voyez vous les choses pour la suite, comment la décision sera validée (si ce n’est pas déjà fait) ?

      Il a été intégré dans la future 3.2 (et il rend super bien :)

    • Le 25 juillet à 12:00, par Giani En réponse à : Refonte de l’identité graphique

      Merci pour l’info @tcharlss,
      Super génial alors ! Bravo à tous !

    Répondre à ce message

  • Le 12 juillet à 19:18, par Ziel En réponse à : Refonte de l’identité graphique

    Très beau travail effectivement. La seule chose qui me semble un peu « too much » c’est la disproportion entre le « S-panache » et la suite (« pip ») dans le logo lorsque le mot « Spip » est écrit en entier... moi j’aurais fait un « S » légèrement plus petit (ou écrit « pip » en un peu plus gros, ce qui revient au même), mais c’est vraiment pour le plaisir de critiquer.

    • Le 13 juillet à 09:52, par François Daniel Giezendanner En réponse à : Refonte de l’identité graphique

      Un effort est fait pour rappeler l’écureuil ainsi qu’expliqué ici :
      "Le concept repose sur la synthèse de l’animal, écureuil / polatouche, et de la lettre « S »."

      Et là :
      "Un décrochement dans l’œil du deuxième « p » rappelle l’animal, en symbolisant l’oreille de l’écureuil. Se dessine alors le « mot-écureuil », avec sa tête, son corps, et sa queue en panache."

      Cependant, panache mis à part, je trouve que suite au processus d’épuration, le rappel de l’écureuil est trop discret dans le pip. L’œil du deuxième p pourrait plus exprimer la tête de l’écureuil, pas seulement l’oreille, et les jambages des p pourraient évoquer plus explicitement les pattes de l’animal, un mariage entre typographie et représentation schématique du polatouche. Il faut que l’acronyme spip et l’écureuil apparaissent d’évidence, avec peut être une perception visuelle qui bascule de l’une à l’autre comme pour les figures ambiguës. Évidemment c’est facile à dire ... quand à le réaliser ...

    • Le 21 juillet à 15:21, par Fa_b En réponse à : Refonte de l’identité graphique

      L’œil du deuxième p pourrait plus exprimer la tête de l’écureuil, pas seulement l’oreille

      Je plussoie à 100%. Le problème actuellement c’est qu’une fois l’oreille découverte c’est toute la tête dans l’œil du P que l’on devine. Du coup ça fait « mal dessiné », tête écrasée, etc… Donc soit enlever la référence à l’oreille, soit y aller carrément et proposer la tête en défonce (silhouette) dans l’œil du P.

      Je n’irai pas jusqu’à mettre les jambes du P en pattes, trop illustratif du coup ça se voit déjà suffisamment.

      Sinon c’est chouette, le principe me plait.

    Répondre à ce message

  • Le 14 juillet à 14:33, par amilcar En réponse à : Refonte de l’identité graphique

    Moi j’adhère ... au logo

    Méfiez-vous de celui qui parle de Spip pour ne rien dire. Ou il est stupide, et vous perdez votre temps, ou il est très fort, et vous perdez votre argent.

    Répondre à ce message

  • Le 15 juillet à 13:36, par tetue En réponse à : Refonte de l’identité graphique

    Très beau travail, précis et déclinable, bravo ! Bien vu le rappel de l’oreille dans l’œil du dernier P !

    Deux choses sont cependant gênantes :

    • la mascotte de SPIP n’est pas un simple écureuil mais un polatouche, dont la capacité à voler évoque une certaine liberté, laquelle est une composante, me semble-t-il, essentielle de SPIP.
    • SPIP s’écrit en lettres capitales. C’est un sigle, pas un petit nom ;-)

    Répondre à ce message

  • Le 12 juillet à 22:59, par Manu En réponse à : Refonte de l’identité graphique

    La (le ?) favicon est très réussi et semble faire l’unanimité. Je ne dirais pas la même chose du logo. Pourquoi ne pas utiliser le graphisme favicon comme logo ? (en adoptant une couleur plus fédérative que ce rose qui « a le droit d’avoir ses fans » mais qui n’est certainement pas ce qu’on appelle un choix rassembleur)

    Répondre à ce message

  • Le 12 juillet à 18:49, par Yohooo En réponse à : Refonte de l’identité graphique

    Bravo !

    Travail pro et pertinent. Traitement typographique au top..

    J’ai du mal à me faire au rose « électrique », mais ça viendra avec l’âge :-)

    Belle gestion des contre-formes dans les favicons.

    Et enfin, merci pour l’aspect pédagogique de la présentation !

    Répondre à ce message

  • Le 12 juillet à 16:28, par tcharlss En réponse à : Refonte de l’identité graphique

    Pouce bleu ! 5 étoiles !

    Répondre à ce message

  • Le 12 juillet à 10:43, par Chourak En réponse à : Refonte de l’identité graphique

    Je ne suis pas fan.
    Trop rond, trop de courbes.
    Je comprend très bien la démarche et les explications mais je n’accroche pas.
    Les goûts et les couleurs évidemment :)
    En revanche je préfère l’approche suivante : http://spiplogo.lestests.com/toutes-les-propositions/graphie-logo-spip-09

    Répondre à ce message

  • Le 12 juillet à 08:39, par Chris En réponse à : Refonte de l’identité graphique

    Superbe travail et l’explication qui va avec !
    Félicitations.

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Le plugin ZotSpip

    28 mai 2012 – 138 commentaires

    Synchronise Spip avec une bibliothèque (personnelle ou partagée) de références bibliographiques Zotero. Utilisez Zotero pour gérer / importer / rédiger vos références bibliographiques, puis incorporez vos références bibliographiques dans votre Spip avec (...)

  • ScolaSPIP 4

    19 janvier 2016 – 213 commentaires

    ScolaSPIP est plugin-squelette responsive personnalisable pour sites Web d’établissements scolaires basé sur SPIPr Présentation de ScolaSPIP Ce plugin pour SPIP 3 est développé par la Dane de l’académie de Versailles pour les webmestres de cette (...)

  • MediaBox

    10 mai 2010 – 514 commentaires

    Avertissement Le présent plugin est installé et activé par défaut sur toute les version de SPIP > 3.0. Inutile donc de l’installer manuellement sauf si vous utilisez SPIP 2.1. Aperçu La MediaBox est une Boîte multimédia polyvalente et (...)

  • Sommaire automatique

    31 janvier 2013 – 14 commentaires

    Ce plugin repère les intertitres des textes de vos articles et s’en sert pour génèrer un sommaire. Ce dernier peut être inséré automatiquement au début de chaque article, ou utilisé dans les squelettes pour générer un sommaire sur n’importe quel autre (...)

  • La Fabrique

    20 avril 2012 – 316 commentaires

    La Fabrique est un outil pour webmestres ou développeurs qui souhaitent créer des plugins. La Fabrique est capable de générer le code source minimal d’un plugin pour SPIP 3 (elle accélère donc le démarrage d’un plugin) et peut s’occuper également de (...)

Ça spipe par là