Squeak — three phone screens
05 — Squeak

SQUEAK★

AI-Assisted Product Workflow 2025 Product Designer · UX Designer · AI-Assisted Prototyper

Overview

Squeak is an AI-assisted product prototype that turns NYC rat reporting and avoidance into a playful civic experience. Instead of designing another formal reporting form, I used the project to explore how AI tools, emotional user segmentation, and human design judgment could work together in a fast product workflow.

The project reframes a common urban problem through a dual-mode system: one mode for users who are curious enough to document rat sightings, and another for users who are afraid of rats and simply want safer routes.

The core design question: how can one civic platform support both playful participation and emotional avoidance without forcing all users into the same experience?

AI Workflow Civic Tech Mobile UX Emotional Design Gamification
2 User Modes
AI+ Design Sprint
10 Output Elements
7 Workflow Steps
311 Replaced
0 Bureaucracy

The Problem

NYC has a rat problem everyone knows about but no one agrees how to deal with. The existing civic tool — 311 — is slow, formal, and emotionally disconnected from how people actually experience rats in the city. Some people find rats funny and shareable. Others are genuinely afraid of them. No single reporting tool served both.

The design question: how do you build one civic platform that supports playful participation and emotional avoidance without forcing all users into the same experience?

Moodboard

Research and visual reference — rat culture in NYC (data maps, street art, pop culture), competing civic apps, color palette exploration, and visual tone-setting.

Squeak moodboard — NYC rat culture, visual references, color palettes, competitive apps

Sitemap

The sitemap defined the dual-mode structure — splitting the app at onboarding into Rat Ranger and Squeak-Free Walker paths, each with distinct screens and interaction logic.

Squeak sitemap — dual-mode structure, Rat Ranger and Squeak-Free Walker flows

Personas

Two personas defined the emotional range of the product — one driven by curiosity and play, the other by anxiety and avoidance. The design had to work for both without compromise.

Persona 1 — Rat Ranger

Design System

Components and visual language built in Figma — the yellow/purple palette, UI elements, icon set, and interaction patterns that carry across both modes.

Squeak design system — components, color palette, UI elements

Final Interface

The final screens built with FigMake — loading screen, onboarding, map view, filters, and rat reporting flows across both user modes.

Squeak loading screen Onboarding Login Main map page Filter — nearby me Filter — view all Squeak rat app screen 1 Squeak rat app screen 3 Squeak rat app screen 4

Reflection

What This Proves

Squeak demonstrates my ability to integrate AI tools into a design workflow while still leading the product direction. The project shows that I can use AI for speed while applying human judgment to user segmentation, emotional design, interaction logic, and visual hierarchy. It connects to my broader practice: building systems that turn messy real-world behaviors into structured, engaging experiences.

Reflection

Squeak taught me that civic design does not always need to feel serious to be useful. Playfulness can reduce fear and make participation easier. The most important design decision was the dual-mode structure: without separating Rat Rangers from Squeak-Free Walkers, the app would have forced very different users into the same experience. AI is a fast prototyping partner that still needs strategy, editing, and emotional intelligence.

← Fanscape Next Project Suffocated★Love →