Arbeiten

Was wir gebaut haben

Drei eigene Produkte, alle im Betrieb. Kein Kundenportfolio — was hier steht, können Sie anfassen, und der Quelltext liegt daneben.

A2 Apex

Mandantenplattformim Betrieb

Jeder Kunde bekommt einen Arbeitsbereich auf eigener Adresse, darin Laufzeiten für Modelle und Assistenten, die damit arbeiten. Eine OpenAI-kompatible Schnittstelle nach außen.

Was daran gebaut wurde

Mandantentrennung, die in jeder Abfrage Pflicht ist — nicht optional
Zugangsdaten der Laufzeiten verschlüsselt im Ruhezustand, an ihre Zeile gebunden
Ratenbegrenzung als gleitendes Fenster in Redis, atomar in einem Rundlauf
Tokenzählung je Anfrage — Grundlage für eine spätere Abrechnung
Modelle laufen in Containern auf eigener Hardware, nicht bei einem Anbieter

Technik

Next.js 16
PostgreSQL
Drizzle
Better Auth
Redis
Docker
AI SDK 7

Aus dem Quelltext

Ratenbegrenzung: ein gleitendes Fenster, atomar

local jetzt = redis.call('TIME')
local ms = tonumber(jetzt[1]) * 1000 + math.floor(tonumber(jetzt[2]) / 1000)
local fenster = tonumber(ARGV[1])
local grenze = tonumber(ARGV[2])

redis.call('ZREMRANGEBYSCORE', KEYS[1], 0, ms - fenster)
local anzahl = redis.call('ZCARD', KEYS[1])

if anzahl >= grenze then
  local aeltester = redis.call('ZRANGE', KEYS[1], 0, 0, 'WITHSCORES')
  return { 0, math.ceil((tonumber(aeltester[2]) + fenster - ms) / 1000) }
end

redis.call('ZADD', KEYS[1], ms, ms .. '-' .. anzahl)
redis.call('PEXPIRE', KEYS[1], fenster)
return { 1, 0 }

a2-apex/lib/api-grenze.ts

A2 Lumina

DesignsystemVersion 1.3.2

95 Bauteile, 171 Gestaltungsmarken, ein eigener Zeichensatz. Hell und dunkel aus einer Quelle — beide Projekte hier tragen es.

Was daran gebaut wurde

Farben, Abstände und Schriftgrade als Marken, nie als Zahl im Bauteil
`asChild` überall dort, wo ein Bauteil sonst die Bedeutung zerstört
Sichtprüfung im Bauablauf: Zehn Überlagerungen werden vor jedem Paket geöffnet
Bewegungsreduktion einmal zentral gelöst, nicht in jedem Bauteil erneut

Technik

TypeScript
React 19
Radix
Tailwind v4
tsup
Playwright

Aus dem Quelltext

`asChild`: das Bauteil gibt seine Klassen an sein Kind weiter

type MitAsChild = { asChild?: boolean };

export const Stack = React.forwardRef<
  HTMLDivElement,
  Div & MitAsChild & { weit?: boolean }
>(({ weit, asChild, className, ...rest }, ref) => {
  const Comp = asChild ? Slot.Root : 'div';
  return (
    <Comp
      ref={ref}
      className={cx(variante('a2-stack', weit && 'weit'), className)}
      {...rest}
    />
  );
});

A2-Lumina/react/src/layout.tsx

A2 Polaris

Websitediese Seite

Was Sie gerade ansehen. Zweisprachig, hell und dunkel, mit einem Farbfeld aus einem eigenen Shader und einer Figur, die Ihrem Zeiger folgt.

Was daran gebaut wurde

Ein Fragment-Shader in rohem WebGL — ohne 3D-Bibliothek, rund 4 kB
Eine Figur in three.js, in Geometrie gebaut statt als Modell geladen
Alles Schwere lädt erst bei Sicht nach und hält an, wenn niemand hinsieht
Jede Seite bleibt ohne JavaScript vollständig lesbar

Technik

Next.js 16
WebGL
three.js
Motion
Lenis
AI SDK 7

Aus dem Quelltext

Das Farbfeld: Rauschen, das sich selbst verbiegt

// Die Verzerrung: Wohin geschaut wird, entscheidet ein zweites Rauschen.
vec2 q = vec2(fbm(p + vec2(0.0, t)), fbm(p + vec2(5.2, 1.3 - t)));
vec2 r = vec2(fbm(p + 3.0 * q + vec2(1.7, 9.2) + 0.15 * t),
              fbm(p + 3.0 * q + vec2(8.3, 2.8) - 0.12 * t));

float f = fbm(p + 2.4 * r);

vec3 c = mix(u_akzent, u_zweit, clamp(length(q) * 1.1, 0.0, 1.0));
c = mix(c, u_akzent, clamp(r.x * r.x * 1.4, 0.0, 1.0));

float staerke = clamp(pow(f, 1.4) * 3.1, 0.0, 1.0) * rand * u_staerke;
farbe = vec4(c * staerke, staerke);

a2-polaris/components/bewegung/schimmer.tsx