PF
SE --:--:-- x 0000 y 0000
Pen · 6 anchors · 4 handles X 178 · Y 85

Based in Sweden
Working w/ your next vision

Design Engineer
& Interface Developer

Patrik Franzen

/* h1 · 600 · ls -0.055em · lh .88 */

/* lines cross the seam: col 3 → col 5 → col 7 */

I design interfaces and engineer the systems behind them. One person across the handoff, so nothing gets lost between the Figma file and the pull request.

The gap between the mockup & the merge is whereI work.

DesignEngineering
Typographyfont-display: swap
Gridgrid-template-columns
Motioncubic-bezier(.22,1,.36,1)
Color--token: oklch()
Auto layoutdisplay: flex; gap
Componentsprops & variants
Prototypegit push
Intuitioninstrumentation

Same decisions, two vocabularies.
I speak both, so nothing is lost in translation.

(02)Work

25—26

01 / 09 · Applanr Design System — Design system · 2026

Click to open

01 / 08

Applanr Design System

Design system · 2026 Tap to open

Index

(08)

Eight projects, each one designed and engineered by the same person. Open any row for the case.

    (03) Lab Six small instruments.
    Each one is the tool and the proof.     Drag · hover · tap

    /* h2 · lines offset by column · drift ±3vw on scroll */
    1. 01 — Pen / EasingDrag the handles
    2. 02 — Variable / WeightMove across the word

      wght400 axis100–900
    3. 03 — Smart animate / SpringChase it
      stiffness170 damping26 v0
    4. 04 — Color / ContrastWCAG 2.2

      0.00:1

      AA AAA
      #000000 #FFFFFF
    5. 05 — Mesh / RelaxTap to scatter
      n=48 iter0 relaxing
    6. 06 — Type / ScaleBase 16px
      Major third
      size16 × 1.250ⁿ n0–4

    Toolkit

    Two halves of one practice. Each tool is listed with the project where it does its best work.

    SidePracticeToolsSeen in
    DesignInterface & product designFigmaLeading Automobile Manufacturer, Applanr
    Icons, imagery & identityPhotoshop, IllustratorApplanr, Portfolio ’26
    User & task designFigma, flows, prototypesLeading Automobile Manufacturer, Applanr
    Design systemsTokens, client design systemsLeading Automobile Manufacturer, POCme
    3D & motionBlender, shadersPOCme, Digital art
    Illustration & generative artGLSL, signed-distance drawingDigital art
    EngineeringFront endTypeScript, JavaScript, React, Next.js, CSSLeading Automobile Manufacturer, POCme
    Back endGo, Node.js, GraphQL, PostgreSQLLeading Automobile Manufacturer, Applanr
    AI agentsMCP, AI coding agents, git worktreesdelegAItor, POCme
    Graphics & audioOpenGL, WebGL2, GLSL shaders, Web AudioDigital art, Portfolio ’26
    NumericsPython, NumPy, SciPyPDEKit

    Available for
    selected projects

    Write directly to:
    patrik.franzen.dennis@gmail.com

    Let’s make the handoff obsolete.