-
Notifications
You must be signed in to change notification settings - Fork 0
/
portfolioGame.html
235 lines (200 loc) · 15.2 KB
/
portfolioGame.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
<!doctype html>
<html lang="en">
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-BHLT7ML3PG"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', process.env.GOOGLE_MEASUREMENT_ID);
</script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script>document.getElementsByTagName("html")[0].className += " js";</script>
<link rel="stylesheet" href="css/style_game.css">
<title>Games</title>
</head>
<body>
<header class="cd-main-header text-center flex flex-column flex-center">
<h1>My Personal Timeline in Game Development</h1>
<br>
<div class="container">
<p class="margin-top-sm">Yellow button = games created in game Jam / Competition.
</p>
<p class="margin-top-sm">Red button = No games just video.
</p>
<p class="margin-top-sm">Green button = Unfinished or just template.
</p>
<p class="margin-top-sm">for maximum experience, youcan visit my <a href="https://mhr-171.itch.io/">itch io page</a>.
</p>
</div>
</header>
<section class="cd-timeline js-cd-timeline">
<div class="container max-width-lg cd-timeline__container">
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--picture">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Witchone IO</h2>
<p class="color-contrast-medium">From a simple <a href="https://www.reddit.com/r/INAT/comments/qudu6t/revshare_hobby_project_our_team_is_looking_for_a/">Reddit post</a>, i joined an awesome Team from several people from multiple Countries (German, US, Brazil, and Korea). The project is well managed. Since its an Online Game, we split our job into joblets. </p>
<p class="color-contrast-medium">I was responsible for <a href="https://www.photonengine.com/pun">PUN</a> enhancement, and WebGL build. The reason is, we want to show this off to several people before we launch it. However, since the code is too long and several parts are conflicted (because we are using <a href="https://www.fmod.com/unity">FMOD</a>). So I re-arrange the legacy code and make sure that there are no versioning issue again, because WebGL and FMOD has their own music library. That's where the conflict was.</p>
<p class="color-contrast-medium">After all, this is a long-term project and still under development. And I hope I can keep contributing until we release this game.</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">NOVEMBER 2021</span>
<a href="https://witchone.io/" class="btn btn--subtle">Witchone.io</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--movie">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Kimbab Jib</h2>
<p class="color-contrast-medium">Its been a while since I develop my latest Game. I Got this idea when I randomly choose Game Jam from <a href="https://itch.io/jams">Itch.io</a> page. I like to play Story rich games. However I haven't made one yet. Thats why I decide to Start creating it. Since I still have the My previous 2D templates, I am planning to used it. I used <a href="https://yarnspinner.dev/">Yarn Spinner</a> for unity to support the story-driven experience. It is conveninet since Yarn Spinner is also support player's decision making in the middle of the story. Currently it is still in development right now. Since I live in Seoul, I want to make a story which taken Place in Seoul, This is the sneak peak of the first chapter that I have made.</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">SEPTEMBER 2021</span>
<a href="https://drive.google.com/file/d/1xQvoh0lwMJaLQ_1djQ7LcRANKbJcdlkB/view?usp=sharing" class="btn btn--subtle">Watch Video</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--location">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Energyvore</h2>
<p class="color-contrast-medium">After a long recess, I decided to make a comeback by joining the <a href="https://itch.io/jam/gmtk-2021">GMTK 2021 Game jam</a>. I teamed up with 4 French and 1 American dudes. Between 48 hour we managed to finish our games. I am responsible for the "Rope/Leash" feature. If you right click the player, it will glow and able to fetch the enemy. It is awesome because our teams are well prepared 1 week before the jam start. Sadly, because limited time for testing, this is only available on Windows</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">JUNE 2021</span>
<a href="https://itch.io/jam/gmtk-2021/rate/1086139" class="btn btn--subtle">PLAY!!!</a>
<a href="https://drive.google.com/file/d/1fjNJkpFFc4xObBtpwByuIiwzizmEUAQs/view?usp=sharing" class="btn btn--subtle">Watch Demo</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--movie">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Hello AR</h2>
<p class="color-contrast-medium">Its almost end of my Master Degree. Since I have background in Unity VR, I want to apply several VR Game Studios. One of them are based on Seoul, Korea. I still remember last time I develop Unity AR using Vuforia Engine in 2019. And we have to prepare a solid marker to make it appeared in user's device. Recently, <a href="https://unity.com/unity/features/arfoundation">AR Foundation</a> existed. This Company want me to test my ability about it. So here are several videos about it</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">OCTOBER 2020</span>
<a href="https://drive.google.com/file/d/1EHhd-U8GaAXWcQIAV6YcXqrgBrU9sYfH/view?usp=sharing" class="btn btn--subtle">In 1 Floor</a>
<a href="https://drive.google.com/file/d/1foy3ORk8_Ss9JLN2HjfyNqdB8XORzXDq/view?usp=sharing" class="btn btn--subtle">In 2 Floors</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--movie">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Sandwich!!!</h2>
<p class="color-contrast-medium">This time, I am creating a "Casual Game". TL;DR; Simple game that does not require any knowledge. I got an idea to use <a href="https://play.google.com/store/apps/details?id=com.popcore.makesandwich&hl=en&gl=US">Sandwich!</a> just for exploration. The game is simply about how to make a sandwich by swiping the phone's screen. However, since I am busy with my Thesis defense, so i discard the animation. I was thinking to use <a href="https://docs.unity3d.com/Packages/[email protected]/manual/module-tweens.html">Tweens Module</a> From unity. Maybe I'll work on it later.</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">December 2020</span>
<a href="https://drive.google.com/file/d/173qhxVV5hl0xdWA01q8L31FiRcgRs5j9/view?usp=sharing" class="btn btn--subtle">Watch Video</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--location">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Go Back Bullet</h2>
<p class="color-contrast-medium">The previous team seems busy. We already plan to create new games, but no follow up though. Since my workload is not heavy enough, i tried to join <a href="https://itch.io/jam/brackeys-4">Brackeys Game jam 2020.2</a> instead as a solo developer <a href="https://mhr-171.itch.io/gobackbullet">alone</a>. At the beginning, i am team up with Syrian boy (AG45 as seen on discord). He said that he is 18 Year's old, young enough right. But in the middle of game developing, he admit that he is bossy and don't want me to keep ask him anymore. So, i finish this game by myself including the assets too. This is the first time for me to create full functional game mostly by myself. Even there is only one level.</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">JULY 2020</span>
<a href="/GoBackBullet/index.html" class="btn btn--subtle">PLAY!!!</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--location">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Out of Control Driver</h2>
<p class="color-contrast-medium">After i dig reddit, this is the first time we collaborate each other. The first thing we do is participate on <a href="https://itch.io/jam/gmtk-2020">GMTK 2020</a> event by <a href=" https://itch.io/jam/gmtk-2020/rate/698151">itch.io</a> . I cannot say that this is good enough, but 48 hour making game (including brainstorming) with 3 different time zones (Korea, UK, USA) , i guess its worth. And this is just the beginning</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">JUNE 2020</span>
<a href="/OutOfControlDriver/index.html" class="btn btn--subtle">PLAY!!!</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--location">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Warehouse War</h2>
<p class="color-contrast-medium">After get inspired by Game Jams, and <a href="https://www.youtube.com/channel/UC0JB7TSe49lg56u6qH8y_MQ">Game Developer Conference</a>
i tried to join one of them. Sadly there is another conference (Computer Science) that needs to focus on, so i abandon this. Instead i make it here. LOL. Sadly, its just one level. I still figure it out for the next level</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">May 2020</span>
<a href="/WarehouseWar/index.html" class="btn btn--subtle">PLAY!!!</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--picture">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Magical Stone</h2>
<p class="color-contrast-medium">That moment, there was RAID AREA 51. 9gag people makes fun of it. So i decided make a story based on it. Until now, the story is "done". But the level design still unfinished ._.</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">February 2020</span>
<a href="/MagicalStone/index.html" class="btn btn--subtle">PLAY!!!</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--picture">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Unity Football</h2>
<p class="color-contrast-medium">This is just a demo. After the launch of Unity Engine at late 2019, i tried one of their Template. Just to make sure that unity still able to built on HTML5</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">Jan 2020</span>
<a href="/UnityFootball/index.html" class="btn btn--subtle">PLAY!!!</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--movie">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Continuum Indonesia</h2>
<p class="color-contrast-medium">I was charged with developing an AR platform based on Android that dynamically synchronized with web server. The purpose of that platform is similar with Google Playstore. So, every user is able to download our content and use AR card that we sold offline to enjoy the experiences.</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">Aug 2019</span>
<a href="Continuum_video.html" class="btn btn--subtle">Watch Demo</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
<div class="cd-timeline__block">
<div class="cd-timeline__img cd-timeline__img--location">
<img src="assets/img/cd-icon-location.svg" alt="Location">
</div> <!-- cd-timeline__img -->
<div class="cd-timeline__content text-component">
<h2>Bubble Rig</h2>
<p class="color-contrast-medium">The game that we can finish creating it. We create This becasue of Compfest 2017 event. There are 3 of us that create this game, 1 artist, 1 designer, 1 lead programmer (me).</p>
<div class="flex justify-between items-center">
<span class="cd-timeline__date">2017</span>
<a href="/BubbleRig/index.html" class="btn btn--subtle">PLAY!!!</a>
</div>
</div> <!-- cd-timeline__content -->
</div> <!-- cd-timeline__block -->
</div>
</section> <!-- cd-timeline -->
<script src="assets/js/main.js"></script>
</body>
</html>