skills.rest
SomtechSolutionMAxime
SomtechSolutionMAximeCOMMUNITY
Explore all skills by this author →
GitHub

mockmig

Orchestrate UI mockup migrations into backend and frontend modules with runbooks.

1|Updated Dec 13, 2025
Search Tags:#automation#planning#ui#migration#runbook#mockups
One-click install
npx skills add https://github.com/SomtechSolutionMAxime/somtech-pack --skill mockmig
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mockmig
Source: https://github.com/SomtechSolutionMAxime/somtech-pack/tree/main/.claude/skills/mockmig
Command: npx skills add https://github.com/SomtechSolutionMAxime/somtech-pack --skill mockmig

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Migrating UI maquettes from design artefacts into fully deployable frontend and backend structures requires extensive planning, documentation and artefacts. This skill automates that workflow, ensuring a consistent handover from mockups to production-ready code and runbooks.

Core Features & Use Cases

  • End-to-end migration planning: from validation against sources of truth to artefact generation (00_context, 01_business_rules, 07_runbook).
  • Auto-generation of backend/UI tasks, runbooks, and guard patterns to guide teams through phased deployment.
  • Use Case: when redesigning a module, generate migration artefacts and a runnable plan to implement DB changes, UI components, and guard patterns.

Quick Start

Provide a module name and path to the mockup to bootstrap the migration workflow.

Frequently Asked Questions about mockmig

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

FAQPage Schema
How do I automate migration from UI mockups to production-ready apps?▼

Automating UI mockup migration requires orchestrating end-to-end planning, validating against truth sources, and generating runbooks for backend and frontend deployment. This skill auto-generates context, business rules, gap analyses, and runnable phased deployment plans.

What is the process for generating runbooks and backend tasks from design mockups?▼

Generating runbooks from design mockups involves validating designs against truth sources, performing gap analyses, and auto-generating structured artifacts like business rules, context files, and backend/UI task documentation to guide phased deployment.

Can I use this migration planning workflow with Supabase, GitHub, and Netlify?▼

Yes, this migration planning workflow explicitly supports multi-tool stacks including Supabase, GitHub, and Netlify. It generates runnable plans and guard patterns that guide teams through backend and frontend deployments across these integrated platforms.

How do I create a runnable plan for database and UI module redesign?▼

Creating a runnable plan for module redesign requires applying structured migration planning to auto-generate backend/UI tasks, guard patterns, and deployment runbooks. This ensures consistent handover from mockups to production database changes and UI components.

What do I need to provide to bootstrap a UI to production migration workflow?▼

To bootstrap the UI to production migration workflow, you need to provide a module name and the file path to the UI mockup. This initial input allows the automated workflow to validate against truth sources and generate the required migration artifacts.

Related Skills

Explore More Software Engineering Skills→
cristiano-pachecocristiano-pacheco

go-create-enum

Generate type-safe Go enums with validation and a String method.

Community
Intermediate
Eng0AIEng0AI
15

astro-supabase-netlify

Integrate Astro projects with Supabase and deploy them to Netlify.

Official
Intermediate
mk-knight23mk-knight23
1

data-pipeline

Build and run Python ETL pipelines for CSV, JSON, Parquet, and database sources.

Community
Intermediate
quanganh208quanganh208

ck:research

Research technical solutions and architecture trade-offs, then generate timestamped Markdown reports.

Community
Advanced