-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
238 lines (200 loc) · 16.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Home - Dmitry Popovichev</title>
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/reset.css">
<link rel="stylesheet" href="css/website.css">
<script src="js/main.js" defer></script>
</head>
<body>
<div class="header-container" style="flex-direction: column;">
<div class="inner-header">
<div class="logo-container">
<img style="width: 200px;" src="img/Logo.png" alt="">
</div>
<ul class="navigation">
<a href="https://d-games.github.io/Website-Project/"><li>Home</li></a>
<a href="https://d-games.github.io/Project-Gallery/"><li>Project Gallery</li></a>
<a href="https://d-games.github.io/Movie-Data/"><li>Movie Data</li></a>
<a href="https://d-games.github.io/hobbypage/"><li>Hobby Page</li></a>
<a href="contant.html"><li>Contact</li></a>
</ul>
</div>
</div>
<div class="quoteContainer">
<div class="centered">
<p>"Failure is success in progress"</p><br><div class="autor"><p>Albert Einstein</p></div>
</div>
</div>
<div class="smallSpacer"></div>
<section class="rightAlign">
<div class="portrait"></div>
<article class="introText"><h1 style="font-size: 42px;">I'm Dmitry, I have been working as a games developer in my spare time at home but am now looking for a new career opportunities.</h1><br><p>I've spent the past 3 years working on developing small indie games with a small team in my time outside of work. You can take a look at some of the projects I have worked on by going to the Project Gallery tab at the top of this page.
<br><br>
I currently work at Veeva Systems where I work as a Technical Analyst, helping new clients get familiar with our database features and helping existing clients by solving problems they may face using our applications such as techincal support using our software, quarterly releases, bug resolution etc.
<br><br>
Outside of my job and game development (which you can find more about on my Hobby Page), I enjoy gaming, hiking with my partner when the weather permits, and meeting up with friends and family.
</p></article>
</section>
<div class="spacer"></div>
<section class="leftAlign">
<figure role="img" class="universityImage">
<div><figcaption><a href="https://www.freepik.com/free-vector/student-flat-concept-with-young-men-graduation-scene-with-university-campus-background-vector-illustration_39927320.htm#query=university%20illustration&position=6&from_view=keyword&track=ais">Image by macrovector</a> on Freepik</figcaption></div>
</figure>
<article class="universityText"><h1 style="font-size: 42px;">I started most of my journey at university, or at least the part that lead me to where I am today.</h1><br><p>I started my degree in BA Illustration in 2015 after finishing my A-levels first, followed by an art foundation year. Speaking truthfully, I failed my first year at uni mainly due to the lack of trying, it was a bit of a kick in the teeth but looking back at it, it was what I needed to get myself into gear.
<br><br>
After completing the first year (a second time) I came to realise that my style was more suited to Graphic Design and took a year out to prepare my portofilio to switch degrees. I was accepted straight into the second year of Graphic Design after showcasing a strong line of work and self-learning, all while working a 9-5. It was during these years that I started to mature a little and realise there was more to life than parties and festivals (a favourite activity of mine at the time) and put my head down and prove to myself more than anything, that if I put my mind to it, I can achieve great things.
</p></article>
</section>
<div class="spacer"></div>
<section class="leftAlign">
<article class="universityText"><h1 style="font-size: 42px;">My love for tech started to grow, starting with some of the projects I was able to do during my time at university.</h1><br><p>I came out of university starting at the bottom and coming out top of the class with one of the more "out-there" projects. Next Level Schools was my final year project, a showcase of a learning experience in Virtual Reality for students studying STEM subjects at GCSE level, in particular Chemistry.
<br><br>
Without going to much further into that topic, I mainly wanted focus on my strong interest in VR that was devloped while researching and executing that project. The more I learnt, the more I wanted to step into this industry and explore the possiblities of WEB3.0, or as some people may call it, the MetaVerse.
</p>
</article>
<figure class="nextLevelImage">
<figcaption></figcaption>
</figure>
</section>
<div class="smallSpacer"></div>
<div class="quoteContainer">
<div class="centered">
<p>"The progress"</p></div>
</div>
</div>
<div class="smallSpacer"></div>
<section class="rightAlign">
<figure class="successImage"></figure>
<article class="universityText"><h1 style="font-size: 42px;">Even if my application to this course is unsuccesful, I will find what I have learnt and projects I have completed to be a success in itself.</h1><br><p>The weeks/months I have spent working on these projects have been great fun, I started off with no knowledge in HTML, CSS or JavaScript and have come out with four projects that hopefully demonstrate my progression throughout the application progress.
<br><br>
I can use what I have learnt to create my own website which can be sent to potential employers to showcase my github projects with example code, and I will be able to add to my CV that I have a basic understanding of these three languages.
<br><br>
It feels like I have only scratched the surface of what can be made in HTML, so it would be wise of me to continue practicing what I have learnt and buidling upon the foundation of these four projects, adding to my collection of public projects on GitHub.
</p>
</article>
</section>
<div class="spacer"></div>
<section class="leftAlign">
<figure class="polishImage"></figure>
<article class="universityText"><h1 style="font-size: 42px;">As I write this bit about me and the progress of the projects, I wonder whether I should polish the first projects before the deadline to meet the same standards of the latest ones.</h1><br><p>I took the first month to learn what I could about HTML, CSS, JavaScript, Git and Github while executing the first project, the Hobby Page. During this time I was heavily experimenting with what can be done in HTML and CSS, while trying to adhere to common practice techniques. Once I completed the project, I set it aside and planned out my timeline of would be the next 14 weeks, splitting each project into 3.5 week deadlines. I quickly executed the next 3 projects within the first 4 weeks and was left with 10 weeks to complete the game and add potential polish to the previous ones.
<br><br>
While I want everything to look it's best, it's interesting to see a comparison of where I started compared to what I am able to do now. Below I have added two images, the image on the left is the "before" screenshot of what the Hobby Page looks like, mainly focusing on the layout of the top of the page and elements such as the Header, overlaying text, image placement and colour choice. On the right is an "after" image of the Gallery Project which also focuses on the same elements for a direct comparison.
</p>
</article>
</section>
<div class="smallSpacer"></div>
<div class="beforeAfter">
<div class="before"><img src="img/HobbyPageScreenshot.PNG" alt=""><p style="color: black; text-align: center; font-size: 26px; padding-top: 9px;">Before | Hobby Page</p></div>
<div class="after"><img src="img/ProjectGalleryScreenshot.PNG" alt=""><p style="color: black; text-align: center; font-size: 26px; padding-top: 9px;">After | Gallery Page</p></div>
</div>
<div class="smallSpacer"></div>
<section class="rightAlign">
<figure class="universityImage">
<img src="img/3094293.jpg" alt="Illustration a computer screen with code on it and small human">
<figcaption><a href="https://www.freepik.com/free-vector/javascript-frameworks-concept-illustration_6184436.htm#query=javascript&position=37&from_view=keyword&track=sph">Image by storyset</a> on Freepik</figcaption>
</figure>
<article class="universityText"><h1 style="font-size: 42px;">I found learning JavaScript the trickiest part of the experience but probably the most useful.</h1><br><p>Learning how to handle data storage and add functionality to the frontend via JavaScript was probably the most satisfying aspect of these projects. While it took me a little longer to wrap my head around some of the concepts such as jQuery and localStorage, once I had a basic understanding I was able to problem solve a little easier with the help of StackOverflow and other online resources. I am still trying to understand the intricisies of Javscript and find it difficult to think of where to start in some cases when it comes to programming features, but I believe that as with many things, given a bit of time and practice I will be able to think of these solutions quicker.
</p>
</article>
</section>
<div class="spacer"></div>
<div style="width: 93%; height: auto; font-size: 26px;"><h1>Click the title of any of the projects to visit the GitHub Pages link or click the link below to go to the GitHub Repo!</h1></div>
<div class="projectContainer">
<div class="projectCard">
<img src="img/Tips-For-an-Indie-Game-Developer.png" alt="Illustration of computer parts, lines and game developemnt">
<button class="titleDiv"><a style="font-size: 22px;" href="https://d-games.github.io/hobbypage/" target="_blank">Hobby Project</a></button>
</div>
<div class="projectCard">
<img src="img/galleryIllustration.jpg" alt="Illustration of computer parts, lines and game developemnt">
<button class="titleDiv"><a style="font-size: 22px;" href="https://d-games.github.io/Project-Gallery/" target="_blank">Project Gallery</a></button>
</div>
<div class="projectCard">
<img src="img/movie data img.jpg" alt="Illustration of computer parts, lines and game developemnt">
<button class="titleDiv"><a style="font-size: 22px;" href="https://d-games.github.io/Movie-Data/" target="_blank">Movie Data</a></button>
</div>
<div class="projectCard">
<img src="img/My Head-shot B&W.png" alt="Illustration of computer parts, lines and game developemnt">
<button class="titleDiv"><a style="font-size: 22px;" href="https://d-games.github.io/Website-Project/" target="_blank">About Me</a></button>
</div>
<div class="projectCard">
<img src="img/Ag1_09.jpg" alt="Illustration of computer parts, lines and game developemnt">
<button class="titleDiv"><a style="font-size: 22px;" href="#" target="_blank">Game Project</a></button>
</div>
</div>
<div class="githubContainer">
<div class="outerContainer">
<div class="innerContainer"><a style="color: rgb(6,69,173); font-weight: bold;" href="https://github.com/D-Games/hobbypage.git" target="_blank">Hobby Page | Repository</a></div>
</div>
<div class="outerContainer">
<div class="innerContainer"><a style="color: rgb(6,69,173); font-weight: bold;" href="https://github.com/D-Games/Project-Gallery.git" target="_blank">Project Gallery | Repository</a></div>
</div>
<div class="outerContainer">
<div class="innerContainer"><a style="color: rgb(6,69,173); font-weight: bold;" href="https://github.com/D-Games/Movie-Data.git" target="_blank">Movie Data | Repository</a></div>
</div>
<div class="outerContainer">
<div class="innerContainer"><a style="color: rgb(6,69,173); font-weight: bold;" href="https://github.com/D-Games/Website-Project.git" target="_blank">About Me | Repository</a></div>
</div>
<div class="outerContainer">
<div class="innerContainer"><a style="color: rgb(6,69,173); font-weight: bold;" href="#" target="_blank">Game | Repository</a></div>
</div>
</div>
<div class="spacer"></div>
<div class="quoteContainer">
<div class="centered">
<p>"Why I'm applying"</p></div>
</div>
</div>
<div class="smallSpacer"></div>
<section class="leftAlign">
<figure class="workingImage"></figure>
<article class="universityText"><h1 style="font-size: 42px;">After an attempt at game development, I found myself lacking some fundamental skills while also discovering that I enjoy coding more than I thought.</h1><br><p>I currently find myself in a job (Veeva Systems) that has little to no progression, mainly because it is a US based company, while also not fufilling my natural drive due to the lack of volume in work and mundane daily tasks. I love working around tech and while it has not been all bad by all means at this job, I am looking to progress my career in the tech industry and add some much needed skills to my repertoire. I still have a natural want to create and build things and after doing the research I found that software development is the perfect career path to work towards.
<br><br>
As a final note, as mentioned in the title above, I recently discovered my interest in programming via my hobby and took a few months prior to this application to think about where I want to be in the next few years. This lead me to deciding to follow a career in software development which required me to learn some new skills. That led me to find this course as a great starting point.
</p>
</article>
</section>
<div class="smallSpacer"></div>
<button class="contactMe" onclick="openContactForm()">Contact Me</button>
<div class="smallSpacer"></div>
<div class="backUpContainer">
<div class="backUpBox" id="backToTopBtn" onclick="backToTheTop()"><img src="/img/Arrow up.png" alt="3 chevrons pointing up">Back To The Top</div>
</div>
<div class="contactFormContainer" id="contactFormContainer">
<div class="contactFormBox">
<form>
<h3>GET IN TOUCH</h3>
<br>
<div>
<input type="text" id="fullName" name="fullName" placeholder="John Smith" style="width: 400px;">
</div>
<div>
<input type="email" id="email" name="email" placeholder="john.smith@email.com" style="width: 400px;">
</div>
<div>
<input type="phone" id="phone" name="phone" placeholder="07123456789" style="width: 400px;">
</div>
<div>
<textarea name="message" id="message" cols="43" rows="5" placeholder="Write your message here"></textarea>
</div>
<button type="submit">Send</button>
</form>
</div>
</div>
<div class="smallSpacer"></div>
<footer class="footer">
<div class="social-container">
<a class="github-icon" href="https://github.com/D-Games" target="_blank"></a>
<a class="linkedin-icon" href="https://www.linkedin.com/in/dmitry-popovichev/" target="_blank"></a>
<a class="artstation-icon" href="https://dmitryp6.artstation.com/" target="_blank"></a>
<a class="facebook-icon" href="https://www.facebook.com/gaming/DarkSchematics" target="_blank"></a>
<a class="instagram-icon" href="https://www.instagram.com/darkschematic/" target="_blank"></a>
<a class="twitter-icon" href="https://twitter.com/DarkSchematics" target="_blank"></a>
</div>
</footer>
</body>
</html>