git.s-ol.nu mmm / 71d1c54
portfolio progress s-ol a month ago
11 changed file(s) with 424 addition(s) and 85 deletion(s). Raw diff Collapse all Expand all
1 skillset
2 --------
3 <p style="max-width: 800px;">
4 Here you can find a selection of technologies, languages and skills I have acquired and used in the past,
5 together with select projects demonstrating these abilities.
6 Projects marked in <em>italic</em> represent employment / professional consulting (see below for details).
7 </p>
8
9 - programming
10 - C++
11 - openFrameworks: [VJmidiKit][VJmidiKit]
12 - JS
13 - nodejs & react: [*rise*][rise], [iii telefoni][tre_telefoni], [IYNX][iynx]
14 - Lua & Moonscript: [this website](/meta), [vision-training-kit][vtk], [gayngine][gayngine]
15 - Python: [themer][themer]
16 - GLSL & HLSL: [*Vectronom*][vectronom], [*Harold Halibut*][hh], [VJmidiKit][VJmidiKit] (raymarching content)
17 - C# & Unity: [*Vectronom*][vectronom], [*Harold Halibut*][hh]
18 - Clojure: [*Vectronom*][vectronom] (UGC backend)
19 - electronics
20 - PCB Design: [btrktrl][btrktrl]
21 - embedded programming
22 - micro controllers: [IYNX][iynx], [*Vectronom*][vectronom] (fair booth)
23 - FPGAs: [btrktrl][btrktrl]
24 - general technologies
25 - avid linux user
26 - docker & docker-compose: [*rise*][rise]
27 - mongodb: [*rise*][rise]
28 - visual & motion design: [demoloops][demoloops], [VJmidiKit][VJmidiKit]
29
30 professinal work
31 ------------------
32 ### slow bros - Harold Halibut
33 <p style="max-width: 800px;">
34 I am working with Slow Bros on their upcoming game <a href="http://haroldhalibut.com/">Harold Halibut</a>
35 For Harold Halibut I do Gameplay- and Tools Programming, as well as Shaders and Porting.
36 </p>
37
38 ### ludopium - Vectronom
39 I have worked on [Vectronom](https://vectronom.arte.fr),
40 where I implemented and worked on many systems in and around the game:
41
42 - gamplay programming
43 - UI programming
44 - palette system using HLSL shaders
45 - clojure-based REST API for storing and sharing UGC
46 - integration with backend services by Steam and Nintendo
47 - development of tech for the fair booth
48 - realtime speedrunning leaderboard
49 - custom driver for LED lettering
50 - porting (Nintendo Switch, Android, iOS)
51
52 ### rise technologies
53 <p style="max-width: 800px;">
54 I worked as a full-stack developer with rise technologies on their remote support solution for three years.
55 In this time I designed, created and worked on multiple systems and layers of the product:
56 </p>
57
58 - front-end development (react, material-ui)
59 - back-end development
60 - main application (meteorjs, node, monogdb)
61 - microservice architecture (nodejs, rabbit MQ)
62 - notification handling & delivery (APN, FCM)
63 - mobile development & debuggin (cordova for Android, iOS)
64 - webRTC conferencing
65 - using janus-gateway
66 - contributed C patches reinforcing the communication security for our needs
67 - implemented client-side logic
68 - implemented gateway orchestration
69 - dev-ops
70 - designed a custom CI system
71 - designed deployment infrastructure on MS Azure (docker, docker-compose)
72 - supervised migration from MS Azure to Amazon AWS
73
74 [themer]: https://github.com/s-ol/themer
75 [vtk]: https://s-ol.itch.io/vision-training-kit
76 [iynx]: /games/IYNX
77 [btrktrl]: /projects/btrktrl
78 [VJmidiKit]: /projects/VJmidiKit
79 [demoloops]: /projects/demoloops
80 [tre_telefoni]: /projects/iii-telefoni
81 [gayngine]: /blog/love_lua_photoshop_and_games
82
83 [vectronom]: #ludopium-vectronom
84 [hh]: #slow-bros-harold-halibut
85 [rise]: #rise-technologies
+0
-85
root/portfolio/text$markdown.md less more
1 skillset
2 --------
3 <p style="max-width: 800px;">
4 Here you can find a selection of technologies, languages and skills I have acquired and used in the past,
5 together with select projects demonstrating these abilities.
6 Projects marked in <em>italic</em> represent employment / professional consulting (see below for details).
7 </p>
8
9 - programming
10 - C++
11 - openFrameworks: [VJmidiKit][VJmidiKit]
12 - JS
13 - nodejs & react: [*rise*][rise], [iii telefoni][tre_telefoni], [IYNX][iynx]
14 - Lua & Moonscript: [this website](/meta), [vision-training-kit][vtk], [gayngine][gayngine]
15 - Python: [themer][themer]
16 - GLSL & HLSL: [*Vectronom*][vectronom], [*Harold Halibut*][hh], [VJmidiKit][VJmidiKit] (raymarching content)
17 - C# & Unity: [*Vectronom*][vectronom], [*Harold Halibut*][hh]
18 - Clojure: [*Vectronom*][vectronom] (UGC backend)
19 - electronics
20 - PCB Design: [btrktrl][btrktrl]
21 - embedded programming
22 - micro controllers: [IYNX][iynx], [*Vectronom*][vectronom] (fair booth)
23 - FPGAs: [btrktrl][btrktrl]
24 - general technologies
25 - avid linux user
26 - docker & docker-compose: [*rise*][rise]
27 - mongodb: [*rise*][rise]
28 - visual & motion design: [demoloops][demoloops], [VJmidiKit][VJmidiKit]
29
30 professinal work
31 ------------------
32 ### slow bros - Harold Halibut
33 <p style="max-width: 800px;">
34 I am working with Slow Bros on their upcoming game <a href="http://haroldhalibut.com/">Harold Halibut</a>
35 For Harold Halibut I do Gameplay- and Tools Programming, as well as Shaders and Porting.
36 </p>
37
38 ### ludopium - Vectronom
39 I have worked on [Vectronom](https://vectronom.arte.fr),
40 where I implemented and worked on many systems in and around the game:
41
42 - gamplay programming
43 - UI programming
44 - palette system using HLSL shaders
45 - clojure-based REST API for storing and sharing UGC
46 - integration with backend services by Steam and Nintendo
47 - development of tech for the fair booth
48 - realtime speedrunning leaderboard
49 - custom driver for LED lettering
50 - porting (Nintendo Switch, Android, iOS)
51
52 ### rise technologies
53 <p style="max-width: 800px;">
54 I worked as a full-stack developer with rise technologies on their remote support solution for three years.
55 In this time I designed, created and worked on multiple systems and layers of the product:
56 </p>
57
58 - front-end development (react, material-ui)
59 - back-end development
60 - main application (meteorjs, node, monogdb)
61 - microservice architecture (nodejs, rabbit MQ)
62 - notification handling & delivery (APN, FCM)
63 - mobile development & debuggin (cordova for Android, iOS)
64 - webRTC conferencing
65 - using janus-gateway
66 - contributed C patches reinforcing the communication security for our needs
67 - implemented client-side logic
68 - implemented gateway orchestration
69 - dev-ops
70 - designed a custom CI system
71 - designed deployment infrastructure on MS Azure (docker, docker-compose)
72 - supervised migration from MS Azure to Amazon AWS
73
74 [themer]: https://github.com/s-ol/themer
75 [vtk]: https://s-ol.itch.io/vision-training-kit
76 [iynx]: /games/IYNX
77 [btrktrl]: /projects/btrktrl
78 [VJmidiKit]: /projects/VJmidiKit
79 [demoloops]: /projects/demoloops
80 [tre_telefoni]: /projects/iii-telefoni
81 [gayngine]: /blog/love_lua_photoshop_and_games
82
83 [vectronom]: #ludopium-vectronom
84 [hh]: #slow-bros-harold-halibut
85 [rise]: #rise-technologies
1 import ReactiveVar, tohtml, text, elements from require 'mmm.component'
2 import article, a, video, img, h1, div, p, ul, li, br from elements
3 import embed, link_to from (require 'mmm.mmmfs.util') elements
4
5 embed_img = (src) -> (style) -> img :src, :style
6 embed_vid = (src) -> (style) -> video autoplay: true, loop: true, muted: true, :src, :style
7
8 import artistic, game, js, lua, shader, hardware, tool, collab, professional, cs, cpp from setmetatable {}, __index: (t, k) -> k
9
10 padded_ul = (tbl) ->
11 ul with tbl
12 .style = padding: '0 2rem 0.5rem'
13
14 projects = {
15 {
16 name: 'Harold Halibut / Slow Bros'
17 desc: 'Tool & Game Development'
18 extra: 'April - Decemer 2019 (consulting)'
19 content: padded_ul {
20 li {
21 text 'Unity/C# development'
22 ul {
23 li text 'developed multiple mini-games and interactions'
24 }
25 }
26 li text 'tool development'
27 li text 'shader programming'
28 li text 'porting (various consoles)'
29 }
30 href: 'http://haroldhalibut.com/'
31 media: embed_img 'http://haroldhalibut.com/wp-content/uploads/2016/07/AgoraArcadesDialogue.png'
32 tags: :cs, :professional, :game
33 }
34 {
35 name: 'Vectronom / Ludopium'
36 desc: 'Technical Artist, Game Development'
37 extra: 'July - Decemer 2019'
38 content: padded_ul {
39 li text 'Unity/C# development (gameplay, UI, tools)'
40 li {
41 text 'backend for storing and sharing UGC across platforms'
42 ul {
43 li text 'SQL-backed storage of user-created levels'
44 li text 'implemented in clojure with clojure-ring'
45 li text 'integration with Steam and Nintendo services'
46 }
47 }
48 li {
49 text 'development of tech for showcase booths'
50 ul {
51 li text 'realtime speedrunning leaderboard (node, react)'
52 li text 'custom RGB LED driver and lettering'
53 }
54 }
55 li text 'porting to Nintendo Switch, Android, iOS, tvOS'
56 li text 'HLSL shader palette system'
57 }
58 href: 'https://vectronom.arte.tv'
59 media: embed_vid '/portfolio/vectronom/media:%20video$webm.webm'
60 tags: :cs, :professional, :js, :shader, :game
61 }
62 {
63 name: 'rise technologies'
64 desc: 'Full-Stack Development, Web & App'
65 extra: 'April 2016 - April 2019'
66 content: padded_ul {
67 li text 'front-end development (react, material-ui)'
68 li {
69 text 'back-end development',
70 ul {
71 li text 'main application (meteor.js, node, MongoDB)'
72 li text 'microservice architecture (node, RabbitMQ)'
73 li text 'notification handling & delivery (APN, FCM)'
74 }
75 }
76 li text 'mobile development'
77 li {
78 text 'webRTC conferencing (janus-gateway)'
79 ul {
80 li text 'contributed C patches reinforcing the communication security for our needs'
81 li text 'implemented client-side logic'
82 li text 'implemented gateway orchestration'
83 }
84 }
85 li {
86 text 'dev-ops'
87 ul {
88 li text 'designed and implemented a custom CI system'
89 li text 'designed deployment infrastructure on MS Azure (docker, docker-compose)'
90 li text 'supervised migration from MS Azure to Amazon AWS'
91 }
92 }
93 }
94 href: 'https://rise.tech'
95 media: embed_img 'https://rise.tech/wp-content/uploads/2018/06/rise-plattform.png'
96 tags: :professional, :js, :tool
97 }
98 {
99 name: 'ForChange Reserach Fund'
100 desc: 'Game Design and Development'
101 extra: 'Mach - June 2017 (consulting)'
102 content: padded_ul {
103 li {
104 text "designed 'Lorem Ipsum' together with two research scientists"
105 ul {
106 li text 'design goal was to communicate their research findings'
107 li text 'created a paper prototype'
108 li text 'designed a 4-player social game about truth and perspectives'
109 }
110 }
111 li {
112 text 'developed the game as a web application'
113 ul {
114 li text 'front-end using react'
115 li text 'back-end hosts game sessions via WebSockets'
116 li text 'joining games via link or QR-code scanning (in-app)'
117 li text 'gameplay implemented in immutable/functional-style'
118 }
119 }
120 }
121 href: 'https://loremipsum.s-ol.nu/'
122 media: embed_img '/portfolio/lorem_ipsum/media:%20image$jpeg.jpg'
123 tags: :professional, :js, :collab, :game
124 }
125 {
126 name: 'btrktrl'
127 desc: 'a custom MIDI/OSC control surface'
128 entries: {
129 'encoders with capacitive touch and RGB feedback'
130 'custom PCBs based on iCE40 FPGAs'
131 'motherboard with Arduino MCU'
132 'communication via OSC/USB'
133 'individually programmable daughterboards'
134 }
135 href: '/projects/btrktrl'
136 media: embed_img '/projects/btrktrl/pcb_glamour_top/image$jpeg.jpg'
137 tags: :hardware, :tool, :cpp
138 }
139 {
140 name: 'VJmidiKit'
141 desc: 'a tool for MIDI-reactive visuals'
142 entries: {
143 'GLSL shader livecoding'
144 'block-based language for MIDI-music reactivity'
145 'implemented in openFrameworks/C++'
146 }
147 href: '/projects/VJmidiKit'
148 media: embed_vid '/portfolio/VJmidiKit/media:%20video$mp4.mp4'
149 tags: :tool, :cpp, :shader
150 }
151 {
152 name: 'IYNX'
153 desc: 'a narrative, tangible, physical puzzle incorporating digital elements'
154 entries: {
155 'powered by a raspberry pi 3 and two arduino nanos'
156 'touch-panel UI and control software with node, electron and react'
157 'interfaces with analog potentiometers, keypad matrix, switches'
158 }
159 href: '/games/IYNX'
160 media: embed_img '/games/IYNX/pictures/ui_menu/image$jpeg.jpg'
161 tags: :collab, :game, :js, :hardware
162 }
163 {
164 name: 'Plonat Atek'
165 desc: 'a sound-only breakout game, displayable on an oscilloscope'
166 entries: {
167 'uses stereo sound to draw visuals on an oscilloscope'
168 'programmed in PureData'
169 'runs on a Raspberry Pi Zero in a custom case with hardware controls'
170 "1st place in Innovation, LudumDare 38 Compo"
171 }
172 href: '/games/plonat_atek'
173 media: embed_img '/games/plonat_atek/pictures/amaze/image$jpeg.jpg'
174 tags: :artistic, :game, :hardware
175 }
176 {
177 name: 'tre telefoni'
178 desc: 'experimental interactive installation piece about communication'
179 content: padded_ul {
180 li text 'realtime voice chat between three participants, in an unusual configuration'
181 li {
182 text 'web-based prototype'
183 ul {
184 li text 'realized using webRTC, react'
185 li text '3-player matchmaking'
186 }
187 }
188 }
189 href: '/projects/iii-telefoni'
190 media: embed_img '/projects/iii-telefoni/heads/image$jpeg.jpg'
191 tags: :artistic, :game, :js
192 }
193 {
194 name: '1u matrix mixer'
195 desc: 'Embedded Software Development'
196 entries: {
197 "embedded programming for a Eurorack module"
198 "C++, targetting Teensy 3.5"
199 "8 encoders with RGB lighting"
200 "digtally controls a 8x8 switching matrix and 8 channels of volume modulation"
201 }
202 media: embed_img '/portfolio/1u-mod/media:%20image$jpeg.jpg'
203 tags: :collab, :hardware, :cpp
204 }
205 {
206 name: 'mmm'
207 desc: 'experimental file-system/CMS/digital working space'
208 content: padded_ul {
209 style: padding: '0 2em 1em'
210 li text 'powers this website'
211 li text 'implemented in Lua/MoonScript'
212 li text 'innovative type-coercion system'
213 li text 'client/server polymorphic UI framework'
214 li text 'built-in server-side rendering and interactive editing support'
215 }
216 -- href: '/articles/mmmfs'
217 media: embed_img '/portfolio/mmm/media:%20image$png.png'
218 tags: :tool, :lua
219 }
220 {
221 name: 'Toy Box Orchestra'
222 desc: 'interactive audio-visual performance project'
223 entries: {
224 "circuit bent childrens' toys"
225 "developed a realtime video effect inspired by analog video synthesisers in openframeworks and GLSL"
226 "interactive MIDI controls for the effect for performing it on stage"
227 }
228 href: 'https://chimpanzeebukkaque.bandcamp.com/releases'
229 media: embed_img '/portfolio/visualist/media:%20image$jpeg.jpg'
230 tags: :collab, :artistic, :cpp, :hardware, :shader
231 }
232 }
233
234 project_row = (tag, exclude) ->
235 with ul style: display: 'flex', 'flex-wrap': 'wrap', 'align-items': 'top'
236 for pp in *projects
237 continue if tag and not pp.tags[tag]
238 continue if not tag and exclude and pp.tags[exclude]
239
240 \append li {
241 style:
242 'border-radius': '6px'
243 display: 'flex'
244 'flex-direction': 'column'
245 width: '22rem'
246 margin: '0.5em'
247 'padding-bottom': '0.5em'
248 background: 'var(--gray-bright)'
249 overflow: 'hidden'
250 'font-size': '0.9em'
251
252 a {
253 style:
254 display: 'block'
255 position: 'relative'
256 color: 'var(--gray-bright)'
257 background: 'var(--gray-dark)'
258 filter: 'none'
259
260 href: pp.href
261
262 pp.media {
263 width: '100%'
264 height: '13rem'
265 background: 'var(--gray-bright)'
266 'box-sizing': 'border-box'
267 'object-fit': 'cover'
268 }
269
270 h1 pp.name, style:
271 padding: '0.2rem 1rem'
272 }
273
274 if pp.extra
275 div pp.extra, style:
276 background: 'var(--gray-darker)'
277 color: 'var(--gray-bright)'
278 padding: '0.2em 1rem'
279
280 p (text pp.desc), style: 'padding': '0 1rem'
281 text ' '
282 pp.content or padded_ul for line in *pp.entries
283 li text line
284 }
285
286 tohtml with article!
287 filter = ReactiveVar!
288
289 taglink = (label, tag=label) ->
290 a label, {
291 href: '#'
292 onclick: (e) =>
293 e\preventDefault!
294 filter\transform (old) -> if old == tag then nil else tag
295 }
296
297 \append p "I have worked with many a wide range of technologies and frameworks.
298 Here is a breakdown of the ones I consider myself proficient in.", br!,
299 "You can click on any of the tags marked in bold to filter the projects below accordingly."
300
301 \append ul {
302 li {
303 "software programming"
304 ul {
305 li (taglink "JavaScript", js), ": react, nodejs, electron, meteor"
306 li (taglink "C++", cpp), ": openFrameworks, raymarching, SDFs"
307 li (taglink "GLSL & HLSL", shader), ": openFrameworks, intermediate openGL"
308 li taglink "C# and Unity", cs
309 li "Python"
310 li "Lua/MoonScript"
311 }
312 }
313 li {
314 (taglink hardware), " and embedded programming"
315 ul {
316 li "PCB Design"
317 li text "embedded programming (C++) and interfacing"
318 li "FPGA development (Verilog)"
319 }
320 }
321 li {
322 "other"
323 ul {
324 li "Linux"
325 li "docker, docker-compose"
326 li "HTML, CSS"
327 }
328 }
329 }
330
331 \append with h1 "selected projects", style: 'margin-top': '1em'
332 \append a "show all", href: '#', style: { 'font-size': '0.7em', 'margin-left': '1.5em' }, onclick: (e) =>
333 e\preventDefault!
334 filter\set!
335 \append filter\map => project_row @, professional
336
337 \append h1 "professional work", style: 'margin-top': '1em'
338 \append p "I have worked for or with the following companies and organisations in the past:"
339 \append project_row professional