April 27, 2018 - No Comments!

La page 2 de Google n’existe plus!

L’avez-vous remarqué? La pagination des résultats de recherche du moteur de recherche Google n’existe plus, du moins sur les téléphones et tablettes intelligents.

Google effectue actuellement des tests d’optimisation et de présentation des résultats de recherche de sa plateforme mobile. Le changement sera bientôt déployé à l'ensemble de la communauté. Fini la pagination des résultats de recherche. C’est la navigation par défilement vertical qui est mise à profit sur mobile avec l’ajout d’un bouton « Plus de résultats » situé tout en bas des résultats de recherche.

Le nouveau bouton «Plus de résultats» remplace le système de pagination du moteur de recherche de Google sur plateforme mobile.

Le nouveau bouton «Plus de résultats» remplace le système de pagination du moteur de recherche de Google sur plateforme mobile.

Une décision sensée qui priorise le contenu de qualité

Ce changement reflète une approche axée sur les besoins et les habitudes des utilisateurs de plateformes de recherche mobile.

D’abord, puisque l’utilisateur ne dépasse rarement la première page des résultats de recherche, il n’a aucunement besoin de savoir que Google lui en offre plus d’une dizaine. Ce qu’il recherche, c’est du contenu de qualité correspondant aux mots clés qu’il a insérés dans le moteur de recherche.

Si l’utilisateur ne trouve pas de réponse dans les premiers résultats de sa requête, il peut utiliser le nouveau bouton « Plus de résultats ». Celui-ci présente à l’utilisateur du contenu de meilleure qualité que celui présenté par l’ancien système de pagination. En effet, chaque fois que ce bouton « Plus de résultats » est appuyé, 10 résultats de recherche naturels supplémentaires sont chargés, puis 3 nouvelles publicités Adwords de Google s’affichent également, mais tout au bas de ces nouveaux résultats de recherche. Ce sont donc les sites web au référencement naturel qui s’affichent en premier, et les publicités des annonceurs en second, contrairement à ce qui se faisait avant!

À vos téléphones!

Avez-vous pris connaissance de cette nouvelle fonctionnalité? Si oui, que pensez-vous de ce changement?

March 14, 2018 - No Comments!

Page d’erreur 404:
Frustration… ou opportunité UX?

Temps de lecture: 5 minutes

Quoi de plus frustrant que d’atterrir sur une page d’erreur 404? Cette page cul-de-sac du web interrompt la navigation et nuit à l’expérience utilisateur.

Cependant, lorsque son design est axé sur l’expérience utilisateur, la page d’erreur 404 peut transformer le désagrément de navigation en véritable opportunité de conversion!

Le présent article contient quelques conseils et bonnes pratiques en matière de design des pages d’erreur 404.

D’où viennent les erreurs 404?

Ce code d’erreur est certainement le plus répandu et le plus connu du web. Renvoyé par les serveurs d’hébergement web, il indique que les ressources ou pages web demandées par l’usager sont introuvables dans la base de données.

Les erreurs 404 peuvent être causées par l’utilisateur lui-même s’il effectue des fautes de frappe lors de la saisie de l’URL. Dans la majorité des cas toutefois, l’erreur provient des administrateurs web.

Causes fréquentes des erreurs 404

La migration d’un site web vers un nouveau serveur d’hébergement

En cas de changement d’hébergement ou de nom de domaine, il peut être difficile d’effectuer la redirection de toutes les pages et tous les liens internes du site web. Certaines pages peuvent être oubliées ou supprimées lors du processus de transfert. Les liens qui mènent à ces pages inexistantes deviennent ce qu’on appelle des « liens morts », puisqu’ils ne mènent nulle part.

La gestion d’un site web

En effectuant la gestion quotidienne ou hebdomadaire d’un site web, certains administrateurs web décident de supprimer un produit par exemple, ou de renommer une catégorie d’article. Certains modules de gestion de site web gèrent mal les changements d’URL occasionnés par de telles modifications, ce qui résulte en l’accumulation de liens morts.

Page d'erreur 404 par défaut

Par défaut, la page d’erreur 404 d’un fureteur présente très peu d’information. Pour les utilisateurs, ces pages sont particulièrement frustrantes parce qu’elles interrompent la navigation.
Source de la capture d'écran: http://www.designbypearl.com/404

Personnalisation de la page d’erreur 404: bonnes pratiques

La meilleure utilisation qu’on puisse faire d’une page d’erreur 404 en termes d’efficacité UX, c’est de s’en servir pour réorienter l’utilisateur et lui permettre de reprendre la navigation. En personnalisant la page d’erreur 404 d’un site web, on évite de perdre le visiteur! Une bonne page d’erreur 404 doit:

1. Informer l’utilisateur de la nature de l’erreur

Elle doit rassurer l’utilisateur en détaillant la nature de l’inconvénient.

Page d'erreur 404 d'Adobe

La page d’erreur 404 du site web d’Adobe, par exemple, indique clairement que la page recherchée est introuvable.
Source de la capture d’écran: https://www.adobe.com/ca_fr/windows

2. Permettre à l’utilisateur de reprendre la navigation

Afin de ne pas perdre le visiteur, la page d’erreur 404 d’un site web doit le rediriger efficacement vers une autre section ou page du même site web. L’ajout d’un moteur de recherche permet à l’usager d’effectuer rapidement une recherche à même le contenu du site. Il est également recommandé d’ajouter des informations de contact.

Page d'erreur 404 de Apple

La page 404 de Apple inclut un moteur de recherche ainsi que plusieurs liens vers les différentes sections du site web.
Source de la capture d'écran: https://www.apple.com/fr/404

3. Être traitée avec humour!

La personnalisation des pages d’erreur 404 est vite devenue partie intégrante de la culture du web. Bien traitée, elle est un gage de qualité au niveau du design et du développement du site web. Plusieurs agences, compagnies et sites web de vente s’en servent pour faire de l’humour!

Page d'erreur 404 de l'agence Featuring

La page d’erreur 404 de l’agence Featuring invite les internautes à participer à un karaoké!
Source de la capture d'écran: https://featuringagency.com/fr/404

Page d'erreur 404 de l'agence Featuring

Sur la page d’erreur 404 de Pixar figure le personnage de Sadness du film Inside out avec la mention ‘Awww… Don’t cry.’ (« Awww… Ne pleure pas. »)
Source de la capture d'écran: https://www.pixar.com/404

Je termine avec la page d’erreur 404 du site web des Jeux olympiques de Pyeongchang. Le comité olympique s’est moqué de l’erreur technique du spectacle d’ouverture des Jeux olympiques de Sochi, en 2014. Les anneaux olympiques présentés au spectacle d’ouverture se formaient à partir de flocons de neige lumineux. Une erreur technique, cependant, a empêché le cinquième anneau de se déployer! ...D’où le visuel humoristique de la page d’erreur 404 des JO de Pyeongchang ainsi que la mention ‘Sometimes, things don’t go as planned…’ (« Parfois, les choses ne se passent pas comme prévu…»)!

Erreur technique du spectacle d'ouverture des Jeux olympiques de Sochi, en 2014

Les anneaux lumineux du spectacle d’ouverture des Jeux olympiques de Sochi, en 2014. Le cinquième anneau ne s’est jamais déployé.
Source de l’image: https://www.webnoviny.sk/fotogaleria/otvaraci-ceremonial-zimnych-olympijskych-hier-v-soci/otvaracim-ceremonialom-odstartovali-zimne-olympijske-hry-v-soci-jpeg-5/

Page d'erreur 404 du site des Jeux olympiquesde Pyeongchang

La page d’erreur 404 du site web des Jeux olympiques de Pyeongchang, en 2018.
Source de l’image: http://olympics.org/404

November 16, 2017 - No Comments!

Les principales étapes de conception, de création et de développement d’un site web

Afin de faciliter la compréhension de mon processus de création de sites web, j’ai créé ce visuel informatif. J’y détaille les différentes étapes de conception, de création et de développement d’un site web.

 

Un travail d’équipe!

Le design d’un site web n’est pas une tâche qui s’effectue en solo! Je travaille en équipe avec vous tout au long du processus. Au courant des étapes préparatoires du projet, vous êtes appelés à réfléchir sur les objectifs de votre site web. Je vous demande également d’identifier votre public cible. Après cette analyse préliminaire, nous sommes en mesure de dresser la liste des contenus à produire et des fonctionnalités à inclure dans votre site web. Nous définissons également un échéancier de production qui nous aidera à maintenir le cap tout au long du processus.

La rédaction du contenu et l’architecture de l’information

C’est au cours de l’étape de rédaction du contenu et d’architecture de l’information que j’organise le contenu en différentes pages et sections. J’utilise un organigramme pour présenter la structure du site web. À cette étape, je commence déjà à penser aux différentes façons de permettre aux usagers d’interagir avec votre site web et de naviguer à travers vos contenus. Au courant du cycle d’approbation, nous finalisons la création des contenus et je peaufine la structure du site web.

La création et le design du site web

Ensuite vient l’étape de la création et du design web. Je commence toujours par assembler des wireframes. Les wireframes consistent en des schémas simples qui permettent de mieux définir les différentes zones et les composantes de chaque page de votre site web. C’est, en quelque sorte, le squelette de votre site web. Une fois les wireframes finalisés, il devient beaucoup plus facile de monter les prototypes du site web. Je crée les prototypes de façon responsive, c’est-à-dire de façon à ce que le site web s’adapte au support où il est visionné, que ce soit sur un écran d’ordinateur, une tablette ou un téléphone intelligent.

Le développement web et l’intégration des contenus

Une fois les prototypes finalisés et approuvés, j’entame le développement web et l’intégration des contenus. Près de 80% des sites web que je produis sont développés à l’aide de la plateforme de gestion de contenus WordPress. Avec WordPress, il vous sera facile de modifier et d’ajouter vos propres contenus, sans toujours avoir à faire appel à mes services! J’offre une formation WordPress pour vous permettre de vous familiariser avec la plateforme. Avant de mettre votre site web en ligne, je fais évidemment plusieurs tests afin de repérer des irrégularités au niveau de la programmation. Une fois que tout est en place et que tout fonctionne parfaitement, j’effectue la mise en ligne!

Prêt à vous lancer?

Comme vous pouvez le constater, le processus de conception, de création et de développement d’un site web est demandant! Ne vous inquiétez pas, votre temps et votre argent seront rapidement rentabilisés. Il n’y a rien de mieux qu’une bonne présence web pour faire connaître votre entreprise et vos services. Maintenant que vous connaissez mieux le processus, êtes-vous prêts à entamer votre projet de site web? Contactez-moi!

À propos de l’auteur

Laurence Pilon est diplômée du programme de design de l’information (design UX et design e-commerce) de l’Université Reading, en Angleterre. Elle travaille présentement à la Fondation du CHU Sainte-Justine. Elle enseigne également le design graphique au Collège Ahuntsic.

November 9, 2017 - No Comments!

Pictogrammes d’espèces menacées: travaux de mes étudiants

Dans le cadre du cours de Schématisation et de stylisation que j’enseigne présentement au Collège Ahuntsic, mes élèves ont eu à créer un micro-systèmes de quatre pictogrammes représentant des espèces en voie de disparition. L’objectif du projet était de développer des icônes qui serviraient aux besoins (fictifs) en publicité et en signalétique du Biodôme de Montréal.

Avec leur permission bien entendu, je me permets de vous partager les réalisations finales de certains étudiants. Je suis très fière de leur travail! Bravo! N’hésitez pas à commenter cette publication. Je partagerai vos commentaires constructifs avec eux!

Magali François


Stéphanie Giroux


Elissette Vidal-Garcia


Malik Douadi Ziani

November 3, 2017 - No Comments!

Des drapeaux ou du texte pour représenter les langues d’un site web: quelle option choisir?

Il y a de nombreux avantages à investir dans le développement d’un site web multilingue. Vos clients parlant l’anglais, l’espagnol, l’italien ou encore le portugais apprécieront les différentes versions linguistiques qu’offriront votre nouveau site web. Votre investissement sera vite rentabilisé: plus facilement vos clients accéderont à vos contenus, meilleures seront les chances qu’ils achètent vos produits et services!

Il y a toutefois beaucoup d’aspects à considérer lors du développement d’un site web multilingue. La méthode d’accès aux différentes options linguistiques en est une. Plusieurs designers et développeurs web optent pour une navigation visuelle, en affichant différents drapeaux sensés représenter les options de langues (voir figure 1). Est-ce vraiment la meilleure solution?

Duolingo language options

Duolingo utilise le drapeau de l'Espagne pour représenter l'Espagnol, mais le drapeau du Brésil (et non du Portugal) pour représenter le Portugais... Logique? Source: https://fr.duolingo.com/

Privilégiez le format texte, dans la langue d’origine

Pour que la langue soit compréhensible par le public concerné, il est mieux de privilégier l’affichage des choix de langues en format texte, et dans leur langue d’origine. Par exemple:

Français | English | Deutsch | Italiano | Español | 中国的 |  ไทย  | русский

Vous qui lisez le français et probablement pas le japonais, il est évident que si vous vous rendez sur un site japonais et que l’accès à la version française du site est indiquée par le terme バーゲン, vous allez très probablement éprouver de la difficulté à trouver le contenu dans une langue que vous comprenez! N’est-ce pas? C’est quelque chose à considérer pour les utilisateurs anglophones, hispanophones, italophone (etc.) de votre site! Peut-être que vos visiteurs parlant l’anglais reconnaîtront le terme « Anglais » comme étant la traduction du mot « English », mais certaines traductions sont moins évidentes (comme « Allemand » et « Deutsch » par exemple).

Et pourquoi pas les drapeaux?

Les drapeaux sont des symboles représentant des pays, et non des langues…

Certaines langues sont parlées dans plusieurs différents pays

Quel drapeaux utiliseriez-vous pour représenter l’Espagnol? Le drapeau de l’Espagne, de l’Argentine, du Mexique, du Venezuela, ou de la Colombie?

Certains pays ont plusieurs langues officielles

En cliquant sur le drapeau de la Suisse, vous attendriez vous à accéder à un site web en français, ou en allemand?

Certains visiteurs risquent de ne pas reconnaître les drapeaux affichés

Je suis certaine que vous-même, cher lecteur, auriez de la difficulté à différencier certains de ces drapeaux…

Quel est le drapeau de la Côte d'Ivoire, et quel est le drapeau de l'Irlande?

Quel est le drapeau de la Lituanie, et quel est le drapeau de la Bolivie?

Lithuanie? ou Bolivie?

Quel est le drapeau de la Belgique? Quel est celui de l'Allemagne?

Évitez de semer la confusion chez vos visiteurs!

Optez pour le format texte, dans la langue d’origine pour afficher les différentes options linguistiques de votre site multilingue. Vous éviterez ainsi de semer la confusion chez vos visiteurs, et augmenterez l’expérience utilisateur de votre site web!
Vous avez des questions au sujet de cet article? N’hésitez surtout pas à me contacter!

À propos de l’auteur

Laurence Pilon est diplômée du programme de design de l’information (design UX et design e-commerce) de l’Université Reading, en Angleterre. Elle travaille présentement à la Fondation du CHU Sainte-Justine. Elle enseigne également le design graphique au Collège Ahuntsic.

Sources

Richard, S. 2014. « Choix de langues sur un site web: drapeaux ou textes? ».http://blog.axe-net.fr/choix-langue-site-web-drapeaux-textes/.

Domingo, I. 2014. ‘Never use flags for language selection.’http://wplang.org/never-use-flags-language-selection/

May 6, 2017 - No Comments!

On information design

I just finished reading the book On information design, edited by Petra Černe Oven and Cvetka Požar. The book is a collection of essays that brings up more or less radical ideas about how design can change the world. In the introduction, Oven beautifully sums up the essence of my profession. I thought I would take the liberty to share some of his words here:

"We live at a time when scientists are asking themselves how they can present their work to the broader society so as to reach consensus on the ethical decisions related to research in the most advanced science; when, because of the complexity of our world, office workers in companies and state agencies no longer understand the language in which they have to communicate and so produce incomprehensible documents that take more and more time to decipher; when the products we need for our everyday lives are so sophisticated they come with complicated instructions hundreds of pages long; when there are increasing numbers of people with special needs in the area of reading and understanding visual communications…" (Oven, 2016).

We information designers deal with the challenge of making the complex clear. We are the "intermediaries between information and understanding".

Sources

Oven, Petra Černe. "Design as a Response to People’s Needs (and Not People’s Needs as a Response to Design Results)" in On information design, edited by Petra Černe Oven and Cvetka Požar. Ljubljana: The Museum of Architecture and Design, 2016.

 

 

February 22, 2017 - No Comments!

UX design: or the hidden face of the moon

IKEA analogy

Have you ever visited the furniture store IKEA? The store is divided into three main areas: the showroom, the marketplace and the self-service warehouse. Each area is then divided into smaller sections. The showroom, for example, is designed as a one-way natural path that leads customers through a sequence of assembled and designed kitchens, bathrooms, living rooms, and offices, etc. They are meant to give the user a better idea of the furniture and products in the context of a home. The market hall is where users can pick up small products that are organised by type (textiles, lighting, decoration, etc.). Each of IKEA’s furniture is identified by a unique name and code that is referenced on all of the company’s selling platforms, including its stores, catalogues, websites and its self-service warehouse. What IKEA offers is a holistic and consistent user experience.

IKEA stores are divided into three main sections: the showroom, where the furniture is displayed in context of assembled and designed rooms; the market hall, where customers can pick up some smaller objects for their homes; and finally the self-serve furniture area, which very much ressembles a warehouse. Source: IKEA Montreal. 2016. Store map.

Above is an example of an assembled and designed living room, in IKEA’s showroom section.

UX stands for user experience. Its development process encompasses all aspects of the end-user’s interaction with a company, its services, and its products (Norman and Neilsen). Many people mistakingly define UX design as a domain that is only concerned with websites’ navigation efficiency and general aesthetics. But UX is really about strategic problem-solving. UX design is concerned with developing and improving the interaction between a user and all the facets of a company.

UX on the Web

In theory, UX is thus a non-digital practice based in cognitive sciences and theories. In practice, it has been used mostly in the digital world of Websites, mobile apps and computer softwares. When it comes to Web design and development, UX designers are responsible for research, user testing, interface / visual design, and the development of prototypes. They tend to work closely with UI designers, programers and coders.

What about UI?

UI stands for user interface. It is the link between the user and the computer. UI design is concerned with the transferring a brand’s strengths and visual assets into Website, mobile app, or computer software interfaces. Similar to UX, UI design is also focused on responding to user needs in order to achieve business goals. UI designers are responsible for the creation visual designs that guide users through a product’s interface. They create information hierarchy using visual cues such as typography, graphic design, as well as interactive or animated elements. UI designers are also the ones that think about responsiveness across digital mediums of all sizes and platforms.

"UI design is a huge part of UX. I would say that in a good majority of cases the UX designer does in fact design the interface. But UX is not UI” (Flowers 2012).

The hidden face of the moon

It is important to remember that it takes a lot of “behind-the-scenes” work to create a successful and elegant Website. Complex UX design is always “hidden" behind the elegant interface design of successful Websites. UI is only a part of a complex strategic process that involves the creation of a wholistic user experience.

Process

In his book The elements of user experience: User-centered design for the Web, Jesse James Garrett has broken down the UX development process into five stages: strategy, scope, structure, skeleton and surface. The framework allows for a better understanding of the field of UX design.

1. Strategy: What problem needs to be solved?

During this stage, UX designers conduct user and market research in order to better understand the problematic and to develop user personas.

2. Scope: How do we solve the problem?

UX designers select platforms and features that must be included in the solution.

3. Structure: How do we organise the content?

UX designers create flow maps, user journeys, and information architecture diagrams to divide the content into logical areas, categories and hierarchies.

4. Skeleton: How do users interact with the content?

At this stage of the process, UX designers are concerned with information design, or the arrangement of specific interface elements that allow users to interact with the system’s functionalities. They create various sketches and iterative wireframes.

5. Surface: How do we communicate the brand values and aesthetics?

The final stage of the UX design process is about the sensory experience, or the visual design. With all the previously developed research material and UX design work, UI designers can confidently develop interfaces that communicate the brand values and aesthetics.

Once the UX development process is completed, the work is transferred to production, where coders and programers implement the concept.

Conclusion

I hope this post has demystified the terms UX and UI, and that you better understand the roles and responsibilities of UX and UI designers. Do not hesitate to contact me if you have any questions!

Sources

Flowers, Erik. 2012. ‘UX is not UI.’ HelloErik Experience Design.

Norman, Don and Jakob Nielsen. ‘The definition of user experience.’ Nielson Norman Group. 

Unger, John. 2016. ‘Difference between UX and UI design.’ Devsaran.

Pan, Simon. 2015. ‘The only UX reading list ever.’ Medium – Interactive Mind.

February 15, 2017 - No Comments!

La maison d’édition Gaberbocchus

Stefan et Franciszka Themerson

La maison d’édition Gaberbocchus a été fondée en 1948, à Londres, par les artistes et conjoints polonais Stefan et Franciszka Themerson. Leur collaboration artistique est née à Varsovie, en Pologne, où tous deux travaillaient ensemble comme producteurs de cinéma expérimental, mais également comme créateurs de livres pour enfants. Stefan prenait alors le rôle d’auteur, et Franciszka, d'illustratrice. Les Themerson ont fuit la Pologne au commencement de la Seconde Guerre Mondiale. Ils se sont retrouvés à Paris, en 1937, puis quelques années plus tard, en 1940, à Londres.

Inspiré du dragon de Lewis Carrol

Le nom Gaberbocchus vient du poème de fiction de Lewis Carrol, « Jabberwocky ». Ce choix de nom évoque le caractère absurde, ou encore surréel de certaines des publications de la maison d’édition. Celle-ci a d'ailleurs publié 59 livres en 31 ans. Les premiers livres ont été imprimés à la main, dans la demeure des Themerson même. Plus tard, ils ont déménagé l’imprimerie sur la rue Formosa, à Londres. Ce nouvel espace servait à la fois de salle d’édition et d’impression, mais également de salle de rencontre, où famille et amis intéressés par l’art et la science se retrouvaient, occasionnellement, pour assister à des visionnements de films, à des pièces de théâtre, à des concerts musicaux ou à des lectures de poésie.

Gaberbocchus Press

Le nom Gaberbocchus vient du poème de fiction de Lewis Carrol, « Jabberwocky ». Le poème surréaliste raconte l’histoire d'un dragon du même nom. Source: Franciszka Themerson, Gaberbocchus Press. 1951. From Jarry, Alfred. 1951. Ubu roi: drama in 5 acts. London: Gaberbocchus Press. At Special collections at the MERL (Museum of English Rural Life), Reading, UK.

Collaborations interdisciplinaires

Très vite, Gaberbocchus se spécialise dans la publication de textes intellectuels dits d'avant-garde. La maison d’édition a publié des textes de Stefan Themerson lui-même, mais également de Hugo Manning, de Bertrand Russell, de C. H. Sisson et de Stevie Smith. Gaberbocchus a également publié des traductions d’auteurs français dont Alfred Jarry et Raymond Queneau. Les Themerson étaient intéressés par le travail interdisciplinaire. Pour eux, il n’y avait pas de frontières entre la philosophie, l’art et la science.

Forme et contenu

Les Themerson étaient convaincus que le design d’un livre devrait en refléter étroitement son contenu. Avec Gaberbocchus, leur objectif était de créer des livres peu coûteux, au design inventif et imaginatif. La maison d’édition se distinguait nettement des autres compagnies de l’époque de par son caractère révolutionnaire. Stefan Themerson a lui-même affirmé vouloir créer des “best-lookers” et non des “best-sellers”. L’artiste et sa femme étaient sensibles à la matérialité des livres. Ils portaient grand attention à leur composition et à leurs dimensions. Ainsi, plusieurs de leurs livres sont imprimés sur des papiers de formats non-standards aux différentes couleurs et textures.

The Good Citizen’s Alphabet (publié en 1953)

Le livre The Good Citizen’s Alphabet a été publié par la maison d’édition Gaberbocchus en 1953. Il a été écrit par le fameux mathématicien, logicien et philosophe britannique Bertrand Russell, et illustré par Franciszka Themerson. Le livre est né d’une correspondance qu’ont entretenus Russell et les Themerson dans les année 40. L'alphabet socio-politique que renferme ce livre est un délicieux mélange entre écriture satirique et illustrations humoristiques: “O” pour “Objective: A delusion which other lunatics share”, ou encore “L” pour “Liberty: The right to obey to the police.” Ironiquement, le contenu du livre semble toujours être d’actualité, et ce, même 60 ans plus tard!

The Good Citizen's Alphabet, by Bertrand Russell

Le livre The Good Citizen’s Alphabet, de Bertrand Russell a été publié par la maison d’édition Gaberbocchus en 1953 (Source).

Mélange de surréalisme et de Dada

Dans le livre Ubu Roi d’Alfred Jarry publié par Gaberbocchus en 1951, textes et illustrations sont combinés d’une manière encore jamais vue dans l’industrie de la publication anglaise. Franciszka avait proposé à Barbara Wright, la traductrice, d’écrire directement sur la pierre d’impression lithographique qui serait plus tard utilisée pour imprimer les livres. L’artiste y a ensuite ajouté ces illustrations. Le produit final est une juxtaposition de croquis et d’écriture manuelle. Ce style est devenu une certaine marque de commerce de la maison d’édition Gaberbocchus. Les Themerson, à travers leurs nombreuses publications, ont exploré la calligraphie, l’écriture manuelle, la typographie produite par la machine à écrire, et les polices de caractères décoratives. Leur style est un mélange de surréalisme et de Dada.

Stefan et Franciszka Themerson ont vendu Gaberbocchus à une maison d’édition allemande en 1979. Ils sont décédés, à deux mois d’interval, en 1988.

Ubu Roi, d'Alfred Jarry

Franciszka Themerson avait proposé à Barbara Wright, la traductrice, d’écrire directement sur la pierre d’impression lithographique qui serait plus tard utilisée pour imprimer les livres (Source).

Sources

Barnard, Fiona. 2003. “The Gabberbocchus Press.” V&A Museum.
Kubasiewica, Jan. 1995. “An extraordinary venture.” Print 49 (5): 85–112.

February 8, 2017 - No Comments!

Le monogramme d’hier à aujourd’hui

Considéré comme l’ancêtre du logotype, le monogramme est l’une des plus anciennes méthodes d’identification d’une personne ou d’une autorité.

Les spécialistes des arts et du design ne s’entendent pas tous sur sa définition. En général, le monogramme est définit comme étant une marque ou une signature stylisée et formée de la combinaison de chiffres ou de lettres initiales d’un nom. Le monogramme sert à marquer l'appartenance. Il est utilisé pour signer un vêtement, une oeuvre, un meuble, ou tout autre objet appartenant à un propriétaire spécifique.

Les pièces de monnaie antiques

Les monogrammes ont d’abord été introduit sur les pièces de monnaie en Grèce et en Rome Antique. Ces pièces servaient non seulement de moyen d’échange, mais également de méthode de propagande. C’est ainsi que plusieurs d’entre elles marquent le reigne d’importants empereurs. Les monogrammes permettaient d’économiser de l’espace sur ces petites pièces de laiton, de cuivre, d’argent ou d’or qui ne dépassaient, dans certains cas, à peine les 3 cm!

Pièce de monnaie byzantine affichant le monogramme de Théodorich

Cette pièce de monnaie présente le monogramme de Théodorich dit « le grand » (455–526). Les historiens décodent un D et un N, pour Dominus Noster (Notre Seigneur), puis les lettres du nom THEODERICUS. Comme certains pourront le constater, les monogrammes n’étaient pas destinés à être lus, mais plutôt à être reconnus! Source: Coin Archives. 520–530. “Solidus Numismatik.” Coin Archives.

Le monogramme du Christ

Très vite l’église catholique a adopté le monogramme pour former ce que l’on pourrait qualifier d'« identité visuelle ». Le « chrisme » est un symbole formé des deux premières lettres du mot latin ΧΡΙΣΤΟΣ, qui signifie « Christ ». Le Chi (X) et le Rho (P) sont parfois accompagnés des lettres Alpha (α) et Oméga (ω), qui symbolisent le commencement et la fin. Le monogramme du Christ est d’abord inscrit sur des tombeaux, dans les catacombes romaines par exemple, puis éventuellement sur les mosaïques, les vitraux et les sculptures d’inspiration chrétienne.

Le monogramme du Christ

Ici, le chrisme est sculpté sur un sarcophage chrétien qui se retrouve aujourd'hui dans le Musée du Vatican. Lorsqu’entouré d’un cercle ou d’une couronne, le symbole évoque l’idée de l’éternité de Dieu le Père. Source: Source: OP, Laurence. 2007. “Chi Rho”. Flickr.

La signature du roi

Charles dit « le grand », ou Charlemagne (742–814), populairement considéré comme « l’inventeur de l’école », a appris à lire et à écrire en fait que très tard dans sa vie. Comme la plupart des rois et empereurs avant lui, il devait assurément signer ses documents officiels avec l’inscription d'une simple croix. Plusieurs historiens croient que son conseiller lui aurait appris à modifier cette croix pour la rendre distincte. Il lui aurait suggérer d’y ajouter consonnes aux extrémités et voyelles aux centre, de manière à former un monogramme de nom latin Karolus, qui se traduit par le nom français Charlemagne.

La signature du roi Charlemagne

La signature du roi est composée d’une croix ainsi que des lettres formant le nom latin Karolus, qui se traduit par le nom français Charlemagne. Source: Abulédu Data. "Monogramme de Charlemagne”.

Au tour des artistes

Les artistes savent flairer la bonne affaire lorsqu’il en est une! Plusieurs ont donc adopté le monogramme comme façon de signer leurs oeuvres. Parmi les plus connus se retrouvent l’artiste allemand Albrecht Dürer (1471–1528), le peintre français Henri de Toulouse-Lautrec (1864–1901) et le peintre autrichien Gustav Klimt (1862–1918).

Les monogrammes de Albreicht Dürer, de Henri de Toulouse-Lautrec et de Gustav Klimt

Le livre Artist’s Monograms and Indiscernable Signatures de John Castagno est une référence en matière de monogrammes et signatures d’artistes. Source: Dubois, Jean-Pierre. 2014. “Monogrammes”. JP DUBS.

Le trousseau de mariage

Le monogramme est devenu très populaire au début du XXe siècle. Symbole de richesse, il est graduellement apparu sur les objets du quotidien des familles aristocrates. Il était commun pour les femmes fiancées de broder leurs monogrammes sur les mouchoirs, nappes et édredons qui allaient constituer leur trousseau de mariage!

L’ancêtre du logotype

Aujourd’hui, les monogrammes sont partout! Certains bénéficient d’une incontestable notoriété dans le domaine de la mode par exemple, et représentent des marques telles celles de Louis Vuitton, de Roger Federer, ou encore, de Yves Saint Laurent.

Les monogrammes de Louis Vuitton, de Roger Federer et de Yves Saint Laurent

Sources

Seibt, Werner. 2016. 'The Use of Monograms on Byzantine Seals in the early Middle-Ages (6th to 9th centuries)’. Parekbolai 6. 1–14 see it here.