Le Brief du projet
Maxime et Laure m’ont contacté fin juin 2017 pour la refonte du site Obivwak. Obivwak est une course d’orientation (en fait plusieurs en une seule) qui se déroule annuellement en Rhône-Alpes. Le lieu de l’événement change également chaque année, ce qui en fait une course sans cesse en renouvellement/
J’ignore si c’est vraiment suite à la refonte de l’échappée belle (Trail sur le massif de Belledonne) que Maxime et Laure m’ont contacté, mais je pense que cela a sûrement peser dans la décision. J’ai replongé avec plaisir dans l’univers des courses et des trails, avec cette fois-ci un accent beaucoup plus « orientation »
Le site originel était en Joomla! (Joomla! prend un ! ; je ne signifie pas un mouvement d’humeur). Il était également non responsive ce qui limitait son accessibilité, et la présentation des courses s’éparpillait sur de nombreuses pages peu loquaces. Sa refonte grâce à un outil comme WordPress a également permis de ré-envisager toute la structure de la home et des pages intérieures en retrouvant une possibilité d’éditer le contenu (que le site originel n’offrait plus), et de donner une information plus dense et mieux organisée.
Clients
Obivwak
Course orientation en Rhône-Alpes
Ancienne page d’accueil
Ancienne présentation d’un trail
La mise en page et la réalisation technique
Déploiement de la charte graphique
Ré-envisager le site est également une occasion de refondre et/ou créer des codes graphiques pour le site. Au fur et à mesure de son déroulement, et surtout en considérant les impératifs de présentation des courses, ce projet s’est avéré plus graphique qu’il n’y paraissait.
Choix des couleurs
Autour de la nuance principale verte déjà existante, un camaïeu monochromatique a été imaginé pour habiller de grandes surfaces et un choix de gris a été pensé pour mettre en valeur certains éléments plus secondaires. J’ai imaginé également plusieurs nuances complémentaires connexes pour accompagner la signalétique propre à chaque course ou Trail.
Icônes pour les trails
Ce point n’éxistait pas du tout dans le précédent site. Des blocs couleurs qui reprennent la forme caractéristique du O du logo ont été pensés et été mis en avant dans la page trails et courses. Toutes les règles CSS ont été harmonisées pour faire apparaître ce choix dans chaque trail (fond de couleur au dessous des textes).
Bannière
Plusieurs bannières ont été créées dans la mouvance de celles qui existaient déjà. Elles habillent toutes les pages, sidebar et signature email.
Fonte de paragraphe et fonte de titrage
Pour faciliter la lecture d’un site à grand trafic à certains moments de l’année, j’ai choisi une fonte de labeur simple et pourtant identifiable. La fonte de titrage a été également repensée.
Entêtes
Pour conférer un caractère fort, impactant et reconnaissable, toutes les pages ont été pensées avec une entête en transparence composée d’une image et habillée à sa base par une frise originale que j’ai crée, laquelle reprend le message fort de la course : La nature, la montage et la course à pied.
Laisser un commentaire
Rejoindre la discussion?N’hésitez pas à contribuer !