workflow-slot-canvas-movement-model

Standardize slot-based workflow canvas movement with explicit command-based reordering.

1|Updated Dec 23, 2025
One-click install
npx skills add https://github.com/jonnymuir/Umbraco.Prism --skill workflow-slot-canvas-movement-model
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: workflow-slot-canvas-movement-model
Source: https://github.com/jonnymuir/Umbraco.Prism/tree/main/.claude/skills/workflow-slot-canvas-movement-model
Command: npx skills add https://github.com/jonnymuir/Umbraco.Prism --skill workflow-slot-canvas-movement-model

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill addresses the UX fragmentation and accessibility issues that arise when managing node movement in slot-based workflow editors, preventing the common pitfall of relying solely on freeform dragging.

Core Features & Use Cases

  • Command-First Movement: Prioritizes explicit move commands (e.g., move earlier, move to lane) over free-dragging to ensure structural integrity.
  • Accessibility-First Design: Maintains a list-based structural editing surface to ensure all users can reorder stages regardless of visual canvas limitations.
  • Use Case: When building a complex multi-lane service blueprint, use this model to ensure that reordering a stage automatically updates the underlying topology without breaking the layout engine or requiring manual coordinate adjustments.

Quick Start

Apply the workflow-slot-canvas-movement-model to define the movement contract for the new service blueprint editor by implementing explicit move commands for all stage reordering actions.

Frequently Asked Questions about workflow-slot-canvas-movement-model

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement accessible node reordering in a visual workflow editor?

Accessible node reordering in a visual workflow editor is implemented by prioritizing explicit command-based movements over freeform drag-and-drop interactions. This approach uses a unified mutation path supporting keyboard, menu, and list-based interactions to maintain structural integrity.

What is the best way to manage slot movement in a multi-lane canvas without breaking the layout engine?

Managing slot movement in a multi-lane canvas without breaking the layout engine requires applying a standardized movement logic model. This model uses explicit move commands for stage reordering, ensuring the underlying topology updates automatically without manual coordinate adjustments.

How do drag-and-drop interactions affect structural integrity in slot-based workflow editors?

Drag-and-drop interactions fragment UX and compromise structural integrity in slot-based workflow editors by bypassing strict topology rules. Replacing free-dragging with a command-first movement contract ensures all reordering actions route through a unified mutation path.

Can I build a keyboard-accessible service blueprint editor that supports complex stage reordering?

Yes, you can build a keyboard-accessible service blueprint editor by implementing a list-based structural editing surface paired with explicit move commands. This ensures all users can reorder stages regardless of visual canvas limitations while maintaining consistent topological routing.

When should I avoid freeform dragging for canvas movement in interaction design?

You should avoid freeform dragging for canvas movement when accessibility and structural integrity are primary constraints. Relying solely on free-dragging creates UX fragmentation, whereas command-based reordering enforces a unified mutation path for keyboard and menu interactions.