Sara/saragerretsen.nl
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: Sara:41ca79339aff18acd3ba0ee2dc2e6205d14292b5
Branches Tags
Sara:main
...
compare: Sara:9c7d21e5c948065226c4927c88c1aea33154e083
Branches Tags
Sara:main

10 commits
41ca79339a ... 9c7d21e5c9

Author SHA1 Message Date
Sara 9c7d21e5c9 2024-06-07 2024-06-07 13:24:49 +02:00
Sara 728a90e615 added rel="me" to head of index 2024-05-08 23:28:23 +02:00
Sara d0440f04e3 feat: updated header 1 in index 2024-04-09 10:51:00 +02:00
Sara 805d74919b feat: set target="_blank" for external links 2024-02-22 15:12:27 +01:00
Sara bcb581e96f feat: replaced mentions of unity to godot 2024-02-22 14:00:40 +01:00
Sara 32014cddd5 feat: added Blog and external link icons 2024-02-22 14:00:29 +01:00
Sara 3b359a4997 feat: updated resume 2024-02-22 14:00:00 +01:00
Sara c328f03ca7 added git to header 2023-12-02 20:47:36 +01:00
Sara 3ce9029a33 removed github 2023-12-02 20:27:56 +01:00
Sara 2e3b773b00 replaced all references to deadname :3 2023-12-02 16:48:14 +01:00
11 changed files with 66 additions and 62 deletions
Show stats Expand all files Collapse all files

BIN
assets/blobcat_gitea.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 2.4 MiB

BIN
files/Resume.pdf
View file

Binary file not shown.

6
index.html
View file

@ -11,6 +11,8 @@
<link rel="stylesheet" href="shared/style.css"> <link rel="stylesheet" href="shared/style.css">
<link rel="stylesheet" href="shared/projects.css"> <link rel="stylesheet" href="shared/projects.css">
<link rel="me" href="https://tech.lgbt/@sara">
<style> <style>
#intro-sentence { #intro-sentence {
margin-bottom: 100px; margin-bottom: 100px;
@ -25,7 +27,7 @@
<body> <body>
<section> <section>
<h1 id="intro-sentence">Hello, my name is Sara! I'm a game developer with love for the intricacies of player <h1 id="intro-sentence">Hi! my name is Sara! I'm a game developer in love with the intricacies of player
interaction.</h1> interaction.</h1>
</section> </section>
<section> <section>
@ -106,7 +108,7 @@
As well as about how to get players invested and excited. As well as about how to get players invested and excited.
In my free time I like making games from scratch, or in custom engines. In my free time I like making games from scratch, or in custom engines.
When it comes to third party engines I'm most experienced with the Unreal and When it comes to third party engines I'm most experienced with the Unreal and
Unity game engines. For personal projects I mainly work with SDL2, though sometimes I use SFML as well. Godot game engines. For personal projects I mainly work with SDL2, though sometimes I use SFML as well.
</p> </p>
</div> </div>
<div class="personal-info-photo"></div> <div class="personal-info-photo"></div>

45
projects/boids.html
View file

@ -31,19 +31,19 @@
<p> <p>
The repository for the boids simulation. The repository for the boids simulation.
</p> </p>
<a class="internal" target="_blank" href="https://github.com/Scott-G-GD/boids-ecs"> <a class="internal" target="_blank" href="https://git.saragerretsen.nl/Sara/boids-ecs">
<div class="github-block"> <div class="git-block">
<div class="github-logo"></div> <div class="git-logo"></div>
<h2>Scott-G-GD/boids-ecs</h2> <h2>Sara/boids-ecs</h2>
</div> </div>
</a> </a>
<p> <p>
The ecs library i wrote this for. The ecs library i wrote this for.
</p> </p>
<a class="internal" target="_blank" href="https://github.com/Scott-G-GD/easy-ecs"> <a class="internal" target="_blank" href="https://git.saragerretsen.nl/Sara/easy-ecs">
<div class="github-block"> <div class="git-block">
<div class="github-logo"></div> <div class="git-logo"></div>
<h2>Scott-G-GD/easy-ecs</h2> <h2>Sara/easy-ecs</h2>
</div> </div>
</a> </a>
@ -86,7 +86,7 @@
</p> </p>
<div class="code-box code-content" id="engine-sim-interaction"> <div class="code-box code-content" id="engine-sim-interaction">
<script> <script>
$(function(){$("#engine-sim-interaction").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/engine-sim-interaction.html");}); $(function(){$("#engine-sim-interaction").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/engine-sim-interaction.html");});
</script> </script>
</div> </div>
@ -98,7 +98,7 @@
</p> </p>
<div class="code-box code-content" id="sim-init"> <div class="code-box code-content" id="sim-init">
<script> <script>
$(function(){$("#sim-init").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/boids-sim-init.html");}); $(function(){$("#sim-init").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/boids-sim-init.html");});
</script> </script>
</div> </div>
<p> <p>
@ -106,7 +106,7 @@
</p> </p>
<div class="code-box code-content" id="boid-update-near"> <div class="code-box code-content" id="boid-update-near">
<script> <script>
$(function(){$("#boid-update-near").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/boid-update-near.html");}); $(function(){$("#boid-update-near").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/boid-update-near.html");});
</script> </script>
</div> </div>
<p> <p>
@ -114,7 +114,7 @@
</p> </p>
<div class="code-box code-content" id="boid-separation"> <div class="code-box code-content" id="boid-separation">
<script> <script>
$(function(){$("#boid-separation").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/boids-ecs-separation.html");}); $(function(){$("#boid-separation").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/boids-ecs-separation.html");});
</script> </script>
</div> </div>
<p> <p>
@ -129,7 +129,7 @@
</p> </p>
<div class="code-box code-content" id="ecs-demo"> <div class="code-box code-content" id="ecs-demo">
<script> <script>
$(function(){$("#ecs-demo").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/ecs-systems-usage.html");}); $(function(){$("#ecs-demo").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/ecs-systems-usage.html");});
</script> </script>
</div> </div>
@ -139,7 +139,7 @@
</p> </p>
<div class="code-box code-content" style="overflow-x:hidden" id="load-asset"> <div class="code-box code-content" style="overflow-x:hidden" id="load-asset">
<script> <script>
$(function(){$("#load-asset").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/intended-adb-loading.html");}); $(function(){$("#load-asset").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/intended-adb-loading.html");});
</script> </script>
</div> </div>
<h3>UI</h3> <h3>UI</h3>
@ -149,7 +149,7 @@
</p> </p>
<div class="code-box code-content" id="ui-demo"> <div class="code-box code-content" id="ui-demo">
<script> <script>
$(function(){$("#ui-demo").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/ui-module-boids.html");}); $(function(){$("#ui-demo").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/ui-module-boids.html");});
</script> </script>
</div> </div>
</section> </section>
@ -169,13 +169,6 @@
class="embed" youtube class="embed" youtube
></iframe> ></iframe>
<a class="internal" target="_blank" href="https://github.com/Scott-G-GD/boids-cpp">
<div class="github-block">
<div class="github-logo"></div>
<h2>Scott-G-GD/boids-cpp</h2>
</div>
</a>
<h2 id="product-overview-v1">Product Overview</h2> <h2 id="product-overview-v1">Product Overview</h2>
<p indented> <p indented>
My first version of a boids simulation. Written in C++ with sfml. My first version of a boids simulation. Written in C++ with sfml.
@ -196,7 +189,7 @@
</p> </p>
<div id="code-boids" class="code-content code-box"> <div id="code-boids" class="code-content code-box">
<script> <script>
$(function(){$("#code-boids").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/boids-boids.html");}); $(function(){$("#code-boids").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/boids-boids.html");});
</script> </script>
</div> </div>
</div> </div>
@ -208,17 +201,17 @@
</p> </p>
<div id="code-behaviour-cohesion" class="code-content code-box"> <div id="code-behaviour-cohesion" class="code-content code-box">
<script> <script>
$(function(){$("#code-behaviour-cohesion").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/cohesion-boids.html");}); $(function(){$("#code-behaviour-cohesion").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/cohesion-boids.html");});
</script> </script>
</div> </div>
<div id="code-behaviour-separation" class="code-content code-box"> <div id="code-behaviour-separation" class="code-content code-box">
<script> <script>
$(function(){$("#code-behaviour-separation").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/separation-boids.html");}); $(function(){$("#code-behaviour-separation").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/separation-boids.html");});
</script> </script>
</div> </div>
<div id="code-behaviour-alignment" class="code-content code-box"> <div id="code-behaviour-alignment" class="code-content code-box">
<script> <script>
$(function(){$("#code-behaviour-alignment").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/alignment-boids.html");}); $(function(){$("#code-behaviour-alignment").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/alignment-boids.html");});
</script> </script>
</div> </div>
</div> </div>

4
projects/gml-tile-movement.html
View file

@ -51,7 +51,7 @@
any other character is trying to move to that position. any other character is trying to move to that position.
</p> </p>
<div id="code-try-move" class="code-content code-box"> <div id="code-try-move" class="code-content code-box">
<script>$(function(){ $("#code-try-move").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/try-move-gmldc.html");});</script> <script>$(function(){ $("#code-try-move").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/try-move-gmldc.html");});</script>
</div></div> </div></div>
<h3>AI Movement</h3> <h3>AI Movement</h3>
@ -59,7 +59,7 @@
The AI in the game is a simple example of how the try move function could be used in context. The AI in the game is a simple example of how the try move function could be used in context.
</p> </p>
<div id="code-ai-move" class="code-content code-box"> <div id="code-ai-move" class="code-content code-box">
<script>$(function(){$("#code-ai-move").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/update-ai-gmldc.html");});</script> <script>$(function(){$("#code-ai-move").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/update-ai-gmldc.html");});</script>
</div> </div>
</div> </div>
</section> </section>

12
projects/hlo-projectvtd.html
View file

@ -46,11 +46,11 @@
</p> </p>
<i>spell circle - interface declaration</i> <i>spell circle - interface declaration</i>
<div id="spell-circle-h" class="code-content code-box"> <div id="spell-circle-h" class="code-content code-box">
<script>$(function(){$("#spell-circle-h").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/vtd-spell-circle-h.html");});</script> <script>$(function(){$("#spell-circle-h").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/vtd-spell-circle-h.html");});</script>
</div> </div>
<i>spell circle - implementation</i> <i>spell circle - implementation</i>
<div id="spell-circle-c" class="code-content code-box"> <div id="spell-circle-c" class="code-content code-box">
<script>$(function(){$("#spell-circle-c").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/vtd-spell-circle-c.html");});</script> <script>$(function(){$("#spell-circle-c").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/vtd-spell-circle-c.html");});</script>
</div> </div>
<p> <p>
These 'orbs' all know their own index within the spell circle's list of orbs. When an orb is hit, it sends its own index to the spell map component of the spell circle. This number is then converted to a string and appended to the spell map's pattern string. Because of the way the system works, only 1 digit indexes are used, though the code does not enforce this. These 'orbs' all know their own index within the spell circle's list of orbs. When an orb is hit, it sends its own index to the spell map component of the spell circle. This number is then converted to a string and appended to the spell map's pattern string. Because of the way the system works, only 1 digit indexes are used, though the code does not enforce this.
@ -61,19 +61,19 @@
</p> </p>
<i>spell map - interface declaration</i> <i>spell map - interface declaration</i>
<div id="spell-map-h" class="code-content code-box"> <div id="spell-map-h" class="code-content code-box">
<script>$(function(){$("#spell-map-h").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/vtd-spell-map-h.html");});</script> <script>$(function(){$("#spell-map-h").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/vtd-spell-map-h.html");});</script>
</div> </div>
<i>spell circle - implementation</i> <i>spell circle - implementation</i>
<div id="spell-map-c" class="code-content code-box"> <div id="spell-map-c" class="code-content code-box">
<script>$(function(){$("#spell-map-c").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/vtd-spell-map-c.html");});</script> <script>$(function(){$("#spell-map-c").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/vtd-spell-map-c.html");});</script>
</div> </div>
<i>spell orb - interface declaration</i> <i>spell orb - interface declaration</i>
<div id="spell-orb-h" class="code-content code-box"> <div id="spell-orb-h" class="code-content code-box">
<script>$(function(){$("#spell-orb-h").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/vtd-spell-orb-h.html");});</script> <script>$(function(){$("#spell-orb-h").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/vtd-spell-orb-h.html");});</script>
</div> </div>
<i>spell orb - implementation</i> <i>spell orb - implementation</i>
<div id="spell-orb-c" class="code-content code-box"> <div id="spell-orb-c" class="code-content code-box">
<script>$(function(){$("#spell-orb-c").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/vtd-spell-orb-c.html");});</script> <script>$(function(){$("#spell-orb-c").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/vtd-spell-orb-c.html");});</script>
</div> </div>
</div> </div>
</div> </div>

4
projects/ruins-of-edis.html
View file

@ -47,7 +47,7 @@
This allows the direction while drifting to be changed to be somewhere to the side of the car for it to slide properly. This allows the direction while drifting to be changed to be somewhere to the side of the car for it to slide properly.
</p> </p>
<div id="car-update-code" class="code-content code-box"> <div id="car-update-code" class="code-content code-box">
<script>$(function(){$("#car-update-code").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/update-car-roe.html");});</script> <script>$(function(){$("#car-update-code").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/update-car-roe.html");});</script>
</div> </div>
</div> </div>
@ -58,7 +58,7 @@
These were then applied to the result of a perlin noise function to create a heightmap, which can then be applied to one or more terrain objects. These were then applied to the result of a perlin noise function to create a heightmap, which can then be applied to one or more terrain objects.
</p> </p>
<div id="terrain-generator-code" class="code-content code-box"> <div id="terrain-generator-code" class="code-content code-box">
<script>$(function(){$("#terrain-generator-code").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/terrain-generator-roe.html");});</script> <script>$(function(){$("#terrain-generator-code").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/terrain-generator-roe.html");});</script>
</div> </div>
</div> </div>
</div> </div>

4
projects/spirit-of-science.html
View file

@ -52,7 +52,7 @@
When the player clicks, clickable objects near the cursor should be notified that they've been activated. For this, I created an Interactible interface. This interface can then be inherited to clearly mark a component as clickable. When the player clicks, clickable objects near the cursor should be notified that they've been activated. For this, I created an Interactible interface. This interface can then be inherited to clearly mark a component as clickable.
</p> </p>
<div id="interaction-code" class="code-content code-box"> <div id="interaction-code" class="code-content code-box">
<script>$(function(){$("#interaction-code").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/iinteractible-ss.html");});</script> <script>$(function(){$("#interaction-code").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/iinteractible-ss.html");});</script>
</div> </div>
</div> </div>
@ -63,7 +63,7 @@
It only does this after ensuring that the clicked object can be reached. It only does this after ensuring that the clicked object can be reached.
</p> </p>
<div id="clicking-code" class="code-content code-box"> <div id="clicking-code" class="code-content code-box">
<script>$(function(){$("#clicking-code").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/interaction-ss.html");});</script> <script>$(function(){$("#clicking-code").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/interaction-ss.html");});</script>
</div> </div>
</div> </div>
</div> </div>

6
projects/stig-kart.html
View file

@ -56,7 +56,7 @@
When drifting, the UpdateSteering function will transform the current steering input so that, if the drift was started while steering left, the possible range of steering values is within the range of -1 to -min, where min is a positive number lower than one which signifies the minimum amount of steering. When the drift is started while steering right, the range would be opposite, ranging from min to one. When drifting, the UpdateSteering function will transform the current steering input so that, if the drift was started while steering left, the possible range of steering values is within the range of -1 to -min, where min is a positive number lower than one which signifies the minimum amount of steering. When the drift is started while steering right, the range would be opposite, ranging from min to one.
</p> </p>
<div id="update-steering" class="code-content code-box"> <div id="update-steering" class="code-content code-box">
<script>$(function(){$('#update-steering').load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/update-steering-sk64.html");});</script> <script>$(function(){$('#update-steering').load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/update-steering-sk64.html");});</script>
</div> </div>
</div> </div>
@ -66,7 +66,7 @@
After we had completed the basic time trial mode, we still had about a week to add more features. So while another programmer went ahead to implement splitscreen, I wanted to try and get AI working. The player input component was already separate from the kart physics part. So the basic steering AI works by steering until it is aiming at the next invisible checkpoint on the course. After we had completed the basic time trial mode, we still had about a week to add more features. So while another programmer went ahead to implement splitscreen, I wanted to try and get AI working. The player input component was already separate from the kart physics part. So the basic steering AI works by steering until it is aiming at the next invisible checkpoint on the course.
</p> </p>
<div id="aim-at-target" class="code-content code-box"> <div id="aim-at-target" class="code-content code-box">
<script>$(function(){$("#aim-at-target").load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/rotate-to-target-sk64.html");});</script> <script>$(function(){$("#aim-at-target").load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/rotate-to-target-sk64.html");});</script>
</div> </div>
</div> </div>
@ -79,7 +79,7 @@
With the drift started, the AI needs to aim at the checkpoint after the next to drift. With the drift started, the AI needs to aim at the checkpoint after the next to drift.
</p> </p>
<div id="update-target" class="code-content code-box"> <div id="update-target" class="code-content code-box">
<script>$(function(){$('#update-target').load("https://raw.githubusercontent.com/Scott-G-GD/portfolio-code-highlighting/main/update-target-sk64.html");});</script> <script>$(function(){$('#update-target').load("https://raw.githubusercontent.com/Sara-G-GD/portfolio-code-highlighting/main/update-target-sk64.html");});</script>
</div> </div>
</div> </div>
</div> </div>

10
shared/header.html
View file

@ -11,5 +11,15 @@
<h2>Experience</h2> <h2>Experience</h2>
</a> </a>
</li> </li>
<li>
<a class="internal" href="https://git.saragerretsen.nl/Sara" target="_blank">
<h2>Git↗</h2>
</a>
</li>
<li>
<a class="internal" href="https://blog.winter-software.com/profile/0e41208a-716e-4f10-ae65-8096a10837eb" target="_blank">
<h2>Blog↗</h2>
</a>
</li>
</ul> </ul>
</div> </div>

11
shared/style.css
View file

@ -12,7 +12,7 @@ body {
} }
h1 { h1 {
font-size: 3.5em; font-size: 2.5em;
} }
h2 { h2 {
@ -77,7 +77,7 @@ div.info {
height: 400px; height: 400px;
} }
.github-block { .git-block {
display: grid; display: grid;
color: white; color: white;
grid-template-columns: 125px auto; grid-template-columns: 125px auto;
@ -92,18 +92,17 @@ div.info {
padding: 20px; padding: 20px;
} }
.github-block > h2 { .git-block > h2 {
margin-top: auto; margin-top: auto;
margin-bottom: auto; margin-bottom: auto;
} }
div.github-logo { div.git-logo {
background-color: #0000; background-color: #0000;
background-image: url("../assets/octicon.png"); background-image: url("../assets/blobcat_gitea.png");
background-size: cover; background-size: cover;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
filter: invert(100%);
width: 100px; width: 100px;
height: 100px; height: 100px;
} }