Justin Tiell
Portfolio

Senior Design Engineer &Frontend Architect

Bridging high-fidelity design with complex technical architecture. 10+ years experience in Identity Systems (Azure B2C) and scalable Design Systems.

Primary Proof of Work

Scribe Analytics

The Problem: Indie developers lack affordable, granular telemetry. Without knowing where players fail or which items they ignore, balancing a game is just guessing.

The Architecture: A real-time pipeline capturing high-frequency events from Godot, routed via Deno Edge Functions to a PostgreSQL/Supabase backend, and visualized through a high-performance Svelte 5 dashboard.

200%Increase in Player Play TimeData-Driven Design
Data Ingestion (Edge)

Capturing high-frequency telemetry without dropping frames via asynchronous requests to Deno Edge Functions.

.gd
Client Game
Edge Function
db
Supabase
index.ts
// Validates and routes events
switch (event_type) {
  case 'item_selected':
    validate(['level', 'name', 'ability', 'floor']);
    tableName = 'item_selected';
    insertData = {
      run_id: sanitizeString(run_id),
      chest_id: sanitizeString(body.chest_id),
      level: sanitizeInt(body.level),
      name: sanitizeString(body.name),
      date_time: new Date().toISOString()
    };
    break;
}
Performance Dashboard (Svelte 5)

Preventing race conditions via `AbortController` when game designers rapidly toggle complex version filters.

+page.svelte
async function refreshSection(section) {
  // Cancel previous fetch if still in-flight
  if (window[`currentAbortController_${section}`]) {
    window[`currentAbortController_${section}`].abort();
  }
  
  const controller = new AbortController();
  window[`currentAbortController_${section}`] = controller;

  if (section === "gameplay") {
     loadGameplayData(controller.signal);
  }
  if (section === "combat") {
     loadCombatData(controller.signal);
  }
}

Technical Expertise

Frontend Architecture

  • Next.js 15
  • Svelte 5 (Runes)
  • SvelteKit
  • TypeScript (Strict)
  • Tailwind CSS

Design Engineering

  • Design Systems
  • Radix UI
  • Framer Motion
  • Motion (Svelte)
  • Figma-to-Code

Security & Infrastructure

  • Azure AD B2C (OIDC/OAuth2)
  • Supabase
  • Deno Edge Functions
  • PostgreSQL (RLS)
  • Vercel

Experience Highlights

Identity Architect & Senior Web Developer

May 2022 - Present
Betco
  • Architected secure B2B identity flows leveraging Azure AD B2C (OIDC/OAuth2) enabling SSO across 4 disparate internal portals.
  • Designed and deployed enterprise-grade internal tooling utilizing React, Clerk, and AWS S3 for secure document distribution.
  • Managed end-to-end frontend release cycles and CI/CD pipelines via Azure DevOps for 3 corporate applications.

Design System Lead & UX Engineer

2010 - Feb 2022
Root Inc.
  • Spearheaded the creation and adoption of a unified UI component library used across 12+ internal applications.
  • Bridged the engineering-design gap by prototyping high-fidelity user flows in Figma/Adobe XD and directly implementing them in React.
  • Championed data-driven UX enhancements resulting in a 25% increase in conversion rates across primary landing pages.

The Builder Feed

Multi-Agent AI Bot Prototype

Architected and developed a functional prototype of a multi-agent AI bot with a custom orchestration layer to instantaneously answer user product queries.

OpenAILLMPrototypingSystem Architecture

Village Legend - Prototype Game

Developed a standalone rogue-lite auto-battler video game utilizing Godot 4.3 and object-oriented state management for the Ludum Dare Game Jam.

Godot 4.3Game DesignGD Script

Village Legend: Scribe

Built a companion React/Next.js dashboard for Village Legend designed to visualize the Godot telemetry data pipeline.

ReactNext.jsTailwindData Visualization

Secure File Viewer

Architected custom customer-facing tool built from scratch for EnviroZyme leveraging Clerk and AWS S3 to provide secure, controlled file-viewing access.

ClerkAWSInternal ToolingDevOps