|
|
<!DOCTYPE html>
|
|
|
<html lang="fr">
|
|
|
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
<title>Projets - Etienne Veau</title>
|
|
|
<link rel="stylesheet" href="style.css">
|
|
|
</head>
|
|
|
|
|
|
<body>
|
|
|
<nav>
|
|
|
<ul>
|
|
|
<li><a href="index.html">À propos</a></li>
|
|
|
<li><a href="cursus.html">Cursus</a></li>
|
|
|
<li><a href="competences.html">Compétences/Qualités</a></li>
|
|
|
<li><a href="projets.html">Projets</a></li>
|
|
|
<li><a href="exppro.html">Expériences professionnelles</a></li>
|
|
|
<li><a href="cv.html">Mon CV</a></li>
|
|
|
<li><a href="contact.html">Me Contacter</a></li>
|
|
|
</ul>
|
|
|
<button class="hamburger">☰</button>
|
|
|
</nav>
|
|
|
|
|
|
<div class="container">
|
|
|
<h2>Mes projets</h2>
|
|
|
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Exploitation d'une Base de Données – Projet OCTAVE</h3>
|
|
|
<p><b>Contexte :</b> Projet réalisé en trinôme à l'IUT.</p>
|
|
|
<p><b>Objectifs du projet :</b> Concevoir une étude de marché pour le lancement d'une plateforme fictive
|
|
|
de streaming musical, en s'appuyant sur plusieurs jeux de données publics (issus de Kaggle).</p>
|
|
|
<p><b>Travail réalisé :</b> Nous avons choisi trois jeux de données portant sur les habitudes d'écoute
|
|
|
de musique en ligne, les ventes par format et l'accès à Internet dans le monde. Après validation
|
|
|
auprès de l'enseignant, nous avons conçu un modèle relationnel (MCD/MLD), puis créé un script Python
|
|
|
pour construire et remplir notre base PostgreSQL. Nous avons également nettoyé les données
|
|
|
(suppression des doublons, renommage, jointures) et produit des visualisations pertinentes
|
|
|
(graphiques, heatmaps, histogrammes) afin d'extraire des tendances utiles à la stratégie de
|
|
|
lancement d’OCTAVE.</p>
|
|
|
<p><b>Résultats du projet :</b> Ce projet m’a permis de développer des compétences concrètes en
|
|
|
traitement de données massives, en modélisation relationnelle, en automatisation via
|
|
|
Python/SQLAlchemy et en dataviz avec Matplotlib. Il m’a aussi sensibilisé à l’importance d’adapter
|
|
|
une stratégie commerciale aux spécificités régionales (connexion internet, genre musical, âge, type
|
|
|
d’abonnement).</p>
|
|
|
<p><b>Document :</b> <button onclick="window.open('rapport.pdf')">Voir le document</button></p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Développement d'un jeu de société - Qawale</h3>
|
|
|
<p><b>Contexte :</b> Projet personnel de développement d'application mobile cross-platform.</p>
|
|
|
<p><b>Objectifs du projet :</b> Recréer le jeu de société Qawale en version numérique en utilisant .NET
|
|
|
MAUI et C#,
|
|
|
permettant de jouer sur différentes plateformes (iOS, Android, Windows).</p>
|
|
|
<p><b>Travail réalisé :</b> J'ai développé une application complète incluant :
|
|
|
<ul>
|
|
|
<li>Une interface utilisateur intuitive et responsive</li>
|
|
|
<li>Un mode deux joueurs local</li>
|
|
|
<li>Un système de validation des coups selon les règles officielles</li>
|
|
|
<li>Une intelligence artificielle pour jouer contre l'ordinateur</li>
|
|
|
<li>Un système de sauvegarde des parties</li>
|
|
|
</ul>
|
|
|
</p>
|
|
|
<p><b>Technologies utilisées :</b>
|
|
|
<ul>
|
|
|
<li>.NET MAUI pour le développement cross-platform</li>
|
|
|
<li>C# pour la logique du jeu</li>
|
|
|
<li>XAML pour l'interface utilisateur</li>
|
|
|
</ul>
|
|
|
</p>
|
|
|
<p><b>Résultats du projet :</b> Ce projet m'a permis d'approfondir mes compétences en développement
|
|
|
avec .NET MAUI, en programmation orientée objet avec C#, et en conception d'interfaces utilisateur.
|
|
|
J'ai également acquis de l'expérience dans la gestion de la logique de jeu complexe et dans
|
|
|
l'implémentation d'IA basiques.</p>
|
|
|
<p><b>Code source :</b> <a
|
|
|
href="https://codefirst.iut.uca.fr/git/clement.sellier/SAE_1A_G4_LEJUEZ_VEAU_TARDY_SELLIER.git"
|
|
|
target="_blank" class="btn">Voir le dépôt Git</a></p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Création d’un Portfolio Web</h3>
|
|
|
<p><b>Contexte :</b> Projet réalisé seul à l'IUT, visant à présenter nos
|
|
|
compétences techniques sous forme de site web personnel.</p>
|
|
|
<p><b>Objectifs du projet :</b> Développer un portfolio web en utilisant HTML, CSS et PHP, permettant de
|
|
|
valoriser mes projets, mon parcours et mes compétences, tout en respectant les bonnes pratiques du
|
|
|
développement web.</p>
|
|
|
<p><b>Travail réalisé :</b> J’ai conçu une interface responsive en HTML/CSS, intégrant plusieurs
|
|
|
sections (présentation,cursus,contact). En complément, je me suis autoformé
|
|
|
les bases de Java afin d’ajouter un fond d’écran animé et interactif, apportant une touche dynamique
|
|
|
à l’interface.</p>
|
|
|
<p><b>Résultats du projet :</b> Ce projet m’a permis d’approfondir mes compétences en développement web
|
|
|
(HTML/CSS/PHP), d’améliorer ma capacité à mener un projet seul de bout en bout, et de découvrir les
|
|
|
bases de la programmation en Java. Il m’a également sensibilisé à l’importance de l’UX/UI et à la
|
|
|
cohérence graphique dans un site vitrine. j'ai obtenu la note de 16/20 pour mon travail la moyenne
|
|
|
pour ma promo est de 14/20 </p>
|
|
|
<p><b>Site :</b> <a href="./mon-vrai-tpweb/mon-portfolio.html" target="_blank" class="btn">Voir le
|
|
|
portfolio</a></p>
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<!-- Projet 1 -->
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Création d'une Base de Données (SQL)</h3>
|
|
|
<p><b>Contexte :</b> Projet d'étude en trinôme à l'IUT.</p>
|
|
|
<p><b>Objectifs du projet :</b> Concevoir de A à Z une base de données correspondant à une entreprise de
|
|
|
location.</p>
|
|
|
<p><b>Travail réalisé :</b> Nous avons choisi de créer une entreprise louant des Jet-ski et avons mis en
|
|
|
place un MCD/MLD avant de concevoir le script SQL permettant de créer et remplir notre base de
|
|
|
données avec un jeu d'essais.</p>
|
|
|
<p><b>Résultats du projet :</b> Ce projet m'a appris à appliquer concrètement mes connaissances SQL, le
|
|
|
respect des 3 formes normales, la mise en place de vérifications automatiques des données pour
|
|
|
assurer la robustesse de la base, ainsi que la création de jeux de données et de requêtes tests pour
|
|
|
vérifier son bon fonctionnement. Dans ce projet, la partie sur la création de l'entreprise m'a
|
|
|
sensibilisé aux démarches RSE et m'a permis d'imaginer différentes facettes du fonctionnement d'une
|
|
|
PME.</p>
|
|
|
<p><b>Document :</b> <button onclick="window.open('jetsky.pdf')">Voir le document</button></p>
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- Projet 2 -->
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Administration d'un système Linux</h3>
|
|
|
<p><b>Contexte :</b> Projet d'étude individuel à l'IUT.</p>
|
|
|
<p><b>Objectifs du projet :</b> Installer sur une machine vierge une distribution Debian, la configurer
|
|
|
en installant des paquets et des systèmes, partitionner des disques, et mettre en place des
|
|
|
Backports et l'utilisation de FlatPak.</p>
|
|
|
<p><b>Travail réalisé :</b> Ce projet m'a permis de m'exercer en autonomie à la recherche d'informations
|
|
|
sur internet afin de comprendre et réaliser les tâches demandées. Je me suis également grandement
|
|
|
familiarisé avec l'utilisation du terminal et ses lignes de commandes. Enfin, cela m'a permis d'en
|
|
|
apprendre plus sur le fonctionnement d'un espace disque et d'un système d'exploitation.</p>
|
|
|
<p><b>Résultats du projet :</b> J'ai réussi à installer une distribution Debian, à la configurer avec
|
|
|
les paquets demandés, à partitionner les disques et à mettre en place les Backports ainsi que
|
|
|
FlatPak. J'ai également appris à utiliser le terminal de manière efficace, ce qui m'a permis de
|
|
|
gagner en autonomie dans la gestion de systèmes Linux.</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- Projet 3 -->
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Gestion des stages de l'I.U.T</h3>
|
|
|
<p><b>Contexte :</b> Projet d'étude en binôme à l'IUT.</p>
|
|
|
<p><b>Objectifs du projet :</b> Concevoir un algorithme capable de traiter les demandes de stage de
|
|
|
l'IUT.</p>
|
|
|
<p><b>Travail réalisé :</b> Le programme devait pouvoir gérer l'espace "Responsable", capable d'affecter
|
|
|
un étudiant à un stage sur lequel il aurait préalablement candidaté. Il y avait également un espace
|
|
|
de saisie des notes ainsi que la possibilité de procéder à l'ajout de nouvelles offres de stage.
|
|
|
L'espace "Étudiant" permettait à l'étudiant de consulter les stages disponibles ainsi que d'y
|
|
|
candidater.</p>
|
|
|
<p><b>Résultats du projet :</b> Ce projet m'a permis de me familiariser avec le langage C et m'a appris
|
|
|
à gérer des tableaux de manière efficace (Chargement, Recherche, Tri, Affichage). Cela m'a également
|
|
|
permis d'utiliser différents types de fichiers afin d'effectuer des sauvegardes.</p>
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- Projet 4 -->
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Création d'un jeu type tour par tour</h3>
|
|
|
<p><b>Contexte :</b> Projet d'étude en binôme à l'IUT.</p>
|
|
|
<p><b>Objectifs du projet :</b> Concevoir un jeu de combat tour par tour entre un chevalier et des
|
|
|
monstres, basé sur le principe de Pierre-Feuille-Ciseaux.</p>
|
|
|
<p><b>Travail réalisé :</b> Le cahier des charges étant très complet, j'ai dû apporter un soin
|
|
|
particulier au respect de l'utilisation des différentes structures (Pile, File, Liste). Ce projet a
|
|
|
renforcé ma compréhension des structures de données et m'a introduit à la notion de complexité et à
|
|
|
l'utilisation de fichiers binaires pour effectuer des sauvegardes.</p>
|
|
|
<p><b>Sujet du projet :</b> <button onclick="window.open('sujet.pdf')">Voir le document</button>
|
|
|
</p>
|
|
|
</div>
|
|
|
</div>
|
|
|
<h2>Mes projets personnels</h2>
|
|
|
<!-- Projet 5 -->
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Conception d'une réplique de jeu vidéo</h3>
|
|
|
<p><b>Contexte :</b> Projet personnel depuis janvier 2025.</p>
|
|
|
<p><b>Objectifs du projet :</b> Reproduire le jeu "Crossy Road" avec Unity et concevoir un algorithme
|
|
|
imbattable en C#.</p>
|
|
|
<p><b>Travail réalisé :</b> Ce projet consiste à reproduire fidèlement le jeu, puis à créer un
|
|
|
algorithme en C# capable d'interagir avec le jeu afin qu'il soit imbattable. Une fois le programme
|
|
|
fonctionnel, je souhaite entraîner une IA capable de battre le jeu et comparer les deux solutions
|
|
|
pour analyser celle qui obtient le meilleur score.</p>
|
|
|
<p><b>Résultats du projet :</b> Ce projet me permettra de m'autoformer sur Unity et C#, de travailler
|
|
|
sur
|
|
|
un projet complexe, et sera une bonne introduction aux notions d'IA et de robotique.</p>
|
|
|
|
|
|
<div class="video-container">
|
|
|
<div class="video-wrapper" id="videoWrapper">
|
|
|
<video src="CrossyRoad.mp4" autoplay loop muted playsinline class="embedded-video">
|
|
|
</video>
|
|
|
</div>
|
|
|
</div>
|
|
|
<p><b>Vidéo d'inspiration :</b> <a href="https://www.youtube.com/watch?v=71UbDN4csas" target="_blank"
|
|
|
class="btn video-btn">Voir sur YouTube</a></p>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- Projet 2048 -->
|
|
|
<div class="projets-grid">
|
|
|
<div class="card projet">
|
|
|
<h3>Développement du jeu 2048</h3>
|
|
|
<p><b>Contexte :</b> Projet personnel réalisé pour approfondir mes compétences en développement web.</p>
|
|
|
<p><b>Objectifs du projet :</b> Recréer le célèbre jeu 2048 en utilisant HTML, CSS et JavaScript, tout
|
|
|
en
|
|
|
développant une interface utilisateur moderne et responsive.</p>
|
|
|
<p><b>Travail réalisé :</b> J'ai développé une version complète du jeu 2048 en intégrant plusieurs
|
|
|
fonctionnalités :
|
|
|
<ul>
|
|
|
<li>Un système de score en temps réel</li>
|
|
|
<li>Des animations fluides pour les déplacements et fusions</li>
|
|
|
<li>Une grille 4x4 réactive aux touches directionnelles</li>
|
|
|
<li>Un bouton de nouvelle partie</li>
|
|
|
</ul>
|
|
|
</p>
|
|
|
<p><b>Résultats du projet :</b> Ce projet m'a permis de renforcer mes compétences en JavaScript,
|
|
|
notamment
|
|
|
dans la manipulation de tableaux 2D, la gestion des événements clavier, et la création d'animations
|
|
|
CSS.
|
|
|
J'ai également approfondi en gestion de
|
|
|
la
|
|
|
logique de jeu.</p>
|
|
|
<p><b>Jouer :</b> <a href="2048.html" class="btn game-btn">Jouer à 2048</a></p>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<script>
|
|
|
const hamburger = document.querySelector('.hamburger');
|
|
|
const navMenu = document.querySelector('nav ul');
|
|
|
|
|
|
hamburger.addEventListener('click', () => {
|
|
|
navMenu.classList.toggle('active');
|
|
|
hamburger.setAttribute('aria-expanded', navMenu.classList.contains('active'));
|
|
|
});
|
|
|
|
|
|
document.querySelectorAll('nav a').forEach(link => {
|
|
|
link.addEventListener('click', () => {
|
|
|
navMenu.classList.remove('active');
|
|
|
hamburger.setAttribute('aria-expanded', 'false');
|
|
|
});
|
|
|
});
|
|
|
|
|
|
// Gestion de la vidéo
|
|
|
const videoWrapper = document.getElementById('videoWrapper');
|
|
|
const video = videoWrapper.querySelector('video');
|
|
|
let isExpanded = false;
|
|
|
|
|
|
videoWrapper.addEventListener('click', () => {
|
|
|
isExpanded = !isExpanded;
|
|
|
if (isExpanded) {
|
|
|
videoWrapper.classList.add('expanded');
|
|
|
video.muted = false;
|
|
|
video.controls = true;
|
|
|
} else {
|
|
|
videoWrapper.classList.remove('expanded');
|
|
|
video.muted = true;
|
|
|
video.controls = false;
|
|
|
}
|
|
|
});
|
|
|
|
|
|
// Fermer la vidéo avec la touche Escape
|
|
|
document.addEventListener('keydown', (e) => {
|
|
|
if (e.key === 'Escape' && isExpanded) {
|
|
|
videoWrapper.click();
|
|
|
}
|
|
|
});
|
|
|
</script>
|
|
|
</body>
|
|
|
|
|
|
</html> |
