Tessa van Walstijn


#### About  
Created after hearing some frustrations about animated gradient borders for cameras from streamers.
I looked if their where tools that would satisfy the frustrations but found tools that don't provide the flexibility.  

Now more then 3000 streamers are actively using it in their streams.  

To stay up to date I recommend checking out the projects board:  
• [Ticket for v1.1.N](https://github.com/users/TessavWalstijn/projects/1#card-81125180)  
• [Ticket for v1.2.N](https://github.com/users/TessavWalstijn/projects/1#card-64993365)  
& [Ticket for v2.N.N](https://github.com/users/TessavWalstijn/projects/1#card-64993057)  

#### Tech  
**Engine / Framework:**  
• NodeJS  
& ExpressJS  

**Language:**  
• JavaScript ES6+

Animated Border Tool


#### About  
Worked with multiple creators to have custom chat commands interacting with a counter overlay.
For example a sub-goal that resets monthly and having an other sub-goal for the stream session.  

Or a sub-a-ton count down that adds time on followers / subscriptions / bit donations.

An other example is a color war with emotes:


#### Tech  
**Engine / Framework:**  
• Stream Elements platform

**Language:**  
• JavaScript ES6+

Stream Elements Commissions


#### About
I have seen some youtubers use comment highlighting in there videos.
I really liked the idea to use it as well.
So I started using better comments extentsion in vscode.

Later on I had some time on my hands and wanted a better understanding of Regex.
My idea to learn Regex was to create my own comment highlighting tool.

Original Mint it was included within [Trepid Ink](/projects/vscode.trepid-ink)

<div style='width: initial; margin: 0 auto'>
<img style="margin: 0 5px" alt="mint-it issues" src="https://img.shields.io/github/issues/squeeble-ink/vscode.mint-it?color=253550&logo=github&style=flat-square">
<img style="margin: 0 5px" alt="mint-it version" src="https://vsmarketplacebadge.apphb.com/version-short/squeeble.mint-it.svg?label=%20&style=flat-square&color=253550">
<img style="margin: 0 5px" alt="mint-it instals" src="https://vsmarketplacebadge.apphb.com/installs-short/squeeble.mint-it.svg?style=flat-square&color=253550">
</div>



#### Tech
**Engine / Framework:**  
• VS Code

**Language:**  
• JavaScript ES6+  
& TypeScript

Mint it


#### About
Ajax.nl is build and maintained by [Triple](https://www.wearetriple.com/)

The Ajax web shop was build from the ground up and I had the privilege to work on some core functionalities.
These where a custom grid component, custom carrousel component and a third party integration.

The custom carrousel where some feature and style clashes with what Ajax wanted. Eventually we dropped the custom made carrousel for them.
The way of user input on the carrousel was more important then the small style inconsistencies that you would get from a plugin carrousel.
Eventually after a long search and testing I found that [swiper](https://swiperjs.com/) was the one fitting all the requirements the best.

---

**NOTE:** This project is in continuous development.
This means that things I have mentioned here may have changed or might be removed from the current version.
However I can say that I did work on the components I named.

---

Third party integration working and styled:



#### Tech
**Engine / Framework:**  
• React
& NextJS  

**Language:**  
• TypeScript

AFC Ajax web shop


#### About
Linda.nl is build and maintained by [Triple](https://www.wearetriple.com/)

I have updated the menu so users can scroll infinite on mobile.
This had some small issues when I had build it by my self.
These little things came about because of my setup.
I had built it from a game development perspective.
However that isn't the solution for web so with some pair programming 
we created a web friendly infinite scroll menu.

An other thing small thing I have worked on where the share buttons and icons.
Share icons where not the same on all locations and some small tweaks where required in the styling.

---

**NOTE:** This project is in continuous development.
This means that things I have mentioned here may have changed or might be removed from the current version.
However I can say that I did work on the components I named.

---



#### Tech
**Engine / Framework:**  
• React
& GulpJS

**Language:**  
• JavaScript ES6+  
& TypeScript

LINDA.


#### About
This playable ad can be found within games. As an example the 30 second video ad window can show these
playable advertisements instead.  

Because I had build the [Trivia Crack 1](https://twalstijn.squeeble.ink/projects/createjs.triviacrack) version
I was placed on this project. It was pretty easy to build this one because version 1 had a lot reusable elements
like:  
• Questions and awnsers settings (reduced to 3)
• Spinngin wheel  
• Awnser cards  
& Confetty  

The view things that had to be done adding other art to the elements and create a view new ones according to the
story board.

#### Tech
**Engine / Framework:**  
• CreateJS (visual)  
• HowlerJS (audio)  
• GulpJS (building)   

**Language:**  
• JavaScript ES6+

Trivia Crack 2


#### About
This playable ad can be found within games. As an example the 30 second video ad window can show these
playable advertisements instead.  

Personally this is one of my favourate games to build. This is because it was a challenging game to build.
From experience we knew that the framework PhaserJS was to heavy for some phones to process and to big in file
size for some advertising agencies. So that ment to create my own 2d box collision and use animations where I could.  

What is animated?  
The islands are animated and within every island there is a box that is able to collide with the player.
Every enemy there jumps are animated because colliding with the islands is not required to have a correct jump animation.
The enemy has a box collision that can collide with the player or the player spear if the player grabed the spear.
The player for what we know now collides with islands and enemies, however it collides with the chest on the island as well.
The chest will grand the player its spear wepons.

So because I did not want to place all islands by hand I implemented a world generator.
The first three islands are fixed with random tree placement and no enemy placement.
The third island has two places where the chest can stand.
All the islands that are between the first three and the last one have random enemy placement implemented.

#### Tech
**Engine / Framework:**  
• CreateJS (visual)  
• HowlerJS (audio)  
• GulpJS (building)   

**Language:**  
• JavaScript ES6+