create-genia-os 2.4.0 → 3.0.0

package/template/.aiox-core/development/workflows/brownfield-ui.yaml

@@ -0,0 +1,258 @@
+workflow:
+  id: brownfield-ui
+  name: Brownfield UI/Frontend Enhancement
+  description: >-
+    Agent workflow for enhancing existing frontend applications with new features,
+    modernization, or design improvements. Handles existing UI analysis and safe integration.
+  type: brownfield
+  version: "1.0"
+  project_types:
+    - ui-modernization
+    - framework-migration
+    - design-refresh
+    - frontend-enhancement
+
+  metadata:
+    elicit: true
+    confirmation_required: true
+
+  phases:
+    - phase_1: UI Analysis & Planning
+    - phase_2: Document Sharding
+    - phase_3: Development Cycle
+
+  sequence:
+    - phase: 1
+      name: UI Analysis & Planning
+      description: "Analyze existing UI and create planning artifacts"
+
+    - id: architect-ui-analysis
+      step: ui_analysis
+      agent: architect
+      action: analyze existing project and use task document-project
+      creates: multiple documents per the document-project template
+      duration_estimate: "30-60 min"
+      notes: "Review existing frontend application, user feedback, analytics data, and identify improvement areas."
+
+    - id: pm-create-prd
+      agent: pm
+      creates: prd.md
+      uses: brownfield-prd-tmpl
+      duration_estimate: "30-60 min"
+      requires: existing_ui_analysis
+      notes: "Creates comprehensive PRD focused on UI enhancement with existing system analysis. SAVE OUTPUT: Copy final prd.md to your project's docs/ folder."
+
+    - id: ux-create-frontend-spec
+      agent: ux-design-expert
+      creates: front-end-spec.md
+      uses: front-end-spec-tmpl
+      duration_estimate: "30-45 min"
+      requires: prd.md
+      notes: "Creates UI/UX specification that integrates with existing design patterns. SAVE OUTPUT: Copy final front-end-spec.md to your project's docs/ folder."
+
+    - id: architect-create-architecture
+      agent: architect
+      creates: architecture.md
+      uses: brownfield-architecture-tmpl
+      duration_estimate: "30-60 min"
+      requires:
+        - prd.md
+        - front-end-spec.md
+      notes: "Creates frontend architecture with component integration strategy and migration planning. SAVE OUTPUT: Copy final architecture.md to your project's docs/ folder."
+
+    - id: po-validate-artifacts
+      agent: po
+      validates: all_artifacts
+      uses: po-master-checklist
+      duration_estimate: "15-30 min"
+      notes: "Validates all documents for UI integration safety and design consistency. May require updates to any document."
+
+    - id: po-delegate-fixes
+      agent: po
+      action: delegate_fixes
+      delegates_to: [analyst, pm, architect, ux-design-expert]
+      updates: any_flagged_documents
+      duration_estimate: "15-30 min"
+      condition: po_checklist_issues
+      notes: "If PO finds issues, PO delegates fixes to the relevant agent and re-validates updated documents in docs/ folder."
+
+    - phase: 2
+      name: Document Sharding
+      description: "Break down PRD and architecture into development-ready chunks"
+
+    - id: po-shard-documents
+      agent: po
+      action: shard_documents
+      creates: sharded_docs
+      duration_estimate: "15-30 min"
+      requires:  # all validated artifacts must be saved in project docs/ folder
+        - prd.md
+        - front-end-spec.md
+        - architecture.md
+      notes: |
+        Shard documents for IDE development:
+        - Option A: Use PO agent to shard: @po then ask to shard docs/prd.md
+        - Option B: Manual: Drag shard-doc task + docs/prd.md into chat
+        - Creates docs/prd/ and docs/architecture/ folders with sharded content
+
+    - phase: 3
+      name: Development Cycle
+      description: "Iterative story implementation with QA review"
+
+    - id: sm-create-story
+      agent: sm
+      action: create_story
+      creates: story.md
+      duration_estimate: "15-30 min"
+      requires: sharded_docs
+      repeats: for_each_epic
+      notes: |
+        Story creation cycle:
+        - SM Agent (New Chat): @sm → *create
+        - Creates next story from sharded docs
+        - Story starts in "Draft" status
+
+    - id: pm-review-draft-story
+      agent: pm
+      alternative_agent: analyst
+      action: review_draft_story
+      updates: story.md
+      duration_estimate: "10-20 min"
+      requires: story.md
+      optional: true
+      condition: user_wants_story_review
+      notes: |
+        OPTIONAL: Review and approve draft story
+        - NOTE: story-review task coming soon
+        - Review story completeness and alignment
+        - Update story status: Draft → Approved
+
+    - id: dev-implement-story
+      agent: dev
+      action: implement_story
+      creates: implementation_files
+      duration_estimate: "1-4 hours"
+      requires: story.md
+      notes: |
+        Dev Agent (New Chat): @dev
+        - Implements approved story
+        - Updates File List with all changes
+        - Marks story as "Review" when complete
+
+    - id: qa-review-implementation
+      agent: qa
+      action: review_implementation
+      updates: implementation_files
+      duration_estimate: "20-40 min"
+      requires: implementation_files
+      optional: true
+      notes: |
+        OPTIONAL: QA Agent (New Chat): @qa → review-story
+        - Senior dev review with refactoring ability
+        - Fixes small issues directly
+        - Leaves checklist for remaining items
+        - Updates story status (Review → Done or stays Review)
+
+    - id: dev-address-qa-feedback
+      agent: dev
+      action: address_qa_feedback
+      updates: implementation_files
+      requires: implementation_files
+      duration_estimate: "30-60 min"
+      condition: qa_left_unchecked_items
+      notes: |
+        If QA left unchecked items:
+        - Dev Agent (New Chat): Address remaining items
+        - Return to QA for final approval
+
+    - meta: repeat
+      target_steps: [sm-create-story, pm-review-draft-story, dev-implement-story, qa-review-implementation, dev-address-qa-feedback]
+      condition: stories_remaining
+      notes: |
+        Repeat story cycle (SM → Dev → QA) for all epic stories
+        Continue until all stories in PRD are complete
+
+    - id: po-epic-retrospective
+      agent: po
+      action: epic_retrospective
+      creates: epic-retrospective.md
+      duration_estimate: "15-30 min"
+      condition: epic_complete
+      optional: true
+      notes: |
+        OPTIONAL: After epic completion
+        - NOTE: epic-retrospective task coming soon
+        - Validate epic was completed correctly
+        - Document learnings and improvements
+
+    - meta: end
+      action: project_complete
+      notes: |
+        All stories implemented and reviewed!
+        Project development phase complete.
+
+        Reference: .aiox-core/data/aiox-kb.md#IDE Development Workflow
+
+  flow_diagram: |
+    ```mermaid
+    graph TD
+        A[Start: UI Enhancement] --> B[architect: analyze existing UI]
+        B --> C[pm: prd.md]
+        C --> D[ux-design-expert: front-end-spec.md]
+        D --> E[architect: architecture.md]
+        E --> F[po: validate with po-master-checklist]
+        F --> G{PO finds issues?}
+        G -->|Yes| H[po: delegate fixes to relevant agent]
+        G -->|No| I[po: shard documents]
+        H --> F
+
+        I --> J[sm: create story]
+        J --> K{Review draft story?}
+        K -->|Yes| L[pm/analyst: review & approve story]
+        K -->|No| M[dev: implement story]
+        L --> M
+        M --> N{QA review?}
+        N -->|Yes| O[qa: review implementation]
+        N -->|No| P{More stories?}
+        O --> Q{QA found issues?}
+        Q -->|Yes| R[dev: address QA feedback]
+        Q -->|No| P
+        R --> O
+        P -->|Yes| J
+        P -->|No| S{Epic retrospective?}
+        S -->|Yes| T[po: epic retrospective]
+        S -->|No| U[Project Complete]
+        T --> U
+
+        style U fill:#90EE90
+        style I fill:#ADD8E6
+        style J fill:#ADD8E6
+        style M fill:#ADD8E6
+        style C fill:#FFE4B5
+        style D fill:#FFE4B5
+        style E fill:#FFE4B5
+        style L fill:#F0E68C
+        style O fill:#F0E68C
+        style T fill:#F0E68C
+    ```
+
+  decision_guidance:
+    when_to_use:
+      - UI enhancement requires coordinated stories
+      - Design system changes needed
+      - New component patterns required
+      - User research and testing needed
+      - Multiple team members will work on related changes
+    when_not_to_use:
+      - New frontend from scratch (use greenfield-ui)
+      - Backend or service enhancement (use brownfield-service)
+      - Full-stack enhancement (use brownfield-fullstack)
+      - Technical debt assessment (use brownfield-discovery)
+
+  handoff_prompts:
+    architect_to_pm: "UI analysis complete. Create comprehensive PRD with UI integration strategy."
+    pm_to_ux: "PRD ready. Save it as docs/prd.md, then create the UI/UX specification."
+    ux_to_architect: "UI/UX spec complete. Save it as docs/front-end-spec.md, then create the frontend architecture."
+    architect_to_po: "Architecture complete. Save it as docs/architecture.md. Please validate all artifacts for UI integration safety."
+    po_issues: "PO found issues with [document]. Please return to [agent] to fix and re-save the updated document."
+    complete: "All planning artifacts validated and saved in docs/ folder. Move to IDE environment to begin development."

package/template/.aiox-core/development/workflows/design-system-build-quality.yaml

@@ -0,0 +1,227 @@
+workflow:
+  id: design-system-build-quality
+  name: Design System Build Quality Pipeline
+  version: "1.0"
+  description: >-
+    Pipeline pós-migração para Design System. Encadeia sequencialmente as etapas de
+    build, documentação, auditoria de acessibilidade e cálculo de ROI para garantir
+    qualidade e mensurar valor entregue.
+  type: brownfield
+  project_types:
+    - design-system
+    - component-library
+    - pattern-library
+    - ui-migration
+
+  metadata:
+    elicit: true
+    confirmation_required: true
+
+  execution_modes:
+    - mode: yolo
+      description: Execução autônoma com mínima interação
+      prompts: 0-1
+    - mode: interactive
+      description: Checkpoints de decisão e feedback educacional
+      prompts: 5-10
+      default: true
+    - mode: preflight
+      description: Planejamento completo antes da execução - análise upfront de todos os componentes e dependências
+      prompts: "10-15"
+
+  phases:
+    - phase_1: Build & Compile
+    - phase_2: Documentation
+    - phase_3: Quality Assurance
+    - phase_4: ROI Analysis
+
+  sequence:
+    - step: build_atomic_components
+      id: build
+      phase: 1
+      agent: ux-design-expert
+      action: Build de componentes atômicos
+      notes: |
+        Executa build dos componentes do Design System:
+        - Compila tokens de design (cores, tipografia, espaçamentos)
+        - Gera componentes atômicos (buttons, inputs, cards, etc.)
+        - Valida estrutura de arquivos e nomenclatura
+        - Verifica dependências e imports
+
+        Critérios de sucesso:
+        - [ ] Build completo sem erros
+        - [ ] Todos os tokens compilados
+        - [ ] Componentes exportados corretamente
+      outputs:
+        - build_report
+        - compiled_tokens
+        - component_bundle
+
+    - step: generate_documentation
+      id: document
+      phase: 2
+      agent: ux-design-expert
+      action: Gerar documentação do Pattern Library
+      requires: build
+      notes: |
+        Gera documentação completa do Pattern Library:
+        - Documenta cada componente com props e variantes
+        - Cria exemplos de uso e code snippets
+        - Gera guia de estilo visual
+        - Atualiza changelog de componentes
+
+        Critérios de sucesso:
+        - [ ] Todos os componentes documentados
+        - [ ] Exemplos de código funcionais
+        - [ ] Guia de estilo atualizado
+      outputs:
+        - pattern_library_docs
+        - component_api_reference
+        - style_guide
+
+    - step: accessibility_audit
+      id: a11y-check
+      phase: 3
+      agent: ux-design-expert
+      action: Auditoria de acessibilidade (WCAG AA)
+      requires: document
+      notes: |
+        Executa auditoria de acessibilidade WCAG 2.1 AA:
+        - Verifica contraste de cores (4.5:1 texto, 3:1 UI)
+        - Valida navegação por teclado
+        - Checa atributos ARIA e roles
+        - Testa com screen readers
+        - Verifica focus states e indicadores visuais
+
+        Critérios de sucesso:
+        - [ ] Contraste de cores aprovado
+        - [ ] Navegação por teclado funcional
+        - [ ] ARIA labels corretos
+        - [ ] Zero violações críticas WCAG AA
+      outputs:
+        - a11y_audit_report
+        - violations_list
+        - remediation_plan
+
+    - step: calculate_roi
+      id: calculate-roi
+      phase: 4
+      agent: ux-design-expert
+      action: Cálculo de ROI e savings
+      requires: a11y-check
+      notes: |
+        Calcula retorno sobre investimento do Design System:
+        - Tempo economizado em desenvolvimento
+        - Redução de inconsistências visuais
+        - Velocidade de entrega de features
+        - Custo de manutenção reduzido
+        - Métricas de reuso de componentes
+
+        Métricas a calcular:
+        - [ ] Horas dev economizadas/mês
+        - [ ] % de reuso de componentes
+        - [ ] Tempo médio para nova feature
+        - [ ] Redução de bugs visuais
+      outputs:
+        - roi_report
+        - savings_metrics
+        - adoption_dashboard
+
+    - workflow_end:
+      action: pipeline_complete
+      notes: |
+        Pipeline de qualidade completo!
+
+        Artefatos gerados:
+        - Build report e bundle de componentes
+        - Documentação do Pattern Library
+        - Relatório de acessibilidade WCAG AA
+        - Dashboard de ROI e métricas
+
+        Próximos passos sugeridos:
+        - Revisar violações de a11y identificadas
+        - Publicar nova versão do Design System
+        - Compartilhar métricas de ROI com stakeholders
+
+  flow_diagram: |
+    ```mermaid
+    graph TD
+        A[Start: Design System Quality Pipeline] --> B[ux-design-expert: Build componentes atômicos]
+        B --> C{Build OK?}
+        C -->|Sim| D[ux-design-expert: Gerar documentação Pattern Library]
+        C -->|Não| E[Corrigir erros de build]
+        E --> B
+
+        D --> F{Docs completas?}
+        F -->|Sim| G[ux-design-expert: Auditoria a11y WCAG AA]
+        F -->|Não| H[Completar documentação]
+        H --> D
+
+        G --> I{a11y aprovado?}
+        I -->|Sim| J[ux-design-expert: Calcular ROI e savings]
+        I -->|Não| K[Remediar violações]
+        K --> G
+
+        J --> L[Pipeline Completo]
+
+        style L fill:#90EE90
+        style B fill:#E6E6FA
+        style D fill:#E6E6FA
+        style G fill:#E6E6FA
+        style J fill:#E6E6FA
+        style E fill:#FFB6C1
+        style H fill:#FFB6C1
+        style K fill:#FFB6C1
+    ```
+
+  decision_guidance:
+    when_to_use:
+      - Após migração de Design System
+      - Release de nova versão do Pattern Library
+      - Auditoria periódica de qualidade
+      - Validação pré-produção de componentes
+      - Geração de métricas para stakeholders
+
+  handoff_prompts:
+    build_complete: |
+      Build de componentes concluído com sucesso.
+      Tokens compilados: {{token_count}}
+      Componentes gerados: {{component_count}}
+      Prosseguindo para documentação...
+
+    docs_complete: |
+      Documentação do Pattern Library gerada.
+      Componentes documentados: {{documented_count}}
+      Exemplos criados: {{example_count}}
+      Iniciando auditoria de acessibilidade...
+
+    a11y_complete: |
+      Auditoria de acessibilidade WCAG AA concluída.
+      Status: {{pass/fail}}
+      Violações críticas: {{critical_count}}
+      Violações menores: {{minor_count}}
+      {{if pass}}: Prosseguindo para cálculo de ROI.
+      {{if fail}}: Revisar remediation_plan antes de continuar.
+
+    pipeline_complete: |
+      Pipeline de qualidade finalizado!
+
+      Resumo:
+      - Build: {{build_status}}
+      - Documentação: {{docs_status}}
+      - Acessibilidade: {{a11y_status}}
+      - ROI calculado: {{roi_value}}
+
+      Artefatos disponíveis em outputs/design-system/
+
+metadata:
+  author: Orion (AIOX Master)
+  created_date: 2025-01-30
+  version: 1.0.0
+  tags:
+    - design-system
+    - quality-assurance
+    - accessibility
+    - documentation
+    - roi
+    - brownfield