Case 11 / IRIS / ELISAVA

A constellation of 78 honest answers.

A participatory research website for the IRIS cohort at ELISAVA. Visitors take a 12-question survey about thinking alongside AI, are classified into one of 8 profiles, and placed as a glowing star in a live Canvas constellation of every respondent. Designed and built solo.

View live site ↗

Product: THE SURVEY
Role: Solo designer + developer
Years: 2026
Scope: Research website, solo build

The commission

A student at ELISAVA's Master in Design for Responsible AI needed a research instrument. The question under investigation — how creative practitioners actually think alongside AI, before and after the fact — was not going to survive a Google Form. A form collects data. It does not put you in a space where you might tell the truth.

The brief was honest about its constraints: a single static HTML file, no build step, deploy anywhere. What it left open was everything else. The research had 51 Tally responses already collected and needing import. It had a real launch date. And it had a design vision — something scientific and poetic at the same time, a space you enter rather than a survey you complete.

Designed and built solo. The final site runs as a Vite + TypeScript build — an explicit upgrade from the brief — with 55 real seed responses so the experience is fully offline-first even before any live database.

Twelve questions, one pacing principle

The survey runs twelve questions across five categories: how you think with AI in your own practice, how early and often AI enters your process, what you want to protect, what feels most at risk, and how you sit with the tension. Each question has a distinct control — open sliders, single-choice cards, a ranked priority set, a free-text reflection field.

The pacing was the design problem. A clinical survey reads as a form and produces calibrated answers rather than honest ones. The site asks one question at a time, full-screen, with generous whitespace and a 0.8s cubic-bezier breath between each screen. The typography is Cormorant Garamond at 28px — the weight and size of a pull quote, not a form label. Nothing snaps. Nothing confirms. You answer and the next question appears.

Eight profiles, two axes

The twelve questions reduce to a point on a two-axis plane: AI-delegation on X (how much thinking you hand off) and tension on Y (how troubled you are about doing it). From that point, one of eight profiles: The Cartographer, The Sentinel, The Astronomer, The Expedition Leader, The Navigator, The Translator, The Accelerant, The Double Agent.

The profiles are not archetypes designed to flatter. They're positions. The Cartographer draws the map herself because the act of drawing matters as much as the destination. The Double Agent has a complicated relationship with both sides. Each description reads the respondent's position back to them as honestly as the data supports — no growth language, no optimization frame.

A star in the constellation

After classification, the visitor is placed as a glowing dot in a live Canvas constellation of every respondent. The constellation renders in layers on a single full-page canvas that runs behind every screen: background stars at sub-pixel opacity, orbital rings, respondent dots colored by profile with per-frame additive glow, and finally the visitor's own star — slightly larger, pulsing — appearing in the right position for the first time.

The constellation is not a scatter plot. Background stars drift with a slow parallax. Dots repel your cursor in a motion field. Connection lines form between the visitor and their nearest profile neighbors. A floating word cloud rises from the dots, built from what respondents said they want to protect. The canvas runs at 60fps, polls Supabase for new respondents every 60 seconds, and falls back to the 55-response seed if the database is unreachable or unconfigured.

Ten metaphors for the same position

After the profile, a metaphor star sign. Ten signs map the same two-axis space at different resolution — The Cartographer might be The Boundary Keeper or The Threshold Watcher depending on where exactly they landed. Each sign comes with a name, a color, a visual mark, and a few lines that read less like a horoscope and more like a careful observation.

The star sign screen is intentionally slow. The mark draws in. The name appears. Then the description. The visitor can explore the other nine signs before moving on — to see where they nearly landed, or to find a peer.

Reading the room

The /data view renders eight aggregate visualizations of the live respondent pool: the full constellation as a static map, a profile distribution chart, metaphor prevalence, slider distributions for all five attitudinal questions, a ranked breakdown of what people want to protect, what feels most at risk, and the tension map — a 2D scatter of every respondent plotted by their x/y position before profile assignment.

All eight are hand-drawn on Canvas. No chart library. The aesthetic requires that the visualizations read as scientific instruments, not dashboards — the same design system as the rest of the site, the same cream-on-black palette, the same 300-weight typography.

What shipped

A Vite + TypeScript implementation with modular source across constellation engine, survey logic, profile classification, screen routing, and data visualization — a deliberate upgrade from the brief's single-file spec, documented in a DECISIONS.md. The offline-first seed runs 55 real Tally responses through the same code path as live Supabase data, so the site is fully functional and statistically meaningful before the database is configured.

The Tally import script is idempotent: it tags every row by source and dedupes on answer fingerprint so re-running a fresh export does not double-count. By the June 2026 presentation at ELISAVA, the live database held 78+ responses from participants across the program.

Gallery / 6 frames

iris/elisava.com

iris/elisava.com

iris/elisava.com

iris/elisava.com

iris/elisava.com

iris/elisava.com

/ space before the answer /

← Previous

IRIS / ELISAVA

Idea Grove, a living digital garden for a year of responsible AI study

Glassdoor

Design system + Employer Center