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

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.

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.

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.

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.

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.

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.

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.

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.

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.