Section 00 · HeroStatus · Booting

Heller,Manuel.

Jogge di Balla · VPBasel · CHVoir le CV

Developer · Photographer · Visual Tinkerer

Section 01 · About

Développeur full-stack qui aime aussi passer derrière l’appareil photo.

PHP et Vue le jour, Lightroom et shaders le soir.

01 / 04IdentityMMXXVI

Appareil photo, Photoshop, shaders : tout ce qui se joue entre code et image.

Je suis Manuel, de la région bâloise. Au travail, plongé dans PHP et Vue ; à côté, appareil photo, Photoshop et tout ce qui se joue entre code et image.

Depuis novembre 2021, je travaille chez zvoove Switzerland AG sur des logiciels destinés aux entreprises de travail temporaire. Je conçois et développe des interfaces Vue pour des processus complexes, des points d’accès PHP et des intégrations avec synchronisation de données.

J’assure également une suite Cypress d’environ 30 tests de validation étendus, de leur écriture et exécution à l’analyse des erreurs. La migration vers Playwright est en cours.

02 / 04Minecraft · 2014Novartis EFZ · 2016–2020zvoove · 2021–

Je veux comprendre ce qui se passe sous le capot.

Le jeu vidéo m’a amené à la programmation. J’ai monté mon propre serveur Minecraft avec des modpacks et programmé des mining turtles en Lua. Cela m’a donné envie de comprendre ce qui se passait sous le capot.

De 2016 à 2020, j’ai effectué mon apprentissage d’informaticien chez Novartis. Serveurs, réseaux et support m’ont donné des bases variées. Après le service civil, je me suis orienté vers le développement d’applications.

St. Moritz · MMXXV

Plate Nº 03

Currently

je développe: ce site et joggediballa.ch
j’expérimente avec: Codex · Claude Code
je photographie: la faune et les voitures
je conduis: une Audi S5 B8.5 (projet tuning)
je vise: le titre de champion de ping-pong chez zvoove

L’IA tape plus vite. Le dernier mot me revient.

Je travaille beaucoup avec Codex et Claude Code : skills, agents et intégrations MCP maison. L’idée, le goût et le dernier mot restent à moi, l’IA tape juste plus vite. Ce qui en sort est relu, testé et souvent reconstruit.

C’est ainsi que sont nés la plateforme du club et ce portfolio. React et TypeScript, je les connais grâce à ces projets ; design, périmètre et exploitation sont entre mes mains.

La curiosité. Et un club qui utilise vraiment le résultat.

La curiosité. J’aime essayer de nouveaux outils, peaufiner les petits détails visuels et savoir comment les choses fonctionnent. Si le club finit par vraiment utiliser le résultat, c’est encore mieux.

Hors de l'écran

Quand l'écran est éteint.

Faune · Audi S5 · vie du club · raquette à portée de main

Snapshot 2026

Camera
shooting · Sony α7 IV · wildlife
Audi S5
driving · B8.5 · projet tuning
Jogge di Balla
co-running · association · vice-président
Snow
carving · ski/snowboard · saison d'hiver
Dive
diving · certifié
Ping-Pong
chasing · titre de champion zvoove

Section 02 · Skills

Mes domaines de travail.

Ce que je fais au travail, et ce que j’ai appris à côté.

Main Stack

PHP · Vue · SQL

Des UI pour des processus métier complexes, les API derrière, et des tests de release pour que rien ne casse.

Daily Driver

PHP · Yii
Vue.js
MariaDB · MySQL
JavaScript · HTML · CSS

APIs & Testing

REST · OpenAPI
Cypress
Playwright
SQL
Code reviews

Side Projects

Appris en construisant mes propres projets. Tourne en production, mais ce n’est pas mon stack au travail.

TypeScript · ReactAI-assisted
Next.jsAI-assisted
tRPC · Drizzle ORMAI-assisted
WebGL · GLSLAI-assisted
GSAP · Three.jsAI-assisted

Tooling & Ops

Codex et Claude Code avec skills, agents et intégrations MCP personnalisés ; Linux et nginx pour mes projets auto-hébergés.

Git · GitLab
Docker
Linux · nginx
Codex · Claude Code
Skills · Agents · MCP

Design & Media

Photographie
Design web
Montage vidéo
Lightroom · Photoshop
DaVinci Resolve

Section 03 · Work

Deux projets, tous deux en ligne.

Ce site et la plateforme de notre club. Concept, design, code et hébergement : tout est de moi, Claude Code dans le terminal.

La section hero de manuelheller.dev en cinq bandes, une par caractère d'encre

manuelheller.dev · hero

MMXXVIConcept · Design · Développement · Hébergement

Ce site(Toon Fluid)

Enjeu: Un portfolio qui montre ce que je sais faire. En direct, dans le navigateur.
Ma contribution: Tout. Y compris le débogage de shaders à une heure du matin.
Résultat: Ce site. S’il saccade, dis-moi sur quel appareil.

L’encre est calculée de manière interactive sur le GPU. Des niveaux de qualité adaptent la charge à l’appareil.

Next.js
React
TypeScript
Tailwind CSS
GSAP · ScrollTrigger
Lenis
React Three Fiber
WebGL · GLSL
next-intl
Zustand

Tu y es déjà

Source

Capture de la page d'accueil publique de joggediballa.ch

joggediballa.ch · home

MMXXIV–MMXXVIConcept · Design · Fullstack · Hébergement

Jogge di Balla(Plateforme associative)

Enjeu: Réunir le site public, la gestion du club et l’organisation des événements.
Ma contribution: Conception, design, développement full-stack et exploitation continue.
Résultat: Une plateforme pour la vie du club et les soirées d’événement, de la cotisation de soutien à la commande au bar.

React
Vite
TypeScript
tRPC
Drizzle ORM
MySQL
Tailwind CSS
shadcn/ui

Case Study

joggediballa.ch

Autres projets sur GitHub

Outils, recherche et mon setup Claude Code.

Shot-Counter

Scoreboard de soirée · App desktop

Tableau de scores pour équipes avec accès par QR sur le réseau local et scores synchronisés. Application Electron pour Windows et Linux.

Vue.js
Express
SQLite
SSE
Electron

Repo & Download

Fly Connectome Sim

Connectome Sim · WIP

Je simule le connectome publié d’une drosophile. Python autour, C++ dans le noyau de calcul, chaque exécution journalisée de façon reproductible.

Python
C++
MaleCNS

Repo & Docs

Mercurius

Quant Research · Archived

Projet de recherche Python sur des stratégies de trading, avec backtests reproductibles et critères de validation fixes. Trois hypothèses rejetées, sans engager de capital réel.

Python
Alpaca
SQLite
Backtesting

Repo & Docs

claude-code-kit

Skills & Tooling pour Claude Code

Mes skills, agents et workflows pour Claude Code, y compris le workflow de revue de projet. Maintenu en continu.

Claude Code
Skills
Agents
MCP

Repo & Docs

Page d'accueil Joggediballa en vue mobile — Joggediballa · Mobile · Live

J’ai construit sur plusieurs mois une plateforme dédiée à Jogge di Balla. Elle réunit le site public, l’administration interne et les outils événementiels. Je continue à la développer et à l’exploiter.

Ma contribution

Association: Jogge di Balla
Mon rôle: Cofondateur · vice-président
Développement: Du concept à l’exploitation
Utilisation: Vie associative et événements

L’idée est née pendant la pandémie : quatre amis, peu de choses à faire, alors nous avons organisé nos propres événements décalés. Jogge di Balla est né en août 2022, avec des événements comme Schlag den Kassier, Silvester 2.0, Harassenlauf et Lotto-Party.

Cofondateur et vice-président, je participe aux événements, à la photo et à la vidéo. Et comme j’aime construire moi-même, le club a eu sa propre plateforme : je m’occupe de la conception, du développement et de l’exploitation. Gérer les membres et les donateurs, analyser les présences, transmettre les commandes à la cuisine et au bar : aujourd’hui, tout passe par là.

Stack Notes

React · Vite·Frontend & Build
TypeScript·Langage (fullstack)
tRPC·Couche API
Drizzle ORM · MySQL·Base de données
Tailwind CSS · shadcn/ui·Styling & composants

Tableau de bord admin avec card de permissions et liste des membres — Tableau de bord admin · Daily Driver

Point fort 01 · Gestion et événements

Gestion, caisse et stream dans une seule app

Gestion des membres et organisation des événements passent par la même plateforme, avec les mêmes rôles.

Permissions et membres
Droits configurables par rôle, membres de soutien avec statut de paiement et suivi des présences répondent aux besoins quotidiens de l’association.
Commandes et caisse
Les prix viennent du serveur, jamais du client. Les commandes figent les données de leurs articles, pour qu’un changement de prix ne modifie aucune ancienne facture.
Médias et événements
Le traitement des images et un diaporama modéré en direct complètent la gestion des événements, les statistiques et les outils de diffusion.

Overlay Twitch en stream avec score live et design de l'association — Schlag-den-Kassier · Live stream

Point fort 02 · Événement en direct

«Schlag den Kassier» en direct

Un exemple des outils événementiels : l’habillage affiche les scores et l’identité visuelle de l’association pendant la diffusion.

Commande dans le navigateur
Un panneau distinct pilote l’affichage intégré à OBS comme source de navigateur.
Scores synchronisés
L’habillage récupère régulièrement les scores et actualise l’affichage sans rechargement.
Calculer pour le public
Affichage du gagnant et calcul du moment où une avance devient irrattrapable, pour que l’animation n’ait pas à compter de tête.

Ce que j’ai appris

Une vraie association est le meilleur testeur QA : chaque événement trouve un nouveau edge case. D'où les tests automatisés. Le serveur root derrière, je le configure et l'administre moi-même.

Live en servicejoggediballa.ch

Point fort 01 · Gestion et événements

Gestion, caisse et stream dans une seule app

Gestion des membres et organisation des événements passent par la même plateforme, avec les mêmes rôles.

Permissions et membres
Droits configurables par rôle, membres de soutien avec statut de paiement et suivi des présences répondent aux besoins quotidiens de l’association.
Commandes et caisse
Les prix viennent du serveur, jamais du client. Les commandes figent les données de leurs articles, pour qu’un changement de prix ne modifie aucune ancienne facture.
Médias et événements
Le traitement des images et un diaporama modéré en direct complètent la gestion des événements, les statistiques et les outils de diffusion.

Section 05 · Photography

Des animaux et des voitures. Aucun ne tient en place.

Pour les animaux, je pars seul au Costa Rica ou en Thaïlande et j’attends ; les voitures sont en général plus près. Les deux demandent de la patience et la bonne lumière. Avec le Sony α7 IV depuis 2023.

SONY α7 IV · 24–600mm · depuis 2023

Pélican en vol au-dessus du Pacifique, Costa Rica — MANUEL ANTONIO · 2024 · WILDLIFE01 / 5

02 / 5

Arrêt à 30 km/h.

La vitesse d’obturation n’avait aucune importance. La lumière sous l’arche a duré cinq minutes, puis elle a disparu.

Hypercar Koenigsegg sous une arche d'hôtel au crépuscule — ST. MORITZ · 2025 · AUTO02 / 5

Cargos sous une formation nuageuse spectaculaire à l'horizon — COSTA RICA · 2024 · SEASCAPE03 / 5

Arbre solitaire au bord d'un lac, reflet dans l'eau, Costa Rica — LAKE ARENAL · 2024 · LANDSCAPE04 / 5

04 / 5

Une heure et demie sans vent.

Lake Arenal : attendu jusqu’à ce que le vent laisse enfin l’eau devenir lisse. L’arbre n’est qu’un prétexte pour le reflet.

Crocodile avec un papillon sur le museau, Costa Rica — TÁRCOLES · 2024 · WILDLIFE05 / 5

Plus de photographiemanuelheller.myportfolio.com

Section 06 · Playground

Là où la simulation de fluide a le droit de jouer.

Deux expériences shader avec la même encre que dans le hero. Ici, on clique jusqu’à ce que ça saccade.

01 · INK DROP STUDIO

Ink Drop Studio

Feuille blanche. Un clic dépose de l'encre dans la spot color actuelle, les sliders règlent la physique, BOMB sème le chaos, FREEZE fige tout.

02 · TYPE-AS-FLUID

Type-as-Fluid

Tape un mot. Il s'imprime, puis se fait avaler par l'encre. Tout en douceur.

Section 07 · Contact

Écris-moi.

Une idée, une question, un conseil photo ou juste un bonjour : ma boîte mail est ouverte.

En bref

Je recherche un poste à plein temps dans la région de Bâle, en Argovie ou à Zurich. Idéalement là où développement et design se pensent ensemble et où Claude Code dans le terminal est normal.

Channels

E-mail: manuelheller [at] bluewin.ch
GitHub: github.com/manu-brighter
LinkedIn: linkedin.com/in/manuel-heller
Photos: manuelheller.myportfolio.com
CV: manuelheller.dev/cv

Heller,HHHeeelllllleeerrr,,, / Manuel.MMMaaannnuuueeelll...

Currently

PHP · Vue · SQLPPPHHHPPP ··· VVVuuueee ··· SSSQQQLLL

Ce site(Toon Fluid)

Jogge di Balla(Plateforme associative)

Autres projets sur GitHub

Shot-Counter

Fly Connectome Sim

Mercurius

claude-code-kit

Une idée de club devenue plateforme.

Ma contribution

Stack Notes

Gestion, caisse et stream dans une seule app

«Schlag den Kassier» en direct

Arrêt à 30 km/h.

Une heure et demie sans vent.

Ink Drop Studio

Type-as-Fluid

Heller,Manuel.

PHP · Vue · SQL