docs: update all documentation and add AI tooling configs
- Rewrite README.md with current architecture, features and stack - Update docs/API.md with all current endpoints (corporate, BI, client 360) - Update docs/ARCHITECTURE.md with cache, modular queries, services, ETL - Update docs/GUIA-USUARIO.md for all roles (admin, corporate, agente) - Add docs/INDEX.md documentation index - Add PROJETO.md comprehensive project reference - Add BI-CCC-Implementation-Guide.md - Include AI agent configs (.claude, .agents, .gemini, _bmad) - Add netbird VPN configuration - Add status report Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,130 @@
|
||||
---
|
||||
name: 'step-01-connection-check'
|
||||
description: 'Verify html.to.design MCP server connection and guide setup if needed'
|
||||
nextStepFile: './step-02-identify-export-type.md'
|
||||
---
|
||||
|
||||
# Step 1: Connection Check and Installation
|
||||
|
||||
## STEP GOAL:
|
||||
|
||||
Verify that the html.to.design MCP server is connected and functional before proceeding with the Figma export workflow, guiding the user through setup if needed.
|
||||
|
||||
## MANDATORY EXECUTION RULES (READ FIRST):
|
||||
|
||||
### Universal Rules:
|
||||
|
||||
- 🛑 NEVER generate content without user input
|
||||
- 📖 CRITICAL: Read the complete step file before taking any action
|
||||
- 🔄 CRITICAL: When loading next step with 'C', ensure entire file is read
|
||||
- 📋 YOU ARE A FACILITATOR, not a content generator
|
||||
- ✅ YOU MUST ALWAYS SPEAK OUTPUT in your Agent communication style with the config `{communication_language}`
|
||||
|
||||
### Role Reinforcement:
|
||||
|
||||
- ✅ You are a technical integration specialist verifying the Figma export pipeline
|
||||
- ✅ If you already have been given a name, communication_style and identity, continue to use those while playing this new role
|
||||
- ✅ We engage in collaborative dialogue, not command-response
|
||||
- ✅ You bring MCP integration expertise, user brings their Figma environment setup
|
||||
- ✅ Maintain a helpful, technical tone
|
||||
|
||||
### Step-Specific Rules:
|
||||
|
||||
- 🎯 Focus ONLY on verifying MCP tool availability and connection
|
||||
- 🚫 FORBIDDEN to proceed to export without verified connection
|
||||
- 💬 If tool is not available, guide through setup or suggest alternative
|
||||
- 📋 A successful test export must be confirmed before proceeding
|
||||
|
||||
## EXECUTION PROTOCOLS:
|
||||
|
||||
- 🎯 Follow the Sequence of Instructions exactly
|
||||
- 💾 Record connection status
|
||||
- 📖 Reference Figma Plugin Setup Guide if setup is needed
|
||||
- 🚫 FORBIDDEN to skip connection verification
|
||||
|
||||
## CONTEXT BOUNDARIES:
|
||||
|
||||
- Available context: Project configuration, MCP tool availability
|
||||
- Focus: Verifying html.to.design MCP server connection
|
||||
- Limits: Do not start any export work — just verify the connection
|
||||
- Dependencies: Figma account with project access, html.to.design plugin
|
||||
|
||||
## Sequence of Instructions (Do not deviate, skip, or optimize)
|
||||
|
||||
### 1. Check MCP Tool Availability
|
||||
|
||||
Check if `mcp2_import-html` tool is accessible in current session. Tool should be from "html.to.design MCP server."
|
||||
|
||||
- If tool available: Skip to step 4 (verification)
|
||||
- If tool not available: Continue with setup guidance
|
||||
|
||||
### 2. Guide Setup (If Needed)
|
||||
|
||||
Inform user that setup requires:
|
||||
1. Figma account with project access
|
||||
2. html.to.design plugin installed in Figma
|
||||
3. MCP server configured in IDE
|
||||
|
||||
Ask: **"Would you like me to guide you through the setup process?"**
|
||||
|
||||
- If Yes: Reference the Figma Plugin Setup Guide at `../data/figma-plugin-setup.md`
|
||||
- If No: Stop workflow, suggest alternative approach
|
||||
|
||||
### 3. Verify After Setup
|
||||
|
||||
Once setup is complete, return to verification.
|
||||
|
||||
### 4. Execute Test Export
|
||||
|
||||
Execute a test export to verify connection:
|
||||
|
||||
```javascript
|
||||
mcp2_import-html({
|
||||
name: "Connection Test",
|
||||
html: "<div style='padding: 20px; background: #f0f0f0; border-radius: 8px; font-family: sans-serif;'>Connection Test Successful</div>"
|
||||
})
|
||||
```
|
||||
|
||||
Ask: **"Can you see the 'Connection Test' layer in your Figma file?"**
|
||||
|
||||
- If Yes: Connection verified
|
||||
- If No: Execute troubleshooting steps
|
||||
|
||||
### 5. Present MENU OPTIONS
|
||||
|
||||
Display: **"Select an Option:** [C] Continue"
|
||||
|
||||
#### Menu Handling Logic:
|
||||
|
||||
- IF C: Record connection as verified, then load, read entire file, then execute {nextStepFile}
|
||||
- IF Any other comments or queries: help user respond then [Redisplay Menu Options](#5-present-menu-options)
|
||||
|
||||
#### EXECUTION RULES:
|
||||
|
||||
- ALWAYS halt and wait for user input after presenting menu
|
||||
- ONLY proceed to next step when user selects 'C'
|
||||
- User can chat or ask questions — always respond and then end with display again of the menu options
|
||||
|
||||
## CRITICAL STEP COMPLETION NOTE
|
||||
|
||||
ONLY WHEN C is selected and the connection is verified will you load {nextStepFile} to begin identifying the export type.
|
||||
|
||||
---
|
||||
|
||||
## 🚨 SYSTEM SUCCESS/FAILURE METRICS
|
||||
|
||||
### ✅ SUCCESS:
|
||||
|
||||
- MCP tool availability checked
|
||||
- Connection verified with test export
|
||||
- User confirms test layer visible in Figma
|
||||
- Setup guidance provided if needed
|
||||
|
||||
### ❌ SYSTEM FAILURE:
|
||||
|
||||
- Proceeding to export without verified connection
|
||||
- Not offering setup guidance when tool is unavailable
|
||||
- Skipping test export verification
|
||||
- Not waiting for user input at menu
|
||||
|
||||
**Master Rule:** Skipping steps, optimizing sequences, or not following exact instructions is FORBIDDEN and constitutes SYSTEM FAILURE.
|
||||
@@ -0,0 +1,108 @@
|
||||
---
|
||||
name: 'step-02-identify-export-type'
|
||||
description: 'Determine the code-to-Figma export scenario type for proper ID naming and structure'
|
||||
nextStepFile: './step-03-prepare-specifications.md'
|
||||
---
|
||||
|
||||
# Step 2: Identify Code to Figma Type
|
||||
|
||||
## STEP GOAL:
|
||||
|
||||
Determine which code-to-Figma export scenario applies to the current request — Prototype Page, Design System Component, or Frontend View/Component Block — to ensure proper ID naming and structure.
|
||||
|
||||
## MANDATORY EXECUTION RULES (READ FIRST):
|
||||
|
||||
### Universal Rules:
|
||||
|
||||
- 🛑 NEVER generate content without user input
|
||||
- 📖 CRITICAL: Read the complete step file before taking any action
|
||||
- 🔄 CRITICAL: When loading next step with 'C', ensure entire file is read
|
||||
- 📋 YOU ARE A FACILITATOR, not a content generator
|
||||
- ✅ YOU MUST ALWAYS SPEAK OUTPUT in your Agent communication style with the config `{communication_language}`
|
||||
|
||||
### Role Reinforcement:
|
||||
|
||||
- ✅ You are a technical export specialist classifying the export scenario
|
||||
- ✅ If you already have been given a name, communication_style and identity, continue to use those while playing this new role
|
||||
- ✅ We engage in collaborative dialogue, not command-response
|
||||
- ✅ You bring export scenario expertise, user brings their specific export needs
|
||||
- ✅ Maintain a clear, analytical tone
|
||||
|
||||
### Step-Specific Rules:
|
||||
|
||||
- 🎯 Focus ONLY on identifying the export scenario type
|
||||
- 🚫 FORBIDDEN to start generating HTML or preparing specifications
|
||||
- 💬 Confirm scenario type with user before proceeding
|
||||
- 📋 Document the selected scenario and its ID naming pattern
|
||||
|
||||
## EXECUTION PROTOCOLS:
|
||||
|
||||
- 🎯 Follow the Sequence of Instructions exactly
|
||||
- 💾 Document selected scenario type and ID naming pattern
|
||||
- 📖 Use the decision tree to classify the request
|
||||
- 🚫 FORBIDDEN to proceed without user confirmation of scenario type
|
||||
|
||||
## CONTEXT BOUNDARIES:
|
||||
|
||||
- Available context: Verified MCP connection, user's export request
|
||||
- Focus: Classifying the export into one of three scenario types
|
||||
- Limits: Do not start HTML generation — just classify and confirm
|
||||
- Dependencies: Verified connection from Step 1
|
||||
|
||||
## Sequence of Instructions (Do not deviate, skip, or optimize)
|
||||
|
||||
### 1. Analyze User Request
|
||||
|
||||
Examine the user's request and extract: component/page name, scope (full page vs. component vs. block), purpose (design system, prototype, visual adjustment), states/variations mentioned.
|
||||
|
||||
### 2. Apply Decision Tree
|
||||
|
||||
- Full page/screen, multiple sections, user flow → **Scenario A: Prototype Page Export** (ID: `{page}-{section}-{element}`)
|
||||
- Component states, design system docs, reusable component → **Scenario B: Design System Component** (ID: `{component}-{variant}-{state}`)
|
||||
- Visual adjustments, spacing iteration, specific UI block → **Scenario C: Frontend View/Component Block** (ID: `{component}-{element}-{descriptor}`)
|
||||
- Unclear → Ask user for clarification
|
||||
|
||||
### 3. Confirm with User
|
||||
|
||||
Present the identified scenario with its description, ID naming pattern, and expected outcome. Ask: **"Proceed with this scenario, or would you like to adjust the scope?"**
|
||||
|
||||
Wait for user confirmation.
|
||||
|
||||
### 4. Present MENU OPTIONS
|
||||
|
||||
Display: **"Select an Option:** [C] Continue"
|
||||
|
||||
#### Menu Handling Logic:
|
||||
|
||||
- IF C: Save scenario type and ID pattern, then load, read entire file, then execute {nextStepFile}
|
||||
- IF Any other comments or queries: help user respond then [Redisplay Menu Options](#4-present-menu-options)
|
||||
|
||||
#### EXECUTION RULES:
|
||||
|
||||
- ALWAYS halt and wait for user input after presenting menu
|
||||
- ONLY proceed to next step when user selects 'C'
|
||||
- User can chat or ask questions — always respond and then end with display again of the menu options
|
||||
|
||||
## CRITICAL STEP COMPLETION NOTE
|
||||
|
||||
ONLY WHEN C is selected and the scenario type is confirmed will you load {nextStepFile} to begin preparing specifications.
|
||||
|
||||
---
|
||||
|
||||
## 🚨 SYSTEM SUCCESS/FAILURE METRICS
|
||||
|
||||
### ✅ SUCCESS:
|
||||
|
||||
- Export request analyzed and classified
|
||||
- Scenario type confirmed with user
|
||||
- ID naming pattern documented
|
||||
- Expected outcome communicated
|
||||
|
||||
### ❌ SYSTEM FAILURE:
|
||||
|
||||
- Starting HTML generation before scenario is confirmed
|
||||
- Not confirming scenario type with user
|
||||
- Using wrong ID naming pattern
|
||||
- Not waiting for user input at menu
|
||||
|
||||
**Master Rule:** Skipping steps, optimizing sequences, or not following exact instructions is FORBIDDEN and constitutes SYSTEM FAILURE.
|
||||
@@ -0,0 +1,120 @@
|
||||
---
|
||||
name: 'step-03-prepare-specifications'
|
||||
description: 'Locate or create specifications with OBJECT IDs for consistent Figma layer naming'
|
||||
nextStepFile: './step-04-generate-validate.md'
|
||||
---
|
||||
|
||||
# Step 3: Prepare Specifications
|
||||
|
||||
## STEP GOAL:
|
||||
|
||||
Locate existing specifications with OBJECT IDs for all components in the export scope, or create them if they do not exist, ensuring consistent Figma layer naming.
|
||||
|
||||
## MANDATORY EXECUTION RULES (READ FIRST):
|
||||
|
||||
### Universal Rules:
|
||||
|
||||
- 🛑 NEVER generate content without user input
|
||||
- 📖 CRITICAL: Read the complete step file before taking any action
|
||||
- 🔄 CRITICAL: When loading next step with 'C', ensure entire file is read
|
||||
- 📋 YOU ARE A FACILITATOR, not a content generator
|
||||
- ✅ YOU MUST ALWAYS SPEAK OUTPUT in your Agent communication style with the config `{communication_language}`
|
||||
|
||||
### Role Reinforcement:
|
||||
|
||||
- ✅ You are a specification analyst ensuring design-code parity through OBJECT IDs
|
||||
- ✅ If you already have been given a name, communication_style and identity, continue to use those while playing this new role
|
||||
- ✅ We engage in collaborative dialogue, not command-response
|
||||
- ✅ You bring specification methodology, user brings project context
|
||||
- ✅ Maintain a meticulous, detail-oriented tone
|
||||
|
||||
### Step-Specific Rules:
|
||||
|
||||
- 🎯 Focus ONLY on locating or creating specifications with OBJECT IDs
|
||||
- 🚫 FORBIDDEN to generate HTML in this step
|
||||
- 💬 Offer to reverse-engineer specifications from code if none exist
|
||||
- 📋 Achieve 100% specification coverage before proceeding
|
||||
|
||||
## EXECUTION PROTOCOLS:
|
||||
|
||||
- 🎯 Follow the Sequence of Instructions exactly
|
||||
- 💾 Document specification coverage report
|
||||
- 📖 Search in `docs/C-UX-Scenarios/` and `docs/D-Design-System/` for existing specs
|
||||
- 🚫 FORBIDDEN to proceed without OBJECT IDs for all components
|
||||
|
||||
## CONTEXT BOUNDARIES:
|
||||
|
||||
- Available context: Export scenario type, ID naming pattern from Step 2
|
||||
- Focus: Finding or creating OBJECT IDs for all components in scope
|
||||
- Limits: Do not generate HTML — just prepare the ID specifications
|
||||
- Dependencies: Confirmed scenario type from Step 2
|
||||
|
||||
## Sequence of Instructions (Do not deviate, skip, or optimize)
|
||||
|
||||
### 1. Search for Specification Documents
|
||||
|
||||
Search for specification files containing OBJECT IDs:
|
||||
- `docs/C-UX-Scenarios/` for scenario specifications
|
||||
- `docs/D-Design-System/` for component documentation
|
||||
- Search for files containing "OBJECT ID"
|
||||
- Look for markdown files matching component/page name
|
||||
|
||||
### 2. Handle Found Specifications
|
||||
|
||||
If specifications exist with OBJECT IDs: extract all OBJECT ID field values, map to components in code, store mapping for HTML generation.
|
||||
|
||||
### 3. Handle Missing Specifications
|
||||
|
||||
If no specifications exist, offer to:
|
||||
1. Analyze the code and reverse-engineer specifications
|
||||
2. Generate OBJECT IDs following project conventions
|
||||
3. Create a specification document for review
|
||||
|
||||
Reference `../data/figma-spec-preparation.md` for detailed guidance.
|
||||
|
||||
### 4. Validate Coverage
|
||||
|
||||
For each component in export scope, verify it has an OBJECT ID. Generate a coverage report showing validated components and any gaps.
|
||||
|
||||
### 5. Resolve Gaps
|
||||
|
||||
If partial coverage: offer to create missing specs or auto-generate IDs. Target 100% coverage before proceeding.
|
||||
|
||||
### 6. Present MENU OPTIONS
|
||||
|
||||
Display: **"Select an Option:** [C] Continue"
|
||||
|
||||
#### Menu Handling Logic:
|
||||
|
||||
- IF C: Save specification mapping, then load, read entire file, then execute {nextStepFile}
|
||||
- IF Any other comments or queries: help user respond then [Redisplay Menu Options](#6-present-menu-options)
|
||||
|
||||
#### EXECUTION RULES:
|
||||
|
||||
- ALWAYS halt and wait for user input after presenting menu
|
||||
- ONLY proceed to next step when user selects 'C'
|
||||
- User can chat or ask questions — always respond and then end with display again of the menu options
|
||||
|
||||
## CRITICAL STEP COMPLETION NOTE
|
||||
|
||||
ONLY WHEN C is selected and all components have OBJECT IDs will you load {nextStepFile} to begin generating and validating HTML.
|
||||
|
||||
---
|
||||
|
||||
## 🚨 SYSTEM SUCCESS/FAILURE METRICS
|
||||
|
||||
### ✅ SUCCESS:
|
||||
|
||||
- Specification search completed across all relevant locations
|
||||
- OBJECT IDs found or created for all components
|
||||
- 100% specification coverage achieved
|
||||
- Coverage report presented to user
|
||||
|
||||
### ❌ SYSTEM FAILURE:
|
||||
|
||||
- Starting HTML generation without OBJECT IDs
|
||||
- Not searching all specification locations
|
||||
- Proceeding with partial coverage without user acknowledgment
|
||||
- Not waiting for user input at menu
|
||||
|
||||
**Master Rule:** Skipping steps, optimizing sequences, or not following exact instructions is FORBIDDEN and constitutes SYSTEM FAILURE.
|
||||
@@ -0,0 +1,121 @@
|
||||
---
|
||||
name: 'step-04-generate-validate'
|
||||
description: 'Generate Figma-compatible HTML with OBJECT IDs and validate before export'
|
||||
nextStepFile: './step-05-execute-export.md'
|
||||
---
|
||||
|
||||
# Step 4: Generate and Validate
|
||||
|
||||
## STEP GOAL:
|
||||
|
||||
Generate clean, Figma-compatible HTML with proper OBJECT IDs from specifications and validate all aspects — specification coverage, ID naming, structure, styling, and content — before the export is executed.
|
||||
|
||||
## MANDATORY EXECUTION RULES (READ FIRST):
|
||||
|
||||
### Universal Rules:
|
||||
|
||||
- 🛑 NEVER generate content without user input
|
||||
- 📖 CRITICAL: Read the complete step file before taking any action
|
||||
- 🔄 CRITICAL: When loading next step with 'C', ensure entire file is read
|
||||
- 📋 YOU ARE A FACILITATOR, not a content generator
|
||||
- ✅ YOU MUST ALWAYS SPEAK OUTPUT in your Agent communication style with the config `{communication_language}`
|
||||
|
||||
### Role Reinforcement:
|
||||
|
||||
- ✅ You are a technical HTML generation specialist for Figma export
|
||||
- ✅ If you already have been given a name, communication_style and identity, continue to use those while playing this new role
|
||||
- ✅ We engage in collaborative dialogue, not command-response
|
||||
- ✅ You bring HTML/CSS-to-Figma expertise, user brings design intent
|
||||
- ✅ Maintain a precise, quality-focused tone
|
||||
|
||||
### Step-Specific Rules:
|
||||
|
||||
- 🎯 Focus on generating validated HTML with correct OBJECT IDs
|
||||
- 🚫 FORBIDDEN to execute the export in this step — validation only
|
||||
- 💬 Present validation report and resolve errors before proceeding
|
||||
- 📋 All five validation checks must pass before export
|
||||
|
||||
## EXECUTION PROTOCOLS:
|
||||
|
||||
- 🎯 Follow the Sequence of Instructions exactly
|
||||
- 💾 Generate HTML structure with proper IDs and styling
|
||||
- 📖 Convert all CSS variables to hex, rem/em to px, use Google Fonts only
|
||||
- 🚫 FORBIDDEN to proceed with validation errors unresolved
|
||||
|
||||
## CONTEXT BOUNDARIES:
|
||||
|
||||
- Available context: Specification OBJECT IDs, scenario type, ID naming pattern
|
||||
- Focus: Generating HTML and validating it for Figma compatibility
|
||||
- Limits: Do not execute the MCP export — just generate and validate
|
||||
- Dependencies: Complete OBJECT ID mapping from Step 3
|
||||
|
||||
## Sequence of Instructions (Do not deviate, skip, or optimize)
|
||||
|
||||
### 1. Generate HTML Structure
|
||||
|
||||
Create root container, state/variant containers, apply OBJECT IDs from specification mapping, include state labels, use semantic HTML tags.
|
||||
|
||||
### 2. Apply Styling Requirements
|
||||
|
||||
Convert all styles to Figma-compatible CSS:
|
||||
- Fonts: Google Fonts only, imported in style block
|
||||
- Colors: Convert CSS variables to hex values
|
||||
- Spacing: Convert rem/em to pixels
|
||||
- Layout: Inline styles or style block, simple flexbox/grid only
|
||||
|
||||
### 3. Run Validation Checks
|
||||
|
||||
Execute five validation checks:
|
||||
1. **Specification Coverage:** All components have OBJECT IDs, IDs match exactly, no duplicates
|
||||
2. **ID Naming Convention:** IDs follow project pattern, consistent naming, correct state suffixes
|
||||
3. **HTML Structure:** Semantic tags, proper hierarchy, container elements
|
||||
4. **Styling Compatibility:** Google Fonts, hex colors, pixel values, clean markup
|
||||
5. **Content Completeness:** Text matches specifications, no placeholder content
|
||||
|
||||
### 4. Present Validation Report
|
||||
|
||||
Display pass/fail for each check, list any warnings and errors.
|
||||
|
||||
### 5. Handle Validation Failures
|
||||
|
||||
If errors found: offer auto-fix (CSS variables to hex, rem to px, missing IDs), guide manual fixes (structure issues, missing content), or allow skipping problematic components.
|
||||
|
||||
### 6. Present MENU OPTIONS
|
||||
|
||||
Display: **"Select an Option:** [C] Continue"
|
||||
|
||||
#### Menu Handling Logic:
|
||||
|
||||
- IF C: Confirm validation passes, then load, read entire file, then execute {nextStepFile}
|
||||
- IF Any other comments or queries: help user respond then [Redisplay Menu Options](#6-present-menu-options)
|
||||
|
||||
#### EXECUTION RULES:
|
||||
|
||||
- ALWAYS halt and wait for user input after presenting menu
|
||||
- ONLY proceed to next step when user selects 'C'
|
||||
- User can chat or ask questions — always respond and then end with display again of the menu options
|
||||
|
||||
## CRITICAL STEP COMPLETION NOTE
|
||||
|
||||
ONLY WHEN C is selected and all validation checks pass will you load {nextStepFile} to execute the export.
|
||||
|
||||
---
|
||||
|
||||
## 🚨 SYSTEM SUCCESS/FAILURE METRICS
|
||||
|
||||
### ✅ SUCCESS:
|
||||
|
||||
- HTML generated with correct OBJECT IDs
|
||||
- All five validation checks pass
|
||||
- Figma-compatible styling applied
|
||||
- Validation report presented to user
|
||||
|
||||
### ❌ SYSTEM FAILURE:
|
||||
|
||||
- Executing export before validation passes
|
||||
- Using CSS variables instead of hex colors
|
||||
- Using rem/em instead of pixels
|
||||
- Proceeding with duplicate IDs
|
||||
- Not waiting for user input at menu
|
||||
|
||||
**Master Rule:** Skipping steps, optimizing sequences, or not following exact instructions is FORBIDDEN and constitutes SYSTEM FAILURE.
|
||||
@@ -0,0 +1,118 @@
|
||||
---
|
||||
name: 'step-05-execute-export'
|
||||
description: 'Send validated HTML to Figma via MCP and verify the export succeeded'
|
||||
workflowFile: '../workflow.md'
|
||||
---
|
||||
|
||||
# Step 5: Send to Figma
|
||||
|
||||
## STEP GOAL:
|
||||
|
||||
Execute the final export by sending validated HTML to Figma via MCP, verify the layers appear with proper OBJECT ID naming, and complete the Figma export workflow.
|
||||
|
||||
## MANDATORY EXECUTION RULES (READ FIRST):
|
||||
|
||||
### Universal Rules:
|
||||
|
||||
- 🛑 NEVER generate content without user input
|
||||
- 📖 CRITICAL: Read the complete step file before taking any action
|
||||
- 🔄 CRITICAL: When loading next step with 'C', ensure entire file is read
|
||||
- 📋 YOU ARE A FACILITATOR, not a content generator
|
||||
- ✅ YOU MUST ALWAYS SPEAK OUTPUT in your Agent communication style with the config `{communication_language}`
|
||||
|
||||
### Role Reinforcement:
|
||||
|
||||
- ✅ You are a technical export specialist executing and verifying the Figma delivery
|
||||
- ✅ If you already have been given a name, communication_style and identity, continue to use those while playing this new role
|
||||
- ✅ We engage in collaborative dialogue, not command-response
|
||||
- ✅ You bring MCP export expertise, user brings their Figma verification
|
||||
- ✅ Maintain a confident, delivery-focused tone
|
||||
|
||||
### Step-Specific Rules:
|
||||
|
||||
- 🎯 Focus on executing the export and verifying success in Figma
|
||||
- 🚫 FORBIDDEN to skip user verification of export in Figma
|
||||
- 💬 Provide troubleshooting guidance if export is not visible
|
||||
- 📋 Document complete export summary with details
|
||||
|
||||
## EXECUTION PROTOCOLS:
|
||||
|
||||
- 🎯 Follow the Sequence of Instructions exactly
|
||||
- 💾 Record export details (node ID, component count, OBJECT IDs)
|
||||
- 📖 Wait for MCP response before asking user to verify
|
||||
- 🚫 FORBIDDEN to mark workflow complete without user confirming export visible
|
||||
|
||||
## CONTEXT BOUNDARIES:
|
||||
|
||||
- Available context: Validated HTML, OBJECT IDs, scenario type
|
||||
- Focus: Executing the MCP export and verifying results
|
||||
- Limits: This is the final step — focus on delivery and verification
|
||||
- Dependencies: Validated HTML from Step 4
|
||||
|
||||
## Sequence of Instructions (Do not deviate, skip, or optimize)
|
||||
|
||||
### 1. Prepare Export Parameters
|
||||
|
||||
Set up MCP tool call: descriptive name for Figma layer (format: "{Component/Page Name} - {Purpose}"), complete validated HTML, optional intoNodeId for updating existing layer.
|
||||
|
||||
### 2. Execute Export
|
||||
|
||||
Call the MCP tool with prepared parameters. Wait for response.
|
||||
|
||||
### 3. Verify Export Response
|
||||
|
||||
Check response for success indicators: node ID returned, no error message, response contains node object.
|
||||
|
||||
### 4. User Verification
|
||||
|
||||
Ask: **"Please check your Figma file — can you see the export with proper layer names?"**
|
||||
|
||||
- If Yes: Proceed to success report
|
||||
- If No: Execute troubleshooting (check Figma is open, correct file active, layers panel, all pages, MCP connection)
|
||||
|
||||
### 5. Present Success Report
|
||||
|
||||
Display complete export details: name, node ID, component count, OBJECT IDs used, layer names in Figma.
|
||||
|
||||
### 6. Document Completion
|
||||
|
||||
Record: scenario type, components exported, OBJECT IDs used, specification files referenced, Figma output location.
|
||||
|
||||
### 7. Present MENU OPTIONS
|
||||
|
||||
Display: **"Select an Option:** [M] Return to Activity Menu"
|
||||
|
||||
#### Menu Handling Logic:
|
||||
|
||||
- IF M: Save export record, update design log, return to Activity Menu in {workflowFile}
|
||||
- IF Any other comments or queries: help user respond then [Redisplay Menu Options](#7-present-menu-options)
|
||||
|
||||
#### EXECUTION RULES:
|
||||
|
||||
- ALWAYS halt and wait for user input after presenting menu
|
||||
- User can chat or ask questions — always respond and then end with display again of the menu options
|
||||
|
||||
## CRITICAL STEP COMPLETION NOTE
|
||||
|
||||
This is the final step of the Figma Export workflow. When M is selected and the export is verified, return to the Activity Menu.
|
||||
|
||||
---
|
||||
|
||||
## 🚨 SYSTEM SUCCESS/FAILURE METRICS
|
||||
|
||||
### ✅ SUCCESS:
|
||||
|
||||
- Export executed via MCP without errors
|
||||
- User confirms export visible in Figma
|
||||
- Layer names match OBJECT IDs
|
||||
- Complete export summary documented
|
||||
- Design log updated
|
||||
|
||||
### ❌ SYSTEM FAILURE:
|
||||
|
||||
- Not verifying export with user
|
||||
- Marking complete when export failed
|
||||
- Not providing troubleshooting for invisible exports
|
||||
- Skipping export summary documentation
|
||||
|
||||
**Master Rule:** Skipping steps, optimizing sequences, or not following exact instructions is FORBIDDEN and constitutes SYSTEM FAILURE.
|
||||
Reference in New Issue
Block a user