gsp-phase-transition

Render phase transition screens with progress lines, completion banner, and output file tree.

49|4|Updated Feb 20, 2026
One-click install
npx skills add https://github.com/jubscodes/get-shit-pretty --skill gsp-phase-transition
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: gsp-phase-transition
Source: https://github.com/jubscodes/get-shit-pretty/tree/main/gsp/skills/gsp-phase-transition
Command: npx skills add https://github.com/jubscodes/get-shit-pretty --skill gsp-phase-transition

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Users lack clear visual feedback when a design or project pipeline phase completes, leading to uncertainty about progress and output contents.

Core Features & Use Cases

  • Progress Line Rendering: Shows completed, current, and pending phases with styled symbols, only when multiple phases are finished.
  • Completion Banner: Displays a customizable message indicating the finished phase and its default description.
  • File Tree Generation: Reads the actual output directory, lists files in a sorted, formatted tree, and highlights the INDEX.md file.
  • Context Awareness: Determines whether the pipeline is branding or project based on STATE.md location and adapts messages accordingly.

Quick Start

Ask the skill to render the transition for the "build" phase at "./output/build".

Frequently Asked Questions about gsp-phase-transition

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

FAQPage Schema
How do I render pipeline progress screens after a project phase finishes?

To render pipeline progress screens, specify the completed phase name and its output directory. The tool reads STATE.md, generates styled progress lines, and displays a formatted terminal transition screen with the output file tree.

What is a phase transition screen for a design pipeline?

A phase transition screen is a formatted terminal display that provides visual feedback when a design pipeline phase completes. It shows a completion banner, progress lines, and a sorted file tree of the actual output directory.

How do I display an output file tree in the terminal after a build step?

To display an output file tree, provide the output directory path. The tool reads the directory, lists the actual files in a sorted, formatted tree structure, and specifically highlights the INDEX.md file within the terminal display.

Can I customize the completion banner for different project pipelines?

Yes, the completion banner is customizable. The tool determines whether the pipeline is branding or project based on the STATE.md location and adapts the default completion message and description accordingly.

When does the progress line rendering show pending and current phases?

Progress line rendering displays completed, current, and pending phases with styled symbols only when multiple phases have been finished. It requires reading the pipeline state from STATE.md to generate the correct progress lines.

Does this pipeline transition renderer require any external dependencies?

No, the pipeline transition renderer requires no external dependencies. It independently reads the provided output directory and STATE.md file to generate the formatted terminal display without needing additional components.