DESIGNER · ENGINEER

Joangel-style Portfolio

Showing intent + craft through case studies.

What I ship: Selected work

Six projects that show how I think about systems, surface and shipping. Pick one to read the long version.

Sovereign Ledger cover

Sovereign Ledger

2026

Multi-currency personal finance OS with truthful FX and cycle-based recurring payments.

TypeScriptPostgreSQLNext.jsDomain-Driven
Pxlkit cover

Pxlkit

2026

A pixel-perfect React UI kit with 95+ primitives and a deterministic icon system.

React 19Tailwind v4StorybookOSS
TV Command Center cover

TV Command Center

2026

Ambient dashboard for a 65" TV: brief, timeline, habits, finances — all glanceable.

Next.jsServer ActionsLLMSSE
Public-Sector Registry cover

Public-Sector Registry

2025

Long-running registry platform with three user roles and a ten-year audit trail.

NestJSTypeORMReactAudit
joangel.ai cover

joangel.ai

2026

A portfolio that talks like a senior engineer and converts like a landing page.

Next.js 16Canvasi18nSEO
Brand Video Studio cover

Brand Video Studio

2025

A library of programmatic 1:1 Instagram videos rendered from a single brand spec.

RemotionWebGLMotionBranding

In depth: Case studies

The full story behind each project: why it existed, what hurt, what shipped.

Sovereign Ledger

Lead Engineer · Product
2026

Designed a sovereign ledger for an environment where exchange rates lie. Three FX columns per transaction, transfers as first-class records, atomic balance deltas with a fully audited log, and a cycle engine that turns recurring bills into linkable receivables. Shipped as 74 MCP tools + admin UI, used daily by the founder.

Sovereign Ledger screenshot

Pxlkit

Creator · Maintainer
2026

Started as a Saturday spike, grew into thousands of downloads and the first paid licenses inside a month. Built around a Surface system (pixel ↔ linear) so every primitive can switch aesthetics from one prop. The icon inspector + refinement skill turned visual QA into a repeatable loop.

Pxlkit screenshot

TV Command Center

Solo · Design-Engineer
2026

A second-brain rendered for the room, not the laptop. Three modes (ambient, brief, focus), fluid clamp() scaling 390→1920, a multi-lane timeline (events + blocks + habits) with drag-edit, and an LLM-generated daily brief that learns from yesterday. Boot-instant via stale-fallback and a warm-pool of pre-primed agents.

TV Command Center screenshot

Public-Sector Registry

Senior Full-Stack · QA Lead
2025

Inherited a brittle monolith and shipped a calmer one: split admin and inspector workflows, added a typed event log, and rebuilt the registration flow to survive flaky connections in the field. Reduced a 14-step intake to 6 screens without losing a single regulated field.

Public-Sector Registry screenshot

joangel.ai

Designer · Engineer
2026

Custom canvas effects, cinematic dark aesthetic, bilingual content, a generated CV PDF, and an AI-course funnel — all under 60kb of critical CSS. Built to be the calling card for client-facing work without smelling like a template.

joangel.ai screenshot

Brand Video Studio

Motion Engineer
2025

Eleven Remotion compositions sharing one tokens file and one motion language. Render-script CLI, deterministic seeds, and a brand-pillar mapping so every clip ships on-brand without a designer in the loop. The CRT and CCTV effects are pure shaders, no After Effects.

Brand Video Studio screenshot

Day-to-day: Tech stack

The tools I reach for first. The rest, I learn when the project asks.

TypeScriptReact 19Next.jsNestJSNode.jsPostgreSQLSupabaseTailwind v4Motion libraryRemotionDockerCloudflaretRPCVitestPlaywrightPostHogPaymentsThree.jsGSAPDesign tool

Receipts: By the numbers

Ten years of shipping in one row.

Years shipping

10+

Senior since 2020

Projects shipped

40+

Solo & with teams

OSS stars

1.2k+

Across pxlkit + tooling


Let's talk: Have a project in mind?

Drop your email and a one-liner. I reply within a day, in plain language, with what's actually possible.