Logo Wikipédia modifié

Refonte Wikipépia

Choix UX

Page d'accueil Flèche du bas

L'objectif de cette nouvelle interface est d'améliorer l'expérience utilisateur en réduisant la surcharge d'informations visuelles présente sur la page actuelle. J’ai choisi de privilégier une approche minimaliste et aérée, mettant en avant les fonctionnalités essentielles et favorisant la clarté.

La page d'accueil proposera un court texte introductif expliquant brièvement la mission et les objectifs de Wikipédia, pour offrir aux utilisateurs une meilleure compréhension du site dès leur arrivée.

En bas de page, un bandeau regroupera les fonctionnalités clés :

  • Une barre de recherche centrale pour un accès rapide aux contenus recherchés.
  • Une mise en avant de la possibilité de faire un don, afin de soutenir le fonctionnement de la plateforme.
  • La possibilité de se connecter, simplifiant l’accès aux fonctionnalités personnalisées.
  • Un menu burger permettant d’accéder aux éléments du menu principal proposé actuellement.

Ce bandeau se fixera en haut de la page après le défilement, garantissant une accessibilité constante.

Sous la ligne de flottaison, la page mettra en avant des éléments captivants et engageants pour inciter à l’exploration :

  • Une section dédiée aux articles liés à l’actualité.
  • Une rubrique d’anecdotes insolites pour stimuler la curiosité.
  • La photo du jour, qui servira de point de départ visuel pour découvrir de nouveaux contenus.

Certains éléments seront légèrement inclinés ou disposés de manière dynamique pour bien séparer les blocs d’information, rendant la lecture plus fluide et agréable.

Enfin en bas de page, avant le footer, nous pouvons aller plus loin dans ce que propose Wikimedia à travers un overflow de liens vers les sites liés.

Page d'article Flèche du bas

Reprenant les choix de la page d’accueil mais en réduisant la taille des typos, l'objectif principal de cette page est d'améliorer la lisibilité et l’accessibilité des informations clés, en rendant le contenu structuré et facile à parcourir. Étant donné que le site existe depuis longtemps et est consulté par de nombreux utilisateurs et contributeurs, j’ai voulu garder le fonctionnement global de la page article actuelle.

Sur la gauche, j’ai intégré un panneau fixe contenant les informations principales de l’article (résumé, catégories, liens connexes). Ce panneau suivra l’utilisateur lors du défilement, garantissant un accès permanent aux données essentielles.

Au sein de ce panneau, les images seront présentées sous forme de galerie défilante, avec une fonctionnalité de clic permettant de naviguer directement vers les sections associées. Cela améliore l’interaction visuelle tout en renforçant la navigation thématique.

Un élément de ce panneau présente les différentes parties de l’article, avec la possibilité de cliquer pour y accéder.

La barre de navigation supérieure sera identique à celle de la page d'accueil, offrant une continuité visuelle et fonctionnelle entre les deux types de pages. Cette barre intègrera :

  • la recherche,
  • le menu principal,
  • et les options de connexion,

tout en restant discrète pour ne pas perturber la lecture.

Choix UI

Couleurs, textures et typographie Flèche du bas

En termes d'interface utilisateur, le choix des couleurs s'est porté sur une palette douce et engageante pour créer une expérience visuelle agréable tout en mettant en avant les informations importantes :

  • Une nuance turquoise a été choisie pour capter subtilement l’attention tout en évoquant la sérénité et la modernité. Cette teinte guide l’utilisateur dans sa navigation sans être intrusive. Elle sera principalement utilisée pour les boutons et les hypertextes.
  • Des jaunes pâles et des roses délicats sont utilisés pour signaler des avertissements ou des informations secondaires dans la page article. Ces choix garantissent une hiérarchisation visuelle claire et une communication non agressive. Pour ces couleurs qui pointent vers une information importante, j’ai choisi d’ajouter un liseré plus saturé sur le côté gauche.

Le fond est blanc texturé, rappelant le papier ou la pierre, afin d’ancrer l’interface dans une esthétique qui évoque la matérialité du savoir et son aspect collaboratif. Cette texture légère ajoute une profondeur visuelle sans surcharger l’écran.

La typographie a été sélectionnée pour renforcer cet effet participatif et humain :

  • Une police manuscrite est utilisée pour les titres d’article, apportant une touche personnelle et chaleureuse qui incarne l’idée de contribution collective.
  • Les textes principaux conservent une police sans-serif classique, assurant une lisibilité optimale et un contraste clair avec les éléments décoratifs.

Ce mélange de couleurs, de textures et de typographies vise à renforcer la dimension participative et encyclopédique de Wikipédia tout en offrant une interface esthétique et fonctionnelle.

Voir le prototype
Voir le pdf
Un projet ? Une question ?
Contactez-moi