summaryrefslogtreecommitdiffhomepage
path: root/index.html
blob: 981d5d38fdadf45a4b4f8dd466904f60a5485034 (plain)
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
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
<html><head><meta charset="utf-8"/><title>Portfolio thing</title><link rel="stylesheet" href="./stylesheet/style.css"/><script src="https://cdn.tailwindcss.com"></script><script src="https://unpkg.com/vue@3"></script><script defer src='../assets/fontawesome-free-6.0.0-web/js/all.js'></script></head><div class="flex justify-center"><div class="flex flex-col flex-auto justify-between max-w-5xl"><header class="m-10"><h1 class="text-6xl text-slate-200 w-auto">Portfolio - Tradam.dev</h1></header><body class="bg-gradient-to-b from-thunder-200 to-thunder-300 text-slate-100 font-semiserif"><div id='app' class='flex justify-center pb-12 pr-3 pl-3'><div class="flex flex-auto flex-col justify-between flex-nowrap relative pl-12 pb-12 border-solid border-0 rounded-2xl bg-slate-800 space-y-8 shadow-outset"><div class="sticky top-3 right-0 overflow-visible h-0 float-right"><div class="relative flex justify-end mt-8"><footer><footer class="no-select table text-right p-0.5 text-none border-0 rounded-xl"><div class="rounded-xl m-0 p-0.5 flex flex-col"><a href="https://github.com/realtradam"><i class="fab fa-github-alt icon-img-foot p-1 text-4xl text-thunder-thunder hover:text-white transition-colors"></i></a></div></footer></footer></div></div><h1 class="text-center text-4xl" style="z:99">Email: contact&lt;at&gt;tradam.dev</h1><p class="pl-24 pr-24">this is a little blurb about myself</p><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/orc-arena-of-time">Orc: Arena of Time</a></p>
<div class="subheader">—  Raylib/MRuby Game</div></h1><h2>January 2022</h2>

<p>Short game that won 1st place in the Raylib 5K gamejam.</p>

<p><button @click="orcarena = !orcarena" class="text-center mt-0.5 pt-1 rounded text-thunder-thunder hover:text-white transition-colors underline">
<div v-if="!orcarena">
⏵Play Game(Requires Keyboard and Mouse)
</div>
<div v-if="orcarena">
⏷ Close Game
</div>
</button>
<Transition name="fade">
<div v-if="orcarena" class="bg-gray-700 shadow-outset mt-1 mr-3 rounded-lg">
<iframe frameborder="0" class="bg-black rounded-t-lg" style="aspect-ratio:900/675;" src="https://itch.io/embed-upload/5265023?color=000000" allowfullscreen="" width="100%"><a href="https://tradam.itch.io/orc-arena-of-time">Play Orc: Arena of Time on itch.io</a></iframe>
<div class="pl-3 pt-2 pb-3"></p>

<p>Controls:<br>
All controls are fully explained in game.</p>

<ul>
<li>W/A/S/D - Move</li>
<li>R - Reset Level</li>
</ul>

<p></div>
</div>
</Transition></p>

<h3>Group Project(2 people)</h3>

<ul>
<li>Effectively cooperated in a team of 2 to build a better game, faster.</li>
<li>Went from an idea to complete working prototype under a tight deadline of 8 days.</li>
<li>Utilized multiple custom in-house made tools which allowed for more efficient development speed and better code organization(Used MRuby-Raylib and FelECS).</li>
<li>One of 41 submissions in the Raylib 5K Gamejam, our game won first place both by popular vote and judge&#39;s vote.</li>
</ul>

<p>My Contributions:</p>

<ul>
<li>Level transition animation system</li>
<li>Level &quot;Scissor&quot;(or Box) pathing system

<ul>
<li>Multiple paths can be chained together using any arbitrary equation(linear, quadratic, bezier, etc)</li>
<li>The size of the &quot;Scissor&quot;(or Box) also follows a chain of multiple arbitrary equations(linear, quadratic, bezier, etc)</li>
<li>Having textures/text appear or disappear after the Scissor has passed over a given location</li>
</ul></li>
<li>How a given level is stored in code(before it is loaded)</li>
<li>Character animation

<ul>
<li>Character turning around</li>
<li>Tying running animation speed to character speed</li>
<li>Character Death Animation</li>
</ul></li>
<li>Level design(First Level and Maze (3rd)level)</li>
<li>Input system</li>
<li>Collision resolution</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/FelECS">FelECS</a></p>
<div class="subheader">—  Engine Agnostic Pure Ruby ECS</div></h1><h2>May 2021 -</h2>

<p>ECS implemented in Ruby with goals of being easy to incorporate/use in projects, reliable, and heavily documented.</p>

<!-- logo -->

<h3>Solo Project</h3>

<ul>
<li>To ensure reliability the test coverage goal is 100% coverage. This target is consistently maintained since the library&#39;s initial release in July 2021.</li>
<li>To ensure ease of use the documentation coverage goal is 100% coverage. Using Yard documentation coverage is automatically reported as well as automatic generation of documentation.</li>
<li>Is continuously being developed to this day to add new features as well as rework and optimize older ones.</li>
<li>Built various games using this framework in order to stress test its usability(Orc: Arena of Time, Steelwings, Ruboids)</li>
<li>Enables faster development by keeping code organized and modular while the simple syntax stays out of the way.</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/mruby-raylib">MRuby-Raylib</a></p>
<div class="subheader">—  MRuby bindings for the Raylib Graphics Library</div></h1><h2>May 2021 -</h2>

<p>MRuby bindings which allow easy use of the C library Raylib.</p>

<!-- logo -->

<h3>Group Project(2 people)</h3>

<ul>
<li>Allowed for better understanding of how wrappers and bindings to C libraries are structured and designed.</li>
<li>Working on this project gave a better understanding of how a high level language like Ruby works under the hood, as well as how a language like this would interface with C code.</li>
<li>Enables the ease and speed of coding with Ruby, while still having access to advanced OpenGl/Raylib C functions.</li>
<li>Working in a group allowed us to cover each others faults and weaknesses resulting in not only faster development time but also better code. When one of us would run into a problem or make a mistake the other person would be quick to assist and keep development going forward.</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/SteelWings">Steelwings</a></p>
<div class="subheader">—  Raylib/MRuby Game</div></h1><h2>January 2022</h2>

<p>Short game made for a university club gamejam.</p>

<p><button @click="steelwings = !steelwings" class="text-center mt-0.5 pt-1 rounded text-thunder-thunder hover:text-white transition-colors underline">
<div v-if="!steelwings">
⏵Play Game(Requires Mouse)
</div>
<div v-if="steelwings">
⏷ Close Game
</div>
</button>
<Transition name="fade">
<div v-if="steelwings" class="bg-gray-700 shadow-outset mt-1 mr-3 rounded-lg">
<iframe frameborder="0" class="bg-black mr-3 rounded-t-lg" style="aspect-ratio:1280/740;" src="https://itch.io/embed-upload/4992285?color=000000" allowfullscreen="" width="100%"><a href="https://argo.itch.io/steelwings">Play Steelwings on itch.io</a></iframe>
<div class="pl-3 pt-2 pb-3"></p>

<p>Controls:  </p>

<ul>
<li>Mouse - Point to fly towards</li>
<li>Left Click - Shoot</li>
</ul>

<p></div>
</div>
</Transition></p>

<h3>Group Project(2 people)</h3>

<ul>
<li>First gamejam game we made which utilized my custom made tools(FelECS)

<ul>
<li>Identified issues with the design by both having the tool used by someone else and myself for a larger project.</li>
<li>Was able to use these insights to further develop and improve FelECS.</li>
</ul></li>
</ul>

<p>My Contributions:</p>

<ul>
<li>Set up a boid system with FelECS where additional rules could be easily added.</li>
<li>Hitbox detection system</li>
<li>Bullet shooting system</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/ruby2d-camera">Ruby2D Camera</a></p>
<div class="subheader">—  Fill this out</div></h1><h2>Start date - End date</h2>

<video controls muted autoplay loop class="m-auto mt-4 mb-4 shadow-outset rounded-lg w-[90%]">
<source type="video/mp4" src="assets/camera-example.mp4">
</video>

<h3>Solo Project</h3>

<ul>
<li>Did a lot of math</li>
<li>Did from scratch</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/ruboids">Ruboids</a></p>
<div class="subheader">—  Fill this out</div></h1><h2>Start date - End date</h2>

<p>Fill this out</p>

<video controls muted autoplay loop class="m-auto mt-4 mb-4 shadow-outset rounded-lg w-[90%]">
<source type="video/mp4" src="assets/ruboid-example.mp4">
</video>

<h3>Solo Project</h3>

<ul>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/arbitrary-polygon-collision">Arbitrary Convex Polygon Collision</a></p>
<div class="subheader">—  Fill this out</div></h1><h2>Start date - End date</h2>

<p>Fill this out</p>

<p><button @click="sat = !sat" class="text-center mt-0.5 pt-1 rounded text-thunder-thunder hover:text-white transition-colors underline">
<div v-if="!sat">
⏵Play Demo(Requires Mouse)
</div>
<div v-if="sat">
⏷ Close Demo
</div>
</button>
<Transition name="fade">
<div v-if="sat" class="bg-gray-700 shadow-outset mt-1 mr-3 rounded-lg">
<iframe frameborder="0" class="bg-black rounded-t-lg" style="aspect-ratio:900/675;" src="https://itch.io/embed-upload/5312321?color=000000" allowfullscreen="" width="100%"><a href="https://tradam.itch.io/arbitrary-polygon-collision-demo">Play Arbitrary Polygon Collision Demo on itch.io</a></iframe>
<div class="pl-3 pt-2 pb-3"></p>

<p>Controls:  </p>

<ul>
<li>Mouse: Move hexagon</li>
<li>W/S: Change size</li>
<li>A/D:  Rotate</li>
<li>+/-: Change number of sides</li>
<li>Hold Shift + A key above: Apply on stationary shape</li>
</ul>

<p></div>
</div>
</Transition></p>

<h3>Solo Project</h3>

<ul>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/winter-one">Winter One</a></p>
<div class="subheader">—  Godot Game</div></h1><h2>Start date - End date</h2>

<p>Fill this out</p>

<p><button @click="winterone = !winterone" class="text-center mt-0.5 pt-1 rounded text-thunder-thunder hover:text-white transition-colors underline">
<div v-if="!winterone">
⏵Play Game(Requires Mouse or Keyboard)
</div>
<div v-if="winterone">
⏷ Close Game
</div>
</button>
<Transition name="fade">
<div v-if="winterone" class="bg-gray-700 shadow-outset mt-1 mr-3 rounded-lg">
<iframe frameborder="0" class="bg-black rounded-t-lg" style="aspect-ratio:900/660;" src="https://itch.io/embed-upload/5277533?color=000000" allowfullscreen="" width="100%"><a href="https://tradam.itch.io/winter-one">Play Winter One on itch.io</a></iframe>
<div class="pl-3 pt-2 pb-3"></p>

<p>Controls:  </p>

<ul>
<li>Mouse - Point to move</li>
<li>Left Click - Begin Shooting<br></li>
</ul>

<div></div>

<ul>
<li>W/A/S/D - Move</li>
<li>Space - Toggle Shooting</li>
</ul>

<p></div>
</div>
</Transition></p>

<h3>Group Project(2 people)</h3>

<ul>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
</ul>
</article><article class="basis-1/3 bg-gradient-to-r from-slate-800 to-slate-900 rounded-xl mr-12 pl-8 pr-8 pt-5 pb-5 shadow-inset"><h1><a href="https://github.com/realtradam/optimal-direction">Optimal Direction</a></p>
<div class="subheader">—  Godot Prototype</div></h1><h2>June 2019 - November 2020</h2>

<p>An old prototype racing game.</p>

<p><button @click="optimal = !optimal" class="text-center mt-0.5 pt-1 rounded text-thunder-thunder hover:text-white transition-colors underline">
<div v-if="!optimal">
⏵Play Game(Requires Keyboard and Mouse)
</div>
<div v-if="optimal">
⏷ Close Game
</div>
</button>
<Transition name="fade">
<div v-if="optimal" class="bg-gray-700 shadow-outset mt-1 mr-3 rounded-lg">
<iframe frameborder="0" class="bg-black rounded-t-lg mb-1" style="aspect-ratio:900/675;" src="https://itch.io/embed-upload/5283100?color=000000" allowfullscreen="" width="100%"><a href="https://tradam.itch.io/optimal-direction">Play Orc: Arena of Time on itch.io</a></iframe>
<div class="pl-3 pt-2 pb-3"></p>

<p>Controls:  </p>

<ul>
<li>W - Drive</li>
<li>A/D - Steer</li>
<li>Space - Brake</li>
<li>Shift - Drift/Grip</li>
</ul>

<p></div>
</div>
</Transition></p>

<h3>Solo Project</h3>

<ul>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
<li>You need to fill out these bullet points</li>
</ul>
</article></div></div></body></div></div><script type="module">Vue.createApp({
	data() {
		return {
			orcarena: false,
			steelwings: false,
			winterone: false,
			optimal: false,
			sat: false
		}
	}
}).mount('#app')
</script></html>