Thom Leenman

aka CSS-Scripter (can't do css tho)

Lead Architect @ Whispp B.V.

Milestones

  1. Chess, but hexagonal! I picked HexChess back up and turned it into Chex Club, finally putting the chex.club domain I registered for it in 2024 to use. It completes what the original was missing, with the remaining draw rules and two more rulesets (McCooey's and Shafran's next to Gliński's), and adds what I had wanted to build next: a computer opponent at five difficulty levels, and post-game analysis that flags inaccuracies, mistakes and blunders and shows the best move.

    Playing a friend still works by sending them a link, and anyone else with the link can watch.

    Under the hood, a single chess engine written in Rust is compiled to WebAssembly and runs both in the browser, where it plays as the computer opponent, and on the server. The backend runs on Cloudflare Workers, with Durable Objects keeping both players in sync over WebSockets.

    • Rust
    • WebAssembly
    • Vue
    • Cloudflare Workers
    • Durable Objects
    • WebSockets

    chex.club

  2. My first go at hexagonal chess in the browser: a Vue frontend and an Express backend in TypeScript, with Socket.IO for live games, deployed with Docker on my own server.

    It implemented Gliński's rules completely, apart from a few draw rules (threefold repetition, insufficient material and the 50-move rule). You created a game and shared the link with your opponent, and after the game you could step through all the moves to see where you went wrong.

    I gave up on it halfway through a refactor towards supporting more rulesets, like McCooey's.

    • Vue
    • Pinia
    • TypeScript
    • Express
    • Socket.IO
    • Docker

    GitHub

  3. As Lead Architect I'm responsible for Whispp's infrastructure and software architecture, with a focus on on-device AI. I designed the fault-tolerant calling stack behind a product with about 9,000 registered users: the AI processing servers operate independently of the orchestration and load balancing layers, so calls in progress survive infrastructure failures. I'm also the on-call engineer for this business-critical infrastructure.

    On the device side, I develop Whispp's desktop application in Rust (Tauri), Vue, C++ and ONNX Runtime, with cross-language FFI modules for the performance-critical paths. By profiling execution providers and selecting the right backend, I brought inference latency down from 30 ms to 8 ms (averaged over 100 inferences on Ryzen AI 9 edge hardware). I also explored protecting the model itself, with proofs of concept for watermarking the model and for an obfuscation layer that hardens it against reverse engineering. These stayed proofs of concept and didn't make it into the product.

    To keep it all running, I set up the observability stack (Grafana, Prometheus, Loki and Promtail) with custom Golang instrumentation for log tracing and alerting. On top of that runs synthetic monitoring: every 30 minutes, a real call is placed in each region, audio is pushed through the pipeline and recorded at the receiving end, and the result is automatically checked against amplification and latency thresholds.

    Team awards

    • Software architecture
    • On-device AI
    • Rust
    • Tauri
    • C++
    • ONNX Runtime
    • Vue
    • TypeScript
    • Python
    • Golang
    • Grafana
    • Prometheus
    • Loki

  4. After graduating, I continued as the backend developer of Whispp's calling functionality: a real-time audio streaming pipeline for phone calls, which processes the caller's voice through the Whispp AI in-flight to make them intelligible again. It's written in TypeScript and Python.

    The AI servers pad their work into batches, which makes their GPU utilisation look the same whatever the load. That made the capacity-based routing of standard orchestrators unusable, so I built our own service discovery and load balancer, including failure detection, recovery protocols and scaling across multiple instances.

    Unit test coverage of the calling stack peaked at around 80%, and integration tests validate the end-to-end audio quality and latency in production.

    Team awards

    • TypeScript
    • Python
    • Express
    • GCP
    • Real-time audio
    • Load balancing
    • Software Testing

  5. Whispp tries to give people with a voice disorder their voice back with AI. One of their big milestones is to get this working during a phone call, so people with voice disorders can become intelligible on the phone again.

    The project assigned to me was to find a way to make these phone calls while being able to manipulate the audio server side. Additionally, I had to find an efficient way of load balancing these calls across multiple AI servers.

    The problem with load balancing across multiple AI servers is that the metrics did not expose any information about the internal load of an AI server, or how much more it could handle. As the AI runs on the GPU, anything above what it can handle simply crashes the application.

    To complete the design, I made UML diagrams of how the code bases of the different applications in play would look. Additionally, I set up a GitHub Actions workflow that empowers our software development cycle.

    • UML
    • Cloud architecture
    • GitHub Actions
    • CI/CD
    • Express
    • TypeScript

  6. I started off at Whispp mainly as a software tester, testing the iOS app that was being developed in house. Later my responsibilities expanded to creating a data collection platform to collect data for AI training (similar to Common Voice by Mozilla). Additionally, I did the research proving Whispp's marketing claims to be truthful, making Whispp eligible for the CE certificate and able to sell their product in the EU.

    • Software Testing
    • NestJS
    • Vue3
    • Research

  7. Startup Ville is an educational program of 6 months (1 semester), in which you create your own startup. The program is divided into two parts: the planning part, in which you validate whether your startup idea will work, and the creation part: building the product, marketing and finding investors.

    The idea behind Heya Social was a social platform on which people with similar interests can meet up to do something that no one in their current friend group likes to do. Shortly after Startup Ville, we stopped with Heya Social, as school and internships started taking up too much time.

    • Business skills
    • NestJS
    • React Native

  8. OneTwoModel was a startup aiming at a fair and safe environment for (starting) models. Their platform allowed models to create a portfolio and get in contact with multiple agencies at a time. This structure allowed the platform to also serve as a gateway, keeping out unfair or unsafe modelling agencies.

    During my internship, my goal was, together with Daniel, to create the admin and modelling agency portals. We both worked on the backend in NestJS, while splitting the frontend responsibilities per portal: I worked on the agency portal, while Daniel created the admin portal. We both worked in SvelteJS, to keep the number of technologies low and to keep a consistent architecture between portals.

    The goal of the agency portal was a nice user experience and easy collaboration between multiple people within an agency, taking into account their role and permissions. Although I do not fully understand the roles within a modelling agency, I was able to set up permissions in a way that allows for full customization.

    • SvelteJS
    • NestJS
    • Firebase
    • TypeScript
    • UI/UX Design
    • Software Testing

  9. There are a lot of occasions where another WhatsApp group is created with the sole purpose of storing quotes. Why not keep them in a nicely styled app that also has the sole purpose of storing quotes? Created in collaboration with my buddy Daniel (LNGZL)!

    LNGZL

  10. It's basically a font in pure (S)CSS. It started off as one of my less serious projects, and it still is one of my less serious projects.

    • CSS
    • SCSS

    pixelfont.lnmn.nlGitHub

  11. A school project, with the primary goal of setting up a CI/CD pipeline. The project itself was done in Golang and Vue, with a self-hosted GitLab CI pipeline.

    The website was meant for music bands, with the goal of easily managing sheet music. It's always a pain to search through all the sheet music until you find the correct one.

    • Golang
    • Vue
    • GitLab CI
    • CI/CD

    GitHub

  12. As a member of the education committee, I helped organize educational events for the study association, such as crash courses for first year topics and talks from companies.

  13. Teaching assistant for first and second year classes. Helped with Java, UML, Math, Web development and Database modelling.

    • Java
    • UML
    • Math
    • Angular
    • Database Design

  14. As president of the study association, I was, together with the other board members, in charge of the smooth running of the association. My main tasks were ensuring the other board members were able to do their tasks well, and helping where required. Additionally, I was 'the face' of the association: giving speeches, being the main speaker at public meetings and being the contact point for other associations and the university.

  15. A summer job creating websites in Angular and plain JavaScript.

    • Angular
    • JavaScript
    • TypeScript

  16. During this degree, I've learned about the basics of computer science, with a focus on application within the work field. The first year was focused on orientation, teaching students about the four branches they can specialize in within the degree: business data, forensics, interaction technology and software engineering. Example topics: Object oriented programming, UML design, Database design, Basic forensics & Web development.

    For the second, third and fourth year, I specialized in Software Development, diving deeper into topics like Design patterns, Full stack development, Testing and Algorithms & Data structures. We did projects twice per semester, so we could put this knowledge into practice, as well as learn collaboration and project management skills. To complete the curriculum, there was also a selection of topics shared between specializations, such as Ethics, Organisational knowledge, Database management systems and Social skills.

    The third and fourth year are divided into four semesters, which can be done in almost any order you'd like: a project of your choice, accompanied by lectures and tests; an internship; a minor; and a graduation internship. For me, the project was SyncMyMusic, the internship was done at OneTwoModel, the minor was Startup Ville, where I created Heya Social, and the graduation internship was at Whispp.

    Achievements

    • GraduatedBachelor's degree in Computer Science · Jun 2023
    • Java
    • Python
    • JavaScript
    • TypeScript
    • Golang
    • Spring Boot
    • Angular
    • Vue
    • Database Design
    • Docker
    • Software Testing
    • CI/CD
    • much more...