-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
271 lines (208 loc) · 11.2 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
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
<!DOCTYPE html>
<html lang="fr">
<head>
<meta name="">
<meta charset="utf-8">
<title>Portfolio E. mastrantuono</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="style.css">
<link rel="icon" href="">
</head>
<body>
<header id="top">
<div class="photoheader"><img src="images/MASTRANTUONO_Evan.jpg" alt="photo"></div>
<nav>
<a href="#" onclick="smoothScroll('#présentation')">Présentation</a>
<a href="#" onclick="smoothScroll('#projets')">Créations / Réalisations</a>
<a href="#" onclick="smoothScroll('#compétences')">Compétences</a>
</nav>
</header>
<section class="spawn" id="fixedText">
<h1>Bonjour, je m'appelle Evan Mastrantuono</h1>
<div class="spawncontent">
Passionné par la technologie et l'informatique, j'aime apprendre et découvrir continuellement de nouvelles choses dans l'univers du multimédia et du numérique.<br />
Voici donc un portfolio que j'ai réalisé moi-même de A à Z et qui m'a permis d'en apprendre plus sur le design et le développement web.<br />
Le code source est entièrement disponible sur la repository <a href="https://github.com/xnaveman/portfolio-parcoursup" target="_blank">Github</a>
</div>
</section>
<section class="bgspawn">
<video autoplay muted loop id="myVideo">
<source src="images/videobg.mp4" type="video/mp4">
Votre navigateur ne prend pas en charge la vidéo HTML5.
</video>
</section>
<section class="présentation" id="présentation">
<h1>Présentation</h1>
<div class="présentation-container">
<div class="columnswrapper">
<div class="column">
<div class="presentationtitle">Lycéen</div>
<div class="presentationcontent">
Je suis actuellement en terminale, filière technologique STI2D spécialité SIN
et je souhaite me diriger ensuite vers des études dans le multimédia / numérique / développement.
J'ai eu l'occasion d'approfondir et revoir les bases du développement web notamment lors de mon année de terminale. Pendant celle-ci, nous auront réalisé plusieurs pages
Web, à l'occasion d'exercices ou afin de remplir les exigences d'un projet.
</div>
</div>
<div class="column">
<div class="presentationtitle">Passionné</div>
<div class="presentationcontent">
Je suis passionné d'informatique et de jeux vidéo depuis bientôt 10 ans.
J'ai commencé par découvrir les premières bases de l'informatique et l'algorithmique avec <i>Scratch</i>, des modèles <i>Arduino</i> préfaits, etc... Aujourd'hui,
je crée des sites web, des jeux vidéos et des applications.
Mon souhait est de pouvoir intégrer le BUT MMI afin de me former principalement au développement et à la création web,
mais aussi dans le but de découvrir et approfondir les nombreux autres domaines liés aux métiers du multimédia et de l'internet.
</div>
</div>
</div>
</div>
</section>
<section class="projets" id="projets">
<h1>Créations / Réalisations</h1>
<div class="cardcontainer">
<div class="card">
<div class="cardtitle">
<b>Site web - Classe de SIN</b>
</div>
<div class="cardcontent">
Un site web réalisé à l'occasion d'un projet en classe de SIN, dans le cadre d'une découverte & approfondissement des connaissances de base en HTML et CSS.<br />
Il a été réalisé en une semaine. <br /> <a href="https://github.com/xnaveman/page-web-sin" target="_blank">Repository Github du projet</a>
<img src="images/sitesin.png" alt="Image d'exemple site" width="80%">
</div>
</div>
<div class="card">
<div class="cardtitle">
<b>Jeu vidéo 2D (prototype) - Projet personnel</b>
</div>
<div class="cardcontent">
Afin de découvrir l'environnement du logiciel <i>Unity</i> je me suis lancé pour objectif de créer un jeu vidéo en 2D au tour par tour.
En utilisant la fonctionnalité de scripting visuel de <i>Unity</i>, j'ai pu réaliser la maquette du jeu.<br />
Je souhaite désormais terminer ce projet en le convertissant en <b>C#</b> afin de mieux connaître ce langage et gagner en flexibilité pour mes futurs projets 2D comme 3D.<br />
<img src="images/game.png" alt="image d'exemple du jeu" width="80%">
</div>
</div>
<div class="card">
<div class="cardtitle">
<b>Participation à la création d'un wiki - Projet communautaire</b>
</div>
<div class="cardcontent">
Dans le but d'apprendre le fonctionnement de <i>Git & Github</i> dans le cadre de la création d'un wiki communautaire pour un serveur Minecraft, j'ai pu participer à son élaboration
et ainsi découvrir les notions de base de Git & Github <br />
(pull requests, merging, branches, repositories...)<br />
Voici le lien de la <a href="https://github.com/HisteriaMC/histeria-wiki" target="_blank">repository sur Github</a> ainsi que <a href="https://histeria.fr/wiki" target="_blank">le site qui y est lié</a>
<img src="images/wiki.png" alt="image d'exemple du wiki" width="80%">
<img src="images/wikisite.png" alt="image d'exemple du wiki" width="80%">
</div>
</div>
<div class="card">
<div class="cardtitle">
<b>Portfolio - Projet d'avenir</b>
</div>
<div class="cardcontent">
J'ai réalisé ce portfolio afin de soutenir ma candidature Parcoursup et montrer ma motivation ainsi que mes compétences.
Pendant son développement, j'ai appris de nombreuses choses, surmonté des difficultés tout au long de sa création.
Cela m'a permis de gagner en assurance sur mes capacités à mener à bien un projet comme celui-ci.<br />
Vous pouvez retrouver la repository Github du projet <a href="https://github.com/xnaveman/portfolio-parcoursup" target="_blank">ici</a>
<img src="images/portfolio.png" alt="image d'exemple du portfolio" width="80%">
</div>
</div>
</div>
</section>
<section class="compétences" id="compétences">
<h1>Compétences</h1>
<div class="orbcontainer">
<div class="orb">
<img src="images/css-3.png" alt="css-3.png">
<div class="orbtext">
Niveau : Débutant<br />
<b>Temps passé : ~100h</b>
</div>
</div>
<div class="orb">
<img src="images/js.png" alt="js.png">
<div class="orbtext">
Niveau : Découverte<br />
<b>Temps passé : ~50h</b>
</div>
</div>
<div class="orb">
<img src="images/html-5.png" alt="html-5.png">
<div class="orbtext">
Niveau : Moyen<br />
<b>Temps passé : ~150h</b>
</div>
</div>
<div class="orb">
<img src="images/unity.png" alt="unity.png">
<div class="orbtext">
Bonne connaissance globale du logiciel et de son fonctionnement (Travail sur Unity 2D)<br />
<b>Temps passé : ~80h</b>
</div>
</div>
<div class="orb">
<img src="images/vscode-logo.png" alt="vscode.png">
<div class="orbtext">
Bonne maitrise du logiciel et des extensions, liaison git etc.<br />
<b>Temps passé : ~400h</b>
</div>
</div>
<div class="orb">
<img src="images/blender-logo.png" alt="blender-logo.png">
<div class="orbtext">
Niveau : Découverte<br />
<b>Temps passé : ~10h</b>
</div>
</div>
<div class="orb">
<img src="images/c++-logo.png" alt="c++-logo.png">
<div class="orbtext">
Niveau : Débutant<br />
<b>Temps passé : ~20h</b>
</div>
</div>
<div class="orb">
<img src="images/python.png" alt="python-logo.png">
<div class="orbtext">
Connaissances de base<br />
<b>Temps passé : ~20h</b>
</div>
</div>
<div class="orb">
<img src="images/united-kingdom.png" alt="english-logo.png">
<div class="orbtext">
Très bon anglais écrit et oral<br />
<b>Niveau C1+</b>
</div>
</div>
<div class="orb">
<div class="othersoftwares">
<u><b>D'autres logiciels utilisés</b> :</u><br />
<ul>
<li>Davinci resolve</li>
<li>Git & Github</li>
<li>phpStorm</li>
<li>Eclipse IDE</li>
</ul>
</div>
</div>
</div>
</section>
<footer class="contactme">
<h1>Me contacter / Liens</h1>
<div class="links">
<a href="mailto:[email protected]">
<img src="images/mailto.png">
</a>
<a href="https://github.com/xnaveman" target="_blank">
<img src="images/github.png">
</a>
<a href="#" onclick="smoothScroll('#top')">
<img src="images/top.png">
</a>
</div>
<div id="wcb" class="carbonbadge"></div>
<script src="https://unpkg.com/[email protected]/b.min.js" defer></script>
</footer>
<script src="script.js"></script>
</body>
</html>