Killian Mahut

Contexte du projet

Création complète du site internet de l'association ADéR.M (Association pour le Développement Rural au Maroc). Projet réalisé en binôme sur 6 semaines, en étroite collaboration avec les membres de l'association afin de définir leurs besoins, leur identité et leur communication digitale.

Objectifs

• Donner de la visibilité à l'association
• Présenter clairement ses actions et ses missions
• Faciliter la collecte de dons via HelloAsso
• Concevoir une identité web moderne, accessible et cohérente

Mon rôle

• Conception UX : définition des personas, wireframes et zoning
• Création des maquettes UI sur Figma
• Développement complet du site sous WordPress avec Elementor
• Intégration du module de dons HelloAsso
• Mise en ligne et configuration de l’hébergement (o2Switch)

Technologies utilisées

Fonctionnalités principales

• Design moderne et responsive adapté à tous les supports
• Organisation claire des rubriques et navigation intuitive
• Intégration des dons en ligne
• Page de présentation de l'association et de ses actions
• Galerie de projets et d'événements

Contexte du projet

Développement d'une application desktop en Python pour l'entreprise Leader Light Event. Spécialisée dans les prestations événementielles pour entreprise, collectivité locale, … Leur demande était: avoir une solution simple et intuitive pour répondre au problème suivant: pvr afficher les scores des participants le temps d'une prestation pour créer de la cohésion. Ces scores sont obtenus lors d'un affrontement entre participants sur un mur interactif loué par l'entreprise. L'outil sert à récupérer, gérer et afficher les scores provenant du mur interactif. Le logiciel est désormais utilisé lors de divers événements.

Objectifs

• Offrir une interface simple et personnalisable pour afficher les scores en direct
• Proposer une mise en scène visuelle adaptée aux besoins des événements
• Permettre l'import et l'export des données pour faciliter leur gestion et leur réutilisation

Fonctionnement de l'application

L'application comporte deux fenêtres :

• Fenêtre de personnalisation

  Permet de modifier les éléments visuels : couleurs, polices, logo, images, mise en page… afin d'adapter l'affichage à chaque événement.

• Fenêtre d'affichage

  Présente le rendu final destiné au mur interactif, avec :

  • Un podium des 3 meilleurs joueurs
  • Un tableau statique
  • Un tableau défilant selon le nombre de participants

L'application peut importer des données existantes (fichier de scores) et exporter les résultats au format Excel pour archivage ou partage avec les clients.

Mon rôle

• Conception complète de l'interface graphique
• Développement en Python/Tkinter
• Gestion de la récupération, mise à jour et affichage des scores
• Intégration de l'import/export des données
• Ajout de la personnalisation visuelle pour les besoins événementiels
• Création d'un exécutable (.exe) pour une utilisation fluide

Technologies utilisées

Fonctionnalités principales

• Personnalisation visuelle complète (couleurs, polices, logos, images)
• Import et export des données en Excel
• Affichage du podium
• Tableaux statique et défilant
• Mise à jour des scores en temps réel
• Application finale en .exe pour une utilisation rapide et pratique

Contexte du projet

Réalisé durant mon année de Terminale, ce projet consiste en une adaptation numérique du célèbre jeu Puissance 4. L'objectif était de transposer les règles du jeu de société en une logique algorithmique robuste, tout en développant une interface utilisateur interactive avec Pygame.

Caractéristiques du projet

• Mode 2 joueurs local : Gestion fluide de l'alternance des tours entre les jetons rouges et jaunes.
• Interface UX/UI : Menu principal interactif, prévisualisation du jeton au survol des colonnes et retour visuel en temps réel.
• Logique de jeu complète : Système de chute des jetons dans la case la plus basse disponible et gestion automatique des matchs nuls.

Focus Technique

Le cœur du projet repose sur la manipulation d'une matrice de données (6x7) représentant la grille. Le défi principal a été l'implémentation de la détection de victoire :

• Algorithme récursif : Pour chaque jeton posé, le programme explore les 8 directions (horizontale, verticale, diagonales) pour compter les alignements.
• Optimisation : L'utilisation de vecteurs de direction permet de valider une victoire en un minimum de lignes de code, garantissant une réponse instantanée.

Technologies utilisées

Contexte du projet

My Mooviz est une plateforme web immersive dédiée aux passionnés de cinéma. L'objectif était de créer un outil complet permettant non seulement de consulter les dernières sorties, mais aussi d'explorer le cinéma mondial de manière géographique grâce à une interface cartographique innovante.

Caractéristiques du projet

• Exploration Géographique : Intégration d'une carte interactive (Leaflet) permettant de filtrer les films par pays d'origine.
• Contenu Dynamique : Consommation de l'API TMDB pour afficher en temps réel les actualités, les sorties à venir et les bandes-annonces.
• Gestion de Wishlist : Système complet de sauvegarde locale permettant aux utilisateurs de créer leur propre liste de films à voir sans compte utilisateur.
• Expérience Fluide : Carrousels interactifs, recherche instantanée et design "Mobile First" avec une navigation optimisée pour smartphone.

Focus Technique

Le projet repose sur une architecture JavaScript modulaire et une gestion rigoureuse des données asynchrones :

• Interactions API : Utilisation de fetch et async/await pour récupérer et traiter des données complexes (synopsis, notes, vidéos YouTube).
• Persistance des données : Exploitation du localStorage pour assurer la persistance de la liste de l'utilisateur entre les sessions.
• Performance : Utilisation de DocumentFragment pour optimiser le rendu du DOM lors de l'affichage de listes massives de films.
• Interface Responsive : Design moderne utilisant Flexbox, Grid et les variables CSS pour une maintenance simplifiée.

Technologies utilisées