-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
145 lines (121 loc) · 8.37 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<!DOCTYPE html>
<html>
<title>Antoine Gaulin</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
body, h1,h2,h3,h4,h5,h6 {font-family: "Montserrat", sans-serif}
.w3-row-padding img {margin-bottom: 12px}
.bgimg {
background-position: center;
background-repeat: no-repeat;
background-size: cover;
background-image: url('./g71a709ee5.jpg');
min-height: 100%;
}
</style>
<body>
<!-- Sidebar with image -->
<nav class="w3-sidebar w3-hide-medium w3-hide-small" style="width:40%">
<div class="bgimg"></div>
</nav>
<!-- Hidden Sidebar (reveals when clicked on menu icon)-->
<nav class="w3-sidebar w3-black w3-animate-right w3-xxlarge" style="display:none;padding-top:150px;right:0;z-index:2" id="mySidebar">
<a href="javascript:void(0)" onclick="closeNav()" class="w3-button w3-black w3-xxxlarge w3-display-topright" style="padding:0 12px;">
<i class="fa fa-remove"></i>
</a>
<div class="w3-bar-block w3-center">
<a href="#" class="w3-bar-item w3-button w3-text-grey w3-hover-black" onclick="closeNav()">Accueil</a>
<a href="#portfolio" class="w3-bar-item w3-button w3-text-grey w3-hover-black" onclick="closeNav()">Portfolio</a>
<a href="#about" class="w3-bar-item w3-button w3-text-grey w3-hover-black" onclick="closeNav()">À propos</a>
<a href="#contact" class="w3-bar-item w3-button w3-text-grey w3-hover-black" onclick="closeNav()">Contact</a>
</div>
</nav>
<!-- Page Content -->
<div class="w3-main w3-padding-large" style="margin-left:40%">
<!-- Menu icon to open sidebar -->
<span class="w3-button w3-top w3-white w3-xxlarge w3-text-grey w3-hover-text-black" style="width:auto;right:0;" onclick="openNav()"><i class="fa fa-bars"></i></span>
<!-- Header -->
<header class="w3-container w3-center" style="padding:128px 16px" id="home">
<h1 class="w3-jumbo"><b>Antoine Gaulin</b></h1>
<p>Programmeur</p>
<a href="./AntoineGaulin.pdf"><button class="w3-button w3-light-grey w3-padding-large w3-margin-top">
<i class="fa fa-download"></i>Télécharger mon CV
</button></a>
</header>
<!-- Portfolio Section -->
<div class="w3-padding-32 w3-content" id="portfolio">
<h2 class="w3-text-grey">Mon Portfolio</h2>
<hr class="w3-opacity">
<!-- Grid for photos -->
<div class="w3-row-padding" style="margin:0 -16px">
<h3 class="w3-padding-24">Photo parfaite</h3>
<p>Ce projet a été réalisé dans le cadre du Concours universitaire Ubisoft 2020. Le mandat était de produire un prototype multijoueur en LAN respectant le thème « génération » dans un délai de 3 mois. Pour ce faire, nous avons utilisé l'Unreal Engine. Ce fût l'opportunité d'expérimenter les rôles de programmeur jouabilité, animation, interface utilisateur et réseau dans une équipe diversifiée provenant de 3 écoles différentes.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/9-Fl4NRe2JU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<h3 class="w3-padding-24">Entre-Deux</h3>
<p>Ce projet a été réalisé dans le cadre du cours Conception de jeux vidéo. Le mandat était de produire un jeu de plateforme 2,5D d'une dizaine de minutes à l'aide du logiciel Unity dans un délai de 3 mois. J'ai eu l'occasion de vendre une idée de jeu originale à mes coéquipiers et de travailler sur la jouabilité et la conception sonore de celui-ci.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/y4CQ_T4Srzk" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<h3 class="w3-padding-24">Course de Camaro</h3>
<p>Ce jeu a été réalisé dans le cadre du projet de logiciel d'application web. Le mandat était de produire un jeu de course sur mesure à l'aide de WebGL. Cette opportunité m'a permis de concevoir un outil de création de circuits interactifs et de programmer le système de jouabilité, de collisions et la scène 3D.</p>
<iframe width="560" height="315" src="https://www.youtube.com/embed/MZ0XWOv6PZo" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
<!-- End photo grid -->
</div>
<!-- End Portfolio Section -->
</div>
<!-- About Section -->
<div class="w3-content w3-justify w3-text-grey w3-padding-32" id="about">
<h2>À propos</h2>
<hr class="w3-opacity">
<p>À la fin de mes études à Polytechnique Montréal en génie informatique, je me suis orienté vers le multimédia. De ce fait, j'ai acquis des connaissances en conception, architecture et en agents intelligents appliqués aux jeux vidéo. J'ai l'ambition de partager mes connaissances des nouvelles technologies à l'industrie afin de faire exploser l'univers du possible.</p>
<div class="w3-row w3-center w3-dark-grey w3-padding-16 w3-section">
<div class="w3-quarter w3-section">
<span class="w3-xlarge">3</span><br>
Projets réalisés
</div>
<div class="w3-quarter w3-section">
<span class="w3-xlarge">4</span><br>
Cours spécialisés réussi
</div>
</div>
<a href="./AntoineGaulin.pdf"><button class="w3-button w3-light-grey w3-padding-large w3-section">
<i class="fa fa-download"></i> Télécharger mon CV
</button></a>
<!-- Testimonials -->
<h3 class="w3-padding-24">Ma réputation</h3>
<p><span class="w3-large w3-text-black w3-margin-right">Natalie Morcos</span> Level Artist</p>
<p>I worked with Antoine as part of the Ubisoft Game Lab competition. Our team consisted of three different universities collaborating to create a game within 10 weeks. Communication and flexibility were very important for the project to succeed. From my experience, Antoine is a hard-working teammate, has excellent communication and takes a lot of initiative. He loves his work and is very motivated. During the project life, he took ownership of different tasks and stepped in to help the team when we had questions or concerns. He was always on point, and it was a pleasure working with him.</p><br>
<p><span class="w3-large w3-text-black w3-margin-right">Olivier Gendreau</span> Maître d'enseignement en génie logiciel</p>
<p>J'ai enseigné à Antoine dans le cours de Conception de jeux vidéo et je l'ai supervisé dans le cadre de son projet intégrateur final, au sein duquel il a développé dans une équipe multidisciplinaire un excellent jeu vidéo pour la compétition Universitaire Ubisoft 2020. Ce que j'ai le plus apprécié d'Antoine sont ses compétences techniques, son implication et sa pensée latérale, particulièrement efficaces dans une équipe multidisciplinaire. J'ai beaucoup apprécié superviser Antoine.</p><br>
<!-- End About Section -->
</div>
<!-- Contact Section -->
<div class="w3-padding-32 w3-content w3-text-grey" id="contact" style="margin-bottom:64px">
<h2>Contactez-moi</h2>
<hr class="w3-opacity">
<div class="w3-section">
<p><i class="fa fa-map-marker fa-fw w3-xxlarge w3-margin-right"></i>Laval, Canada</p>
<p><i class="fa fa-phone fa-fw w3-xxlarge w3-margin-right"></i>(514) 705-6699</p>
<p><i class="fa fa-envelope fa-fw w3-xxlarge w3-margin-right"> </i>[email protected]</p><br>
</div>
<!-- Footer -->
<footer class="w3-container w3-padding-64 w3-light-grey w3-center w3-opacity w3-xlarge" style="margin:-24px">
<a href="https://www.facebook.com/antoine.gaulin"><i class="fa fa-facebook-official w3-hover-opacity"></i></a>
<a href="https://www.linkedin.com/in/antoinegaulin"><i class="fa fa-linkedin w3-hover-opacity"></i></a>
<!-- End footer -->
<!-- END PAGE CONTENT -->
</div>
<script>
// Open and close sidebar
function openNav() {
document.getElementById("mySidebar").style.width = "60%";
document.getElementById("mySidebar").style.display = "block";
}
function closeNav() {
document.getElementById("mySidebar").style.display = "none";
}
</script>
</body>
</html>