05 / PORTFOLIO
01 / 09
← BACK ZANDER DENT
Teams Music Status FileEditViewWindow 9:41 AM
🗂Projects
Spotify
💬Teams
Microsoft Teams
Teams · Profile · Set status message
ZD
Zander Dent
● Available
Status message · set automatically by Teams Music Status
Teams Music Status app icon
Teams Music Status
Syncing
Showing in Teams
♪ House Music Till'Death by DJ Windows 7
39 of 280 characters
ⓘ Emoji above the BMP can't be typed into Teams in the background, so they're replaced (🎵 becomes ♪).
Sync Spotify to Teams
SourceSpotify Web API ⌄
Connect Spotify…
Settings…Set Up…Quit

Teams Music Status

OWN PRODUCT

Writes whatever you're playing into your Teams status, automatically. One Swift core, two platforms: presence sources and targets are protocols, so each OS gets its own write path against the same model instead of a separate app.

  1. 01Local playback
  2. 02Presence source
  3. 03macOS Accessibility API / Windows UI Automation
  4. 04Teams status, read back to verify

SWIFT · MACOS + WINDOWS · WINRT

REC00:00:00
◉ standby

Erika Cardema

FILMMAKER & EDITOR

A filmmaker's site that opens through the camera itself: a real Panasonic camcorder powers on, cranks open, and its flip-out screen wakes with her reel before pushing in to fullscreen. The masonry below reacts to how much survived the filter, off one engine shared with the stills.

Camcorder intro
A real GLB camcorder, scrubbed open frame-by-frame; the LCD is a live video texture, not a baked screen.
Filter-aware grid
Three columns holding four photos stack 2/2/0 rather than leave a dead column; under six items the grid drops to two.
Two encodes per card
A muted preview plays in view; the full clip loads only when the lightbox opens.

WEBGL (THREE.JS) · CSS MULTI-COLUMN · INTERSECTION OBSERVER

REC TWELVE WEST · 05·29·26

The Party App

Lock Phones
Unlock Vibes

150guests on Party Mode at Twelve West
0 exits · 0:00 out
TWELVE WEST
Still here
0:00
Tap ✕ to leave, crack the glass
Parties near you
Party Mode

Glass Tappers

PARTY APP · iOS + WEB

A party app that keeps guests off their phones. Leave mid-party and your glass cracks; keep ignoring it and a Live Activity pulls you back with a live count of who's out and for how long. I built the iOS app and the launch backend, Party Mode being the 1,270-line core.

The mechanic
Detects backgrounding, not a locked phone: every exit cracks the glass (drawn procedurally) and re-triggers the Live Activity. Leaving on purpose asks for a confirm tap first, so a stray touch can't drop you.
Web + backend
The launch site is a separate build on Azure Static Web Apps over Functions v4, cookies signed HMAC-SHA256 and verified in constant time; the live app runs on Supabase (Postgres, auth, storage).

SWIFT · SWIFTUI · SUPABASE · AZURE FUNCTIONS

Cybersigilism forearm tattoo
Cybersigilism · forearm · move your cursor

Inked
by Billy

Book a tattoo

Billy

TATTOO ARTIST · SAN JOSE

A booking system, not a contact form. Public intake lands in D1; a confirmed booking returns a real .ics invite. Each piece on the home page composites three depth layers off one scroll-progress property.

Three depths
Wash, plate and macro-crop separate in depth off a single --p variable; move through the frame and each drifts at its own rate.
Admin desk
An authenticated desk works each inquiry with threaded replies; no mail double-sends (Resend keyed on inquiry + event).

NEXT · WORKERS · D1 · R2 · RESEND

1 · Set the design inputs
60 mph
-4.0 %
Downgrade: gravity opposes braking
2.5 s
11.2 ft/s²
2 · Stopping sight distance
615 ft (design)
Calculated 610.3 ftReaction 220.5 ftBraking 389.8 ft
  1. Reaction distance
    dᵣ = 1.47 × V × t
  2. Braking distance
  3. Design value
    SSD = dᵣ + dʙ, rounded up to next 5 ft
TxDOT, Roadway Design Manual · 4.11.1 Stopping Sight Distance, Table 4-23. Diagram tilt exaggerated for legibility.

roadway.tools

OWN PRODUCT

Two geometry solvers on Astro with Preact islands, every result rendering its equations, substitutions and assumptions cited to the manual section each came from. The calculator to the left runs the real formula. Drag any input.

Live & cited
Every step shows the equation, the numbers substituted in, and the exact TxDOT table it comes from.
Measured daily
A launchd job snapshots Search Console, SERP and first-party telemetry each morning; changes gate on evidence and default to no.

ASTRO · WORKERS · D1 · LAUNCHD

1 · Set your priorities
Sum of weights100%
Tsolum cable-stay concept · drag to orbit
Winner: Cable-Stay · 6.75

Bridgeworks

UBC CAPSTONE · TSOLUM RIVER BRIDGE

A weighted decision matrix normalises eight priority sliders to 100% and rescores arch against suspension against cable-stay live, so every stakeholder sees which concept wins on their own weighting. Drag the sliders; the real scores are wired in.

Live rescoring
Move a slider, the weights renormalize to 100% and the winner recomputes immediately.
STL viewer
The design geometry also loads in the browser as an STL (pivot, pan, zoom) with no CAD seat.

PLOTLY · STL VIEWER · WEIGHTED MATRIX

Clara Delattre

CERAMICIST · MINNEAPOLIS

Every pot stands at true relative scale. Each frame is measured once, the pot's top and bottom stored as fractions of its height, and the build normalises across the whole body of work rather than per shelf, so a cup stays a fifth of the tallest bottle on a different row.

Measured once
Each pot's top and bottom stored as fractions of its own frame height; the shelf you see is drawn from those real numbers.
Whole-body scale
Normalised across every piece she's made, not per shelf. Her site opens dark and ramps to the paper the pots stand on.

CLOUDFLARE WORKERS · PYTHON MEDIA PIPELINE

Featured
Work

Film

Showreel

Film

Video Feature

Sports

Highlight Cut

Sports

Social Reel

Brand

Brand Film

Brand

Advertising

Edmund Zhang

CONTENT PRODUCER & SPORTS VIDEOGRAPHER

The same engine as the Cardema site, retuned for a videographer whose showreel has to lead. Hover a tile and a muted preview plays; click it and one lightbox path handles self-hosted clips and YouTube alike. Filters respect the active category.

Fluid type
Seven clamp() ramps across the whole scale, no breakpoint jumps.
One lightbox path
Self-hosted clips and YouTube embeds share the same player logic.

CSS GRID · FLUID TYPE · OBSERVER

The
Archive
08 · SKY

DK Bradford

ARCHIVE

Eleven scenes whose transitions are taken from the photographs rather than a library: horizon sweeps, sky bleeds, a court wipe, grain cuts, a drain to grey. Desktop and mobile are two genuinely different edits of one archive, all off one scroll-progress custom property published by a single shared rAF loop.

Scene transitions
Each cut is taken from a frame: a real horizon, a painted line, never a stock fade.
Two edits
Desktop and mobile are different cuts of the same archive; the ground colour is sampled from the sky in shot.

NEXT · SCROLL-DRIVEN