Speed Demo Archive - Redesign

313 vues

Publié le

Publié dans : Design
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
313
Sur SlideShare
0
Issues des intégrations
0
Intégrations
104
Actions
Partages
0
Téléchargements
2
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Speed Demo Archive - Redesign

  1. 1. IHM Anthony Dumas 1 Speed Demo Archive Dossier de redesign 1 – Etude de l’existant : Speed Demo Archive (http://speeddemosarchive.com/) est un site web historique de la communauté des speed runners, comprenez des gens qui finissent des jeux video le plus rapidement possible. Ce site est aujourd’hui une référence dans la communauté des speed runners. Ce que nous devons nous demander, c’est si ce site est une référence pour sa praticité et son utilité ou pour son caractère historique. Petit retour en arrière, Speed Demo Archive est né en 1998, après la fusion de deux sites aillant pour sujet le speed-run du jeu Quake. Il a ensuite été alimenté avec le temps par des
  2. 2. IHM Anthony Dumas 2 speed-run d’autres jeux populaires. A ce jour, 955 jeux sont présent dans la base de données de SDA. On doit bien reconnaitre que le design, à défaut d’être d’une beauté flamboyante, est assez pratique dans un premier temps. Le fil d’information au centre nous tiens informé des actualités du site et les différents liens nous permettent de facilement accéder aux informations dont nous avons besoin. Cependant, tout cela devient moins pratique quand on s’intéresse à la page de recherche du site web. (http://speeddemosarchive.com/gamelist.html) On notera tout d’abord que, aux vues des options données pour la recherche, on peut penser que cela est suffisant pour permettre une recherche rapide et fluide. Actuellement, ce n’est pas aussi pratique que cela. Pour rechercher, par exemple, les speedruns de la série de jeu Zelda, vous aurez plusieurs choix :  Soit passer par le sélecteur de système, indiquer « All » puis faire une recherche par ordre alphabétique. Les jeux ici sont plus ou moins rangés par série, donc vous trouverez facilement tous les jeux qui ont été speed-runés dans cette série. Cependant, vous devrez aller tout au fond de la liste et chercher par vous-même car il n’existe pas d’indexation par alphabétique comme on en trouve sur différents site.
  3. 3. IHM Anthony Dumas 3 Figure 1 - Exemple d'indexation alphabétique  Soit passer par la recherche Google, qui va rechercher l’information que vous recherchez sur l’intégralité du site et non seulement sur la liste des jeux. Cela nous donne un résultat lourd à charger et illogique, vu que nous sommes sur la page Game List et que nous cherchons donc un jeu dans la base de données de SDA. Enfin, penchons-nous sur les pages des jeux eux-mêmes. Prenons par exemple la page d’un jeu comme Mass Effect.
  4. 4. IHM Anthony Dumas 4 Le site reste sur la même charte graphique, du noir, du blanc et des images. Nous avons la bannière du site, une description rapide du jeu, quelques images et, le plus intéressant, les caractéristiques des différentes runs réalisées sur ce jeu. Nous avons les conditions d’execution, le temps d’execution, le nom du runner et la date. Tout cela est rapidement accessible et pratique, dans le sens que nous avons un rapide résumé des informations concernant les runs de ce jeu. Regardons maintenant la partie réservée aux runs individuellement, qui se trouvent sur la même page.
  5. 5. IHM Anthony Dumas 5 On retrouve le titre de la run, le player vidéo (nous y reviendrons) et le texte de la « submission », qui est une explication de la run par la personne qui l’exécute. Il y a plusieurs choses à dire :  Tout d’abord, le titre de la run est placé sans rien de bien extraordinaire, on pourrait s’attendre, vu que c’est un titre, a un texte en gras ou souligné, mais rien de cela. Si il y a plusieurs runs sur la même page, cela fait légèrement brouillon.  Ensuite, le player vidéo, lui, se retrouve être dans un placement un peu étrange. Il est collé sur la droite, ce qui est contraire a la logique de beaucoup de sites de vidéo, où le player est au centre.  Enfin, ce player est d’une taille quasiment ridicule, obligeant de le passer en full screen pour voir ne serait-ce que les textes à l’écran. Un placement au milieu de la page et une plus grande taille serait réellement agréable pour vraiment profiter des vidéos du site.
  6. 6. IHM Anthony Dumas 6 En résumé, Speed Demo Archive est une référence, non pas pour son design pratique, mais bien pour sa base de donnée impressionnante pour la communauté et pour son caractère historique comme étant le premier site à s’intéresser au domaine. Tout ce dont il a besoin, c’est d’un design plus clair. 2 – Redesign Mockup agrémenté de quelques notes. Nous devons tout d’abord supprimer le fond noir, qui n’est pas attirant aux premiers abords. Ensuite, nous devons créer un véritable menu et non une liste horizontale de lien hypertexte. Enfin, nous pouvons ajouter quelques images dans les news pour les rendre plus attirantes a lire. Voici le mockup du résultat pour la homepage.
  7. 7. IHM Anthony Dumas 7 Le choix du bleu comme fond est contestable, ceci est simplement une préférence personnelle. Le menu, autrefois en lien hypertexte, a été remplacé par un menu d’icônes que l’on retrouvera sur d’autres pages, permettant de garder une cohérence entre les différentes pages. On peut maintenant se pencher sur la page de recherche de site, une autre des pages importantes du site. Comme montré précédemment, elle se compose simplement d’un menu déroulant, de quelques boutons radios et d’une recherche Google sur l’intégralité du site.
  8. 8. IHM Anthony Dumas 8 On y aura ajouté plusieurs liens hypertextes permettant de faire des recherches par lettre et une recherche uniquement centrée sur les jeux de la liste, permettant un accès beaucoup plus rapides aux titres que l’on veut voir. On garde toujours le menu pour accéder aux autres parties du site et le logo du site pour revenir à l’accueil. La liste des jeux a elle aussi été revisitée, pour permettre, premièrement, une navigation plus agréable, mais aussi de permettre de faire la différentiation facilement entre les versions US, Japonaises et Européenne. On pourra ajouter au besoin sous le titre d’autres mentions comme les temps des runs, les noms des participants, la date de parution sur SDA, etc.
  9. 9. IHM Anthony Dumas 9 Ici, nous avons rajouté une jaquette pour le jeu et un titre en gros pour chaque run. Aussi, nous avons rajouté un player plus grand, qu’il faudra ajuster selon la résolution de la vidéo, de plus nous gardons la cohérence du design avec le menu.
  10. 10. IHM Anthony Dumas 10 3 – Conclusion Avec ce nouveau design, nous pensons qu’il est plus simple d’accéder aux informations que nous voulons, c’est-à-dire pour la majorité des utilisateurs du site, les vidéos des runs. Maintenant, pour y accéder, nous avons plusieurs possibilités, en choisissant le système, en donnant directement le nom du jeu ou en choisissant simplement la première lettre du jeu. Le plus gros changement a été fait sur la liste des jeux, en rendant plus agréable la navigation et le choix de ce que nous allons regarder. Cela peut être amélioré encore avec un petit panneau incluant vignettes du jeu et description quand on passe la souris par-dessus les jaquettes. En résumé, ce design semble faciliter la recherche et l’accès aux informations les plus importantes de Speed Demo Archive, les vidéos. Note : Le site étant modifié pendant le marathon (du 5 au 11 Janvier 2014), pour accèder aux pages du site, il vous faudra aller sur le lien suivant (http://speeddemosarchive.com/gamelist.html), cependant la page d’accueil n’est pas disponible.

×