arkaos 2.4.4 → 2.5.1

package/VERSION

@@ -1 +1 @@
-2.4.4
+2.5.1

package/departments/brand/skills/design-review/SKILL.md

@@ -0,0 +1,57 @@
+---
+name: brand/design-review
+description: >
+  Open a design tool (Figma, Sketch, Canva desktop) and compare live designs
+  against brand guidelines. Screenshot and annotate differences.
+  Requires Computer Use (/mcp → computer-use).
+allowed-tools: [Read, Write, Edit, Bash, Grep, Glob, Agent]
+---
+
+# Design Review — `/brand design-review`
+
+> **Agent:** Valentina (Creative Director) | Requires: Computer Use (`/mcp` → `computer-use`)
+
+## Command
+
+```
+/brand design-review <app-or-file>
+```
+
+App can be: Figma, Sketch, Canva, or a direct file path to a design file.
+
+## What It Does
+
+Opens a design tool and compares live designs against brand guidelines. Screenshots and annotates differences.
+
+## Workflow
+
+1. **Check computer-use availability** — follow [Computer Use Availability Check](/arka)
+2. **Open** the design tool or file
+3. **Navigate** to the relevant artboards/pages
+4. **Compare** against brand guidelines:
+   - Color palette accuracy (hex values, contrast)
+   - Typography (font family, sizes, weights)
+   - Spacing and layout consistency
+   - Logo usage and clear space
+   - Icon style consistency
+5. **Screenshot** each artboard with annotations of issues found
+6. **Generate report** with side-by-side comparisons
+
+## Example
+
+```
+/brand design-review Figma
+/brand design-review ~/Documents/Homepage-v3.sketch
+/brand design-review "Canva — Social Media Templates"
+```
+
+## Fallback (No Computer Use)
+
+```
+⚠ Computer Use required for design tool interaction.
+Enable via: /mcp → computer-use (macOS only, Pro/Max plan required)
+```
+
+## Output
+
+Design review report saved to Obsidian: `Projects/<ecosystem>/Brand/Reviews/<date>.md`

package/departments/brand/skills/identity-system/SKILL.md

@@ -16,3 +16,17 @@ Full brand identity: strategy, verbal, visual in the correct order (never skip t
 ## Output
 
 Complete brand identity package saved to Obsidian
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Open the website/app and verify brand elements match the identity system (colors, typography, spacing)
+- [BROWSER] Compare generated assets side-by-side with the live site
+- [BROWSER] Check favicon, og:image, and meta branding elements
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Open design tools (Figma, Canva desktop, Sketch) to verify brand assets match guidelines

package/departments/brand/skills/ux-audit/SKILL.md

@@ -16,3 +16,19 @@ UX heuristic audit: evaluate interface against Nielsen's 10 heuristics.
 ## Output
 
 Heuristic audit report with severity ratings and fix recommendations
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Navigate the site following primary user flows (onboarding, core action, checkout)
+- [BROWSER] Test accessibility: tab navigation, focus indicators, color contrast
+- [BROWSER] Capture screenshots of key screens for the UX audit report
+- [BROWSER] Check responsive design at mobile, tablet, and desktop breakpoints
+- [BROWSER] Verify loading states, error states, and empty states render correctly
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Launch the native app, test user flows, screenshot each screen for the audit report

package/departments/dev/skills/app-test/SKILL.md

@@ -0,0 +1,52 @@
+---
+name: dev/app-test
+description: >
+  Build, launch, and click through a native app (macOS or iOS Simulator).
+  Screenshot each screen, report crashes or visual issues.
+  Requires Computer Use (/mcp → computer-use).
+allowed-tools: [Read, Write, Edit, Bash, Grep, Glob, Agent]
+---
+
+# App Test — `/dev app-test`
+
+> **Agent:** Paulo (Tech Lead) | Requires: Computer Use (`/mcp` → `computer-use`)
+
+## Command
+
+```
+/dev app-test <target>
+```
+
+Target can be: Xcode build target, app bundle path, or iOS Simulator app name.
+
+## What It Does
+
+Builds, launches, and interactively tests a native application by clicking through every control and screen.
+
+## Workflow
+
+1. **Check computer-use availability** — follow [Computer Use Availability Check](/arka)
+2. **Build** the target (if source provided): `xcodebuild` or appropriate build command
+3. **Launch** the app (or open in iOS Simulator)
+4. **Click through** every tab, button, and control systematically
+5. **Screenshot** each distinct screen state
+6. **Report** findings: crashes, visual glitches, unresponsive controls, layout issues
+
+## Example
+
+```
+/dev app-test MenuBarStats
+/dev app-test /Applications/MyApp.app
+/dev app-test "My iOS App" --simulator
+```
+
+## Fallback (No Computer Use)
+
+```
+⚠ Computer Use required for native app testing.
+Enable via: /mcp → computer-use (macOS only, Pro/Max plan required)
+```
+
+## Output
+
+Test report with screenshots and issue list, saved to current directory.

package/departments/dev/skills/code-review/SKILL.md

@@ -16,3 +16,17 @@ Code review against Clean Code and SOLID. Checks naming, SRP, DIP, test coverage
 ## Output
 
 Review report: BLOCKER/WARNING/NOTE with line references and fix suggestions
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Open the application in the browser and verify UI changes visually
+- [BROWSER] Check browser console for JavaScript errors or warnings
+- [BROWSER] If CSS/layout changes: compare before/after visually
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] If native app: launch and click through UI to verify changes visually

package/departments/dev/skills/demo-gif/SKILL.md

@@ -0,0 +1,49 @@
+---
+name: dev/demo-gif
+description: >
+  Record a GIF demo of a user flow in the browser. Navigates to a URL,
+  executes described interactions, and saves the recording as a GIF file.
+  Requires browser integration (claude --chrome or /chrome).
+allowed-tools: [Read, Write, Edit, Bash, Grep, Glob, Agent, WebFetch, WebSearch]
+---
+
+# Demo GIF Recording — `/dev demo-gif`
+
+> **Agent:** Paulo (Tech Lead) | Requires: Browser integration (`/chrome`)
+
+## Command
+
+```
+/dev demo-gif <url> <flow-description>
+```
+
+## What It Does
+
+Records a GIF of a user flow in the browser for demos, documentation, or bug reports.
+
+## Workflow
+
+1. **Check browser availability** — follow [Browser Integration Pattern](/arka)
+2. **Navigate** to the provided URL
+3. **Execute the flow** step by step as described:
+   - Parse the flow description into discrete actions (click, type, navigate, scroll)
+   - Execute each action with a brief pause between steps for visual clarity
+4. **Record** the session as a GIF
+5. **Save** the GIF to the current directory with a descriptive filename
+6. **Report** file path, file size, and duration
+
+## Example
+
+```
+/dev demo-gif http://localhost:3000 "login with test@example.com, navigate to dashboard, create a new project, fill in the name 'My Project', click save"
+```
+
+## Fallback (No Browser)
+
+```
+⚠ Browser required for demo recording. Enable with: claude --chrome or /chrome
+```
+
+## Output
+
+GIF file saved to current working directory: `demo-<timestamp>.gif`

package/departments/dev/skills/security-audit/SKILL.md

@@ -67,6 +67,21 @@ Permissions-Policy: camera=(), microphone=(), geolocation=()
 ### Recommendation: BLOCK release until C1 and H1 resolved
 ```
 
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Navigate to the application and test input fields for XSS (script injection)
+- [BROWSER] Verify HTTPS is enforced (check URL bar and certificate)
+- [BROWSER] Open console and check for CSP (Content Security Policy) headers
+- [BROWSER] Test authentication flows: login, logout, session expiry
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Launch app and test input fields, permissions dialogs, and authentication flows via GUI
+
 ## References
 
 - [owasp-2025-deep.md](references/owasp-2025-deep.md) — OWASP Top 10 (2025) with vulnerable and fixed code examples, testing methodology, and tools

package/departments/dev/skills/tdd-cycle/SKILL.md

@@ -54,3 +54,16 @@ REPEAT
 | React/Next | Jest | `npx jest` |
 | Python | pytest | `python -m pytest` |
 | E2E | Playwright | `npx playwright test` |
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] After tests pass, if web app: open localhost in browser and verify the feature works visually
+- [BROWSER] Check console for runtime errors that tests might not catch
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] If native/mobile app: build, launch, and verify feature in the running app or iOS Simulator

package/departments/ecom/skills/analytics/SKILL.md

@@ -16,3 +16,18 @@ E-commerce analytics: AOV, conversion rate, CLV, ROAS, cart abandonment rate.
 ## Output
 
 Analytics dashboard with funnel visualization and benchmark comparison
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Open the store and verify GA4 tracking fires on page load (check Network tab for collect requests)
+- [BROWSER] Test conversion tracking: complete a purchase flow and verify events fire
+- [BROWSER] Check Meta Pixel fires correctly (search for fbq in console)
+- [BROWSER] Verify Google Tag Manager container loads
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Open analytics dashboards in native apps (Mixpanel, Amplitude) and verify event tracking

package/departments/ecom/skills/browse-competitor/SKILL.md

@@ -0,0 +1,55 @@
+---
+name: ecom/browse-competitor
+description: >
+  Navigate a competitor's e-commerce site and extract structured intelligence:
+  product categories, price ranges, promotions, layout patterns, and screenshots.
+  Requires browser integration (claude --chrome or /chrome).
+allowed-tools: [Read, Write, Edit, Bash, Grep, Glob, Agent, WebFetch, WebSearch]
+---
+
+# Browse Competitor — `/ecom browse-competitor`
+
+> **Agent:** Ricardo (E-Commerce Director) | Requires: Browser integration (`/chrome`)
+
+## Command
+
+```
+/ecom browse-competitor <url>
+```
+
+## What It Does
+
+Navigates a competitor's e-commerce site and extracts structured competitive intelligence.
+
+## Workflow
+
+1. **Check browser availability** — follow [Browser Integration Pattern](/arka)
+2. **Navigate** to the competitor homepage
+3. **Extract** structured data:
+   - Product categories and subcategories
+   - Price ranges (min, max, average per category)
+   - Current promotions and discounts
+   - Layout patterns (grid, list, hero sections)
+   - Navigation structure
+   - Payment methods offered
+   - Shipping information
+4. **Capture screenshots** of:
+   - Homepage
+   - A product listing page
+   - A product detail page
+   - Cart page (if accessible)
+   - Footer (payment/shipping badges)
+5. **Generate report** in Obsidian with screenshots and structured findings
+
+## Fallback (No Browser)
+
+```
+⚠ Browser not available. Using WebFetch for partial extraction.
+For full competitor analysis with screenshots, enable: /chrome
+```
+
+Falls back to WebFetch/WebSearch for basic HTML extraction (no JS rendering, no screenshots, no interaction).
+
+## Output
+
+Obsidian report: `Projects/<ecosystem>/Strategy/Competitors/<domain>.md`

package/departments/ecom/skills/store-audit/SKILL.md

@@ -16,3 +16,20 @@ Full store audit: UX, SEO, performance, content, conversion with 5 parallel agen
 ## Output
 
 Comprehensive audit report with scores per area and prioritized fixes
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Open store URL and test the full checkout flow: browse → add to cart → checkout → payment → confirmation
+- [BROWSER] Test mobile responsiveness at different viewport sizes (375px, 768px, 1024px)
+- [BROWSER] Capture screenshots of homepage, product page, cart, and checkout for the audit report
+- [BROWSER] Check page load performance via console timing (Performance API)
+- [BROWSER] Verify search functionality works correctly
+- [BROWSER] Test navigation menu and footer links
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] If mobile app: open in iOS Simulator, test purchase flow, verify responsiveness

package/departments/ops/skills/dashboard-build/SKILL.md

@@ -16,3 +16,18 @@ Operational dashboard design: select metrics, define targets, build layout.
 ## Output
 
 Dashboard spec with metrics, targets, data sources, and alert thresholds
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Open the dashboard in browser and verify all widgets render correctly
+- [BROWSER] Check that data loads and updates in real-time (if WebSocket)
+- [BROWSER] Test responsive layout at different screen sizes
+- [BROWSER] Verify charts, tables, and graphs display correct data
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Launch dashboard app and verify widgets, charts, and real-time data render correctly

package/departments/ops/skills/workflow-automate/SKILL.md

@@ -36,4 +36,18 @@ allowed-tools: [Read, Write, Edit, Agent, WebFetch]
 - Alert notification on failure (Slack/email)
 - Idempotency: safe to retry without duplicates
 
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Open the relevant web tools (Gmail, Google Calendar, ClickUp, N8N) to verify automation results
+- [BROWSER] Test the automated workflow end-to-end by triggering it and watching the result in the browser
+- [BROWSER] Verify notifications and emails arrive correctly
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Open desktop apps (Slack, Notion, calendar apps) to verify automation results
+
 ## Output → Workflow diagram + platform config + error handling spec

package/departments/strategy/skills/extract-data/SKILL.md

@@ -0,0 +1,53 @@
+---
+name: strat/extract-data
+description: >
+  Navigate a web page and extract structured data: tables, lists, prices,
+  product listings. Supports CSV, markdown, and JSON output formats.
+  Requires browser integration (claude --chrome or /chrome).
+allowed-tools: [Read, Write, Edit, Bash, Grep, Glob, Agent, WebFetch, WebSearch]
+---
+
+# Extract Data — `/strat extract-data`
+
+> **Agent:** Tomas (Chief Strategist) | Requires: Browser integration (`/chrome`)
+
+## Command
+
+```
+/strat extract-data <url> [format]
+```
+
+Formats: `csv` (default), `markdown`, `json`
+
+## What It Does
+
+Navigates a web page and extracts structured data (tables, lists, prices, repeated patterns) into a clean format.
+
+## Workflow
+
+1. **Check browser availability** — follow [Browser Integration Pattern](/arka)
+2. **Navigate** to the URL (handles JS-rendered content, pagination, infinite scroll)
+3. **Identify structured data** on the page:
+   - HTML tables
+   - Repeated list patterns (product cards, directory entries)
+   - Price/value data
+   - Tabular data rendered via JavaScript
+4. **Extract** data into structured format
+5. **Handle pagination** if detected (ask user: "Found pagination — extract all pages?")
+6. **Output** in requested format:
+   - CSV: saved to `extracted-<domain>-<timestamp>.csv`
+   - Markdown: displayed inline as table
+   - JSON: saved to `extracted-<domain>-<timestamp>.json`
+
+## Fallback (No Browser)
+
+```
+⚠ Browser not available. Using WebFetch for basic extraction.
+For interactive pages (JS-rendered, pagination), enable: /chrome
+```
+
+Falls back to WebFetch for static HTML extraction only.
+
+## Output
+
+File saved to current directory or displayed inline (markdown format).

package/departments/strategy/skills/five-forces/SKILL.md

@@ -71,4 +71,19 @@ allowed-tools: [Read, Write, Edit, Agent, WebFetch, WebSearch]
 3. ...
 ```
 
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Navigate to competitor websites and extract real-time pricing data
+- [BROWSER] Capture screenshots of competitor product pages, pricing pages, and feature comparisons
+- [BROWSER] Check competitor positioning statements and messaging from their homepage
+- [BROWSER] Extract supplier/partner information from competitor sites when available
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Open competitor native apps, screenshot UX patterns, extract feature comparisons
+
 ## Output → Obsidian: `WizardingCode/Strategy/Analysis/FIVE-FORCES-<industry>-<date>.md`

package/departments/strategy/skills/position/SKILL.md

@@ -16,3 +16,18 @@ Competitive positioning: alternatives, unique capabilities, value, target, categ
 ## Output
 
 Positioning statement + perceptual map + competitive differentiation
+
+## Browser Steps
+
+Follow the [Browser Integration Pattern](/arka) for availability checking.
+
+- [BROWSER] Visit competitor websites and extract their positioning: taglines, hero copy, value propositions
+- [BROWSER] Capture visual identity elements: color schemes, typography, imagery style
+- [BROWSER] Check social proof: testimonials, client logos, case studies
+- [BROWSER] Compare pricing pages side-by-side
+
+## Computer Use Steps
+
+Follow the [Computer Use Availability Check](/arka) for availability checking.
+
+- [COMPUTER] Launch competitor apps side-by-side, compare UI/UX, capture positioning differences

package/knowledge/ecosystems.json

@@ -1,7 +1,20 @@
 {
   "_meta": {
     "description": "ARKA OS — Project Ecosystem Registry",
-    "updated": "2026-03-15"
+    "updated": "2026-04-06"
   },
-  "ecosystems": {}
+  "ecosystems": {
+    "wizardingcode": {
+      "projects": [
+        {
+          "name": "arka-os",
+          "role": "product",
+          "stack": "Python + Node.js + React",
+          "path": "/Users/andreagroferreira/AIProjects/arka-os",
+          "skill": "/platform-arka",
+          "description": "ArkaOS — The Operating System for AI Agent Teams"
+        }
+      ]
+    }
+  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "arkaos",
-  "version": "2.4.4",
+  "version": "2.5.1",
   "description": "The Operating System for AI Agent Teams",
   "type": "module",
   "bin": {

package/pyproject.toml

@@ -1,6 +1,6 @@
 [project]
 name = "arkaos-core"
-version = "2.4.4"
+version = "2.5.1"
 description = "Core engine for ArkaOS — The Operating System for AI Agent Teams"
 readme = "README.md"
 license = {text = "MIT"}