VGM Entertainment

Développement web - Projet personnel

Design, intégration et développement HTML, CSS et JS d’un site répertoire de trames sonores de jeux vidéo

Voir le site
VGM Entertainment

Qu’est ce que VGM Entertainment ?

VGM Entertainment est conçue comme un répertoire de trames sonores de jeux vidéo pour donner un accès plus rapide à l’écoute et à la recherche d’une bande sonore en particulier.

Logiciels utilisés

Langages utilisés

Utilisation de l’IA

Aucune IA générative n’a été utilisée pour réaliser ce projet ni pour préparer sa fiche.

section cartes

La sélection de trame sonore

Étapes:

Étape 1

1 — Recherche d’inspiration et de comparables sur Google pour le site

Je recherche des comparables et des inspirations pour que ma recherche soit enrichie pour le processus de création du guide de style et de la maquette du site.

Étape 2

2 — Sélection de palette de couleur et de choix typographique sur Figma

Je poursuis la création de mon site en choisissant une palette de couleur impeccable et en choisissant deux excellentes typographies qui seront utilisées dans mes maquettes.

Étape 3

3 — Création des maquettes du site et organisation des sections dans Figma

J'ai conçu la maquette avec 3 différentes pages contenant différentes sections pour mon site web: la page d’accueil, la page des jeux vidéos et la page des artistes.

Étape 4

4 — Intégration HTML et développement CSS du site d’archive avec VS Code

Suite à la maquette, je conçois avec du code HTML et CSS les pages du site tout en gardant une bonne organisation des sections et des classes que j’utilise pour le css.

Étape 5

5 — Programmation JS et ajustement responsive du site sur VS Code

Suite au CSS de base pour mon site, j’ai programmé des composantes et ajusté le responsive de mon site pour que ça fonctionne sur mobile.

Étape 6

6 - Résultat final de VGM Entertainment via le navigateur au choix

Maintenant que c’est tout finalisé, je peux explorer mon site sur un navigateur pour voir les trames des jeux vidéo et les artistes qui ont réalisé ces chef-d'oeuvres.

Crédits:

  • Félix Lapointe : DA, design web et intégration/développement web
  • Images utilisées : Pexels et autres médias
  • Trames sonores utilisées :
    • 1. Assassin’s Creed II
    • 2. Minecraft
    • 3. Pokémon Legends: Arceus
    • 4. The Elder Scrolls V: Skyrim
    • 5. Undertale
    • 6. Assassin’s Creed IV: Black Flag
    • 7. Persona 5
    • 8. Legend of Zelda: Breath of the wild
    • 9. Doom Eternal
    • 10. Super Mario Galaxy 2