← Cycles
Qpixel · c1

Editor Refinements

archivedcreated 2026-04-15· last activity 2026-04-15

Why

The editor needed UX polish and missing features to be usable for real work — grid was hard to see, no preview, no way to save/load items, and limited tooling.

Objective

Refine the editor with visual fixes, new tools, a live preview, and a library system for saving and organizing items.

Scope

  • Grid visibility
  • Live preview panel
  • New tools (recolor, brush size)
  • Item library with localStorage persistence + JSON import/export
  • Canvas size controls

Key Changes

  • Grid lines brightened — border opacity 0.04 → 0.10
  • Live preview — upper-right panel with adjustable font size (1–60px)
  • Recolor tool — change cell color without changing character
  • Brush size — slider (1–5) with hover preview overlay on grid
  • Library system — localStorage-based with folders, save/load/delete/download/import
  • Grid size sliders — replaced dropdown with row/col range sliders in bottom bar
  • Layout — grid left-aligned, library sidebar on left, preview upper-right

Outcome

Editor is now a functional tool with persistence. Items can be saved to localStorage, organized into folders, downloaded as JSON for file-based persistence, and imported back. Multiple brush sizes and recolor tool make painting faster.

Artifacts

Qpoint Brand Style Guide