Double KO est un projet d’école lors de ma 2ème année en Bachelor Chef de Projet Digital à la NWS. On avait pour but de trouver une association et réaliser les besoins selon sa spécialité. Dans la spécialité webdesign on devait :
- Formaliser un design system (la charte ergonomique et la charte graphique)
- Créer un site et/ou une landing page (page de destination) conforme au design system
- Créer une vidéo et/ou une animation conforme au design system
Double KO est une association régie par la loi 1901 à but non lucratif fondée en 2012, proposant comme activité des rassemblements autour du jeu vidéo de combat. Elle n’a pas de salarié et elle est normande. Pierre est le président de l’association. Elle organise des sessions de jeu sur un rythme bimensuel avec des organisations de tournoi et un accès libre aux jeux vidéos dans une ambiance à la fois conviviale et compétitive.
Pour le design system, je l’ai réalisé avec Adobe XD qui est un outil de conception d’expérience utilisateur pour les applications web et mobile. Donc je l’ai fait sous forme de page web où on retrouve l’accueil qui résume l’association, le logotype avec ses différentes déclinaisons, les composants où on retrouve les logos des partenaires/soutiens de l’association, les pictos et les logos des réseaux sociaux présent sur le site internet.
Ensuite le grid layout c’est les mises en page en divisant l’espace d’affichage. Puis les typographies où on retrouve les typo du site et du logo qui sont utilisés. Et enfin les couleurs où on retrouve les couleurs du logo et du site avec leur code en hexadécimal, CMJN et RVB.
Pour le site internet, j’ai du repartir à 0, enfaite l’association avait déjà un site WordPress à la base, mais Pierre a eu un problème avec le site du coup il était HS depuis un long moment.
Donc j’ai créer le site en partant d’un thème qu’on a choisi et en s’inspirant d’un site de tournoi jeux vidéo. On a mis le site DKO en maintenance pour les travaux en attendant la création du nouveau site.
Donc j’ai commencé par faire l’accueil du site en reprenant le même style que le modèle, ensuite j’ai fais la suite du site qui défile, avec les textes, les animations les images et bien d’autre en gérant les colonnes et les sections.
Lien du site internet : https://www.doubleko.fr
Pour la vidéo, j’ai commencé par faire une vidéo d’animation du logo que j’ai réalisé avec le logiciel After Effect. On retrouve notamment l’effet “Saber” c’est l’effet lumineux qui entoure le logo après je l’ai transformé en calque 3D et appliqué un flou de mouvement ensuite j’ai joué avec l’échelle, la rotation, la position et j’ai rajouté des bruits sonores.
Ensuite j’ai fais une vidéo de présentation de l’association que j’ai réalisé avec le logiciel Première Pro, j’ai commencé par prendre des plans avec mon appareil photo et ensuite je l’ai monté de façon simple avec du texte, les couleurs, la police conforme au design system.
J’ai fait aussi des overlays qui seront utilisés pour des prochains lives sur Twitch.
J’ai fait une affiche de base qui servira pour annoncer les prochaines sessions de jeu.
Et aussi une carte de visite pour Pierre qui présente l’association.
