Project

General

Profile

Actions
Copy link

Task #848

closed

Task #846: PE-1200: Audition UX Redesign

PE-1202: Stat Distribution Chart

Added by Fredrick Amnehagen about 1 hour ago. Updated about 1 hour ago.

Status:
Done
Priority:
High
Assignee:
-
Target version:
Sprint 13: Audition UX Redesign
Start date:
2026-05-11
Due date:
% Done:

100%

Estimated time:

Description

As a developer configuring a persona

I want to see a visual radar/spider chart of stat balance

So that I can quickly see if my persona is balanced or specialized

Description:
Add a radar chart showing all 4 core stats:

  • Creativity, Verbosity, Patience, Formality
  • 1-10 scale on each axis
  • Shaded area showing current values
  • Optional: show "ideal" shape based on archetype

Visual design:

  • SVG-based radar chart
  • Phosphor green for filled area
  • Grid lines in phosphor/30
  • Compact size (150x150px)

Tech Notes:

  • Pure CSS/SVG, no external charting library
  • Reactive to stats object changes
  • Position: below or beside stat sliders

Story Points: 2

Acceptance Criteria:

  • Radar chart renders with 4 axes
  • Current values shown as filled polygon
  • Chart updates when any stat changes
  • Responsive sizing
Actions
Copy link
 #1

Updated by Fredrick Amnehagen about 1 hour ago

  • Priority changed from Normal to High
  • Target version set to Sprint 13: Audition UX Redesign
Actions
Copy link
 #2

Updated by Fredrick Amnehagen about 1 hour ago

  • Status changed from To do to In Progress
Actions
Copy link
 #3

Updated by Fredrick Amnehagen about 1 hour ago

  • Status changed from In Progress to Done
  • % Done changed from 0 to 100

Implemented SVG radar chart with 4 axes (Creativity, Verbosity, Patience, Formality). Shows current values as filled polygon with phosphor green. Updates on stat change. refs #848

Actions
Copy link

Also available in: Atom PDF