cobogo-design-review

Review web interfaces against Cobogó Brazilian visual grammar using concept-image comparison.

1|Updated May 8, 2026
One-click install
npx skills add https://github.com/franklinbaldo/skills --skill cobogo-design-review-franklinbaldo
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: cobogo-design-review
Source: https://github.com/franklinbaldo/skills/tree/main/cobogo-design-review
Command: npx skills add https://github.com/franklinbaldo/skills --skill cobogo-design-review-franklinbaldo

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Design reviews often stall at subjective taste debates or superficial compliance checklists. This Skill provides a structured loop that generates a speculative visual concept grounded in Brazilian design grammar, captures the real rendered implementation, classifies the gaps between them, and converts validated insights into the smallest useful design-system or consumer changes. ## Core Features & Use Cases - Speculative concept-vs-reality loop: Generate a concept image from 2-4 operative Brazilian grammar ideas (Vão, Faixa, Inscrição, Ritmo), capture the real implementation in a browser, and classify each divergence as preserve-real, concept-insight, bug, grammar gap, or invented-authority rejection. - Multi-scale review: Apply the same protocol to an entire website, a page, a section, a pattern, a single component, or one component state, with a dedicated component-scale protocol covering focus, density, and repetition behavior. - Severity classification and knowledge persistence: Tag findings as P1 (canonical/accessibility violation), P2 (architecture/grammar defect), P3 (refinement), or Observation, then route reusable learning into canon rules, specimens, patterns, tests, or negative evidence. - Use Case: A team reviewing an admin dashboard suspects it looks like a generic card gallery. The Skill generates a concept using Faixa and Inscrição grammar, compares it against a real screenshot, identifies that metadata badges should become structural inscriptions, and records the validated rule back into the Cobogó corpus. ## Quick Start Ask the agent to run a Cobogó design review on a specific page or component, providing a screenshot or URL and the product job the surface must serve.

Frequently Asked Questions about cobogo-design-review

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

FAQPage Schema
How do I review a website against Brazilian design grammar?▼

State the surface's product job, select 2-4 operative grammar ideas from the Cobogó corpus, generate a speculative concept image, capture the real implementation in a browser, then classify each divergence and implement the smallest useful change. The Skill walks through this loop step by step.

How do I review a single UI component instead of a whole page?▼

Use the component-scale protocol: define the component's job in context, imagine relevant states such as focus, error, or empty, capture the real component in its representative context, and compare. Test the solution at realistic repetition density rather than in isolation.

Can generated concept images be used as design targets?▼

No. Concept images are probes that expose possibilities, not targets to match pixel-wise. Any fabricated facts in a concept, such as invented metrics, logos, or users, must be rejected as invented-authority artifacts rather than implemented.

Does this review require a specific framework like Svelte or Pico CSS?▼

No. The guardrails explicitly prohibit requiring Pico, Svelte, Astro, classless CSS, or Atomic Design unless an independent current contract demands it. The review evaluates visual grammar and product job, not framework choices.

What happens to findings after a design review?▼

Findings are classified by severity from P1 canonical violations to Observations, then persisted to the right destination: canon rules, specimens, pattern evidence, tests, ADRs, or negative evidence. Reusable knowledge must not remain only in chat or generated images.

When should I not use speculative image comparison?▼

Skip concept generation when the visual decision is not material or image generation is unavailable. For deployment verification, compare branch preview against deployed capture pixel-wise under identical conditions instead of using speculative concepts.