Rethinking UX
du service Medium

Page d'accueil du site Medium.com Page d'accueil du site medium.com

Un nouvel atelier commence : Rethinking UX (RUX). Nous devons, pour celui-ci, réaliser un exercice visant à repenser une fonctionnalité pour l’un des cinq services suivants :

Nous nous sommes vite mis d’accord et avons décidé de travailler sur Medium.

Pourquoi Medium ?

Chaque membre du groupe a fait des recherches sur un des différents services proposés. Après comparaison avec les autres plateformes, c’est sur Medium que nous avions le plus d’éléments à partager au niveau des fonctionnalités.

En outre, nous étions tous familiarisés avec ce service.

Medium, c'est quoi ?

C’est une plateforme permettant de lire et de rédiger des articles, de partager des idées, des connaissances, des histoires… mais aussi de suivre les auteurs ou de les bloquer. Le temps de lecture d’un article est affiché.

Néanmoins, il ne permet pas de réaliser des articles de groupe ni de communiquer directement avec les différents auteurs.

Toutes les fonctionnalités du service

  • création de comptes
  • lecture d’articles
  • rédaction d’articles
  • publication d’articles
  • publication de stories
  • abonnement aux auteurs
  • like
  • partage via Facebook et Twitter
  • statistiques de vues
  • recherche d’articles
  • connexion au service
  • surlignement d’articles
  • proposition d’articles
  • notifications
  • bookmarks
  • tags

Mon analyse

Lors de cet atelier, j’ai observé toutes les fonctionnalités de Medium. J’ai remarqué qu’il n’était pas simple de modifier ou de supprimer une annotation publique. J’ai donc choisi de travailler sur cette fonctionnalité. Avant de proposer des améliorations, afin de mieux comprendre le but des « notes », je les ai définies et testées.

Qu’est-ce que les « Notes » ?

Les « notes » sont une fonctionnalité qui permet d’annoter les articles. Il y a deux types de notes: les notes privées et les notes publiques.

Les notes privées sont partagées avec l’auteur de l’article et les notes publiques sont partagées avec tous les lecteurs. Ceux-ci peuvent alors y répondre, applaudir ou ajouter la note à leurs favoris.

Sur mobile, il est impossible d’annoter (en mode public ou privé). Medium ne présente aucune possibilité de commenter lorsqu’on sélectionne le texte ou sous l’article. Nous pouvons néanmoins voir les commentaires déposés par les autres utilisateurs.

Sur l’application mobile Médium, il est possible d’annoter en mode public en sélectionnant le texte. Un modal apparait et propose de surligner ou de répondre (il est aussi possible de partager, tweeter, etc.). L’utilisateur peut également laisser un commentaire en bas de la page. Il est ensuite possible de poster une note en réponse à celle d’un autre utilisateur.

Par contre, les notes privées n’existent pas dans l’application.

Comment voir les notes ?

Si j’annote en mode public une ligne du texte, les autres utilisateurs voient un astérisque à côté de la ligne que j’ai commentée. Je peux aussi choisir de commenter tout le texte. Dans les deux cas, toutes les notes apparaissent sous l’article.

Si un autre lecteur clique sur l’astérisque, la note s’affiche en plein écran ou apparait dans un modal. L’utilisateur peut y répondre, applaudir et ajouter la note à ses favoris.

Pour les rédacteurs d’articles, il existe aussi une page réservée pour lire les commentaires d’un article, les trier et y répondre. Cette page présente également quelques statistiques.

Image illustrant les atérisques de notes dans un article Medium
Astérisque indiquant une note sur la ligne
Exemple de notes affichées sous un article Medium
Exemple de note affichée sous un article Medium

Un système de notes privées est également prévu ; il suffit de sectionner du texte et un modal nous permet alors d’écrire une note. Dans ce cas, seuls nous et l’auteur pouvons les voir. L’auteur peut également y répondre. Celles-ci ne sont disponibles que sur la version desktop du site.

Quel est le problème ?

J’ai remarqué qu’il n’était pas simple de modifier ou de supprimer notre commentaire public une fois posté.

En effet, pour modifier son commentaire, nous devons nous rendre sur notre profil, naviguer dans l’onglet « Reponse », retrouver la note à modifier parmi la liste. Une fois que nous avons retrouvé notre commentaire, il nous faut cliquer sur le menu en bas à droite, choisir « Edit Story » et enfin choisir « Delete Story » dans le menu en haut à droite.

Il est également possible de modifier la note depuis la page « Stories », en allant dans l’onglet « Published ». Au même titre que les articles, elles seront classées par ordre chronologique.

Je trouve qu’il est compliqué de trouver les options relatives aux notes. J’aimerais donc modifier la fonctionnalité des notes.

Réflexion autour de la problématique

Afin de mieux rendre compte de la manœuvre à réaliser actuellement pour modifier sa note, voici une vidéo illustrant la création et la suppression d’une note.

Comment améliorer cela ?

Pour simplifier les manipulations relatives aux notes, je propose d’ajouter deux boutons, un bouton de réponse et un menu déroulant présentant différentes options.

D’abord, le bouton de réponse: il existe déjà sur Medium, mais pour y accéder, nous devons d’abord cliquer sur le commentaire en bas de page pour l’afficher sur une page en plein écran. Sur cette page, le bouton de réponse se trouve en bas à droite du commentaire. Lorsque nous cliquons sur ce dernier, le site nous descend en bas de page, où se trouve un champ de texte pour entrer notre réponse.

Cette disposition pose un autre problème, entre le commentaire et le champ de texte se trouve une liste de suggestions d’articles et une rapide présentation de l’utilisateur ayant posté le commentaire. Il n’est donc pas possible de relire le commentaire tout en écrivant. Nous sommes obligés d’utiliser le scroll.

Je propose donc d’ajouter le bouton de réponse dès la lecture du commentaire sous l’article. Un champ de texte peut alors s’ouvrir sous le commentaire pour pouvoir répondre sans changer de page. Ce système existe sur de nombreux sites célèbres tels que YouTube, Facebook, etc. Une autre solution est l’apparition d’un modal affichant le commentaire et un champ de texte pour y écrire notre réponse. Cette solution est, par exemple, utilisée sur Twitter. Il serait quand même possible de répondre en plein écran, l’interface est plus confortable pour la rédaction de longues réponses.

Système de commentaire sur Youtube, Facebook et Twitter

Ensuite, pour le menu déroulant, je propose d’y ajouter plusieurs options. En effet, le menu apparaissant dans les commentaires sous l’article ne comprend que l’option « Report story ».

Je pense qu’il serait intéressant de lui ajouter quelques options. Si nous sommes l’auteur du commentaire, les options « Delete story » et « Edit story » seraient intéressantes : elles permettraient à l’utilisateur de gagner du temps. Actuellement, il faut, au mieux, passer par 3 pages pour trouver cette option.

Les options « Hide reponses » et « Show reponses » existent aussi sur Medium, mais ne sont accessibles que lorsque nous nous rendons dans le menu d’un commentaire après l’avoir affiché en plein écran. J’aimerais également les ajouter aux commentaires affichés sous l’article.

Étude comparative

Nous avons, en groupe, réalisé une étude comparative de différents services semblables à Medium. Celle-ci nous a permis de comprendre les avantages et inconvénients de ces platformes. Nous avons ainsi pu trouver des pistes d'améliorations pour les fonctionnalités sur lesquelles nous avons choisi de travailler. Voici un tableau qui reprend les points qui me sont important pour repenser ma fonctionnalité.

Avantages Inconvénients
Behance Message direct à l'auteur
Gratuit
Plusieurs styles de publications
Ghost Permet de créer un site indépendant L'article doit être vu pour republier
Linkedin Gratuit
Communication entre membres
Plusieurs objectifs sur le sites
Impossible de commenter une partie de l'article
Reddit Gratuit Interface moins agréable
Publicité
Lire toute l'étude

Les membres du groupe

Pour ce projet, nous avons formé un groupe de quatres étudiants de DWM. Voici une courte présentation de chacun des membres.

Yassine Karim Allah, étudiant DWM à la Haute École Albert Jacquard Lucien Mary, étudiant DWM à la Haute École Albert Jacquard Maxime Fondu, étudiant DWM à la Haute École Albert Jacquard Fiona Miele, étudiant DWM à la Haute École Albert Jacquard

Yassine Karim Allah

J’ai 23 ans et suis élève en web design depuis cette année. J’ai eu une formation en graphisme en secondaire et je suis venu en web, car je pense que c’est essentiel à l’accomplissement de ma formation précédente. Ce que j’aime le plus dans cette option c’est designer les différents sites, de réfléchir à toutes les façons de faciliter la navigation. À terme j’espère m’améliorer sur cette voie, mais aussi en code, car cela reste important, car il faut pouvoir toucher à tout. Je me suis chargé de l’utilisation des claps (sorte de like) lorsque l’on aime un article.

Lucien Mary

J’ai 21 ans. Après avoir réalisé une qualification en infographie, je me suis dirigé vers la Haute École Albert Jacquard pour devenir DWM.

Maxime Fondu

Maxime Fondu - 19 ans, qualification en infographie, maintenant étudiant en développement web et mobile à la Haute École Albert Jacquard. Passionné par la photographie.

Fiona Miele

Je m’appelle Fiona Miele, j’ai 18 ans. Ayant été bercée dès mon plus jeune âge dans le domaine de l’art et de la musique, j’ai effectué des études au conservatoire régional de Charleroi, bien sûr, ma première passion restera toujours la musique. Je dois dire cependant qu’en découvrant le web cette année, je remarque que ça me plaît et que derrière son côté masculinisé, se cache une certaine forme d’art que j’explore aujourd’hui encore. Je l’avoue donc, malgré mon espoir de dire un jour que ma passion est le code, je me rends à l’évidence et je reconnais que l’étape que je préfère le plus dans la réalisation d’un site web est celle du design.