Getting it into your agent
This one installs as part of its plugin. Adding the marketplace and installing the plugin brings it with everything else the plugin ships.
/plugin marketplace add int2t05/engineering-skills/plugin install engineering-skillsWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/int2t05/engineering-skills/design-research)<a href="https://agentmods.dev/skills/int2t05/engineering-skills/design-research"><img src="https://agentmods.dev/badge/skills/int2t05/engineering-skills/design-research/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/int2t05/engineering-skills/design-research"><img src="https://agentmods.dev/badge/skills/int2t05/engineering-skills/design-research.svg" alt="Reviewed on agentmods" width="80" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00095 | $0.01635 |
| Opus 5 | $0.00048 | $0.00817 |
| Sonnet 5 | $0.00019 | $0.00327 |
| Haiku 4.5 | $0.00010 | $0.00163 |
Grade A, and why
design-research scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 9d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 118 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Design Research
Retrieve real, published design references from free public galleries and curate them into a cited reference board that grounds downstream design work in what real products actually do — not in memory or generic AI patterns. Output is a reference board (URLs + analysis), never fabricated screenshots.
When to use
- Before
imagegenorfrontend-design, when the brief would benefit from real-market reference (how do fintech landing pages actually handle hero? how do SaaS pricing sections read?) - Researching a design pattern across real products (onboarding flows, empty states, pricing layouts)
- Grounding a style direction in what the market already ships, not internal catalogs alone
- Triggers on "design references", "real UI references", "find design inspiration", "设计参考", "真实设计参考", "找设计灵感", "设计灵感"
Not for: generating design images (use imagegen); writing frontend code (use frontend-design); image-first code pipeline (use image-to-code); cited-text market/tech research (use research market/tech-selection modes).
Steps
1. Frame the brief
Extract four dimensions that route the search:
- Domain — fintech, SaaS, AI, e-commerce, health, etc.
- Surface — landing page / user flow / visual style. This decides the source, not platform.
- Intent — feeding
imagegen(art-direction inspiration),frontend-design(style grounding), or pattern research (standalone). - Scope — how many references are enough (default 5-8; state the target).
2. Route to source
Match the surface to the source that covers it. Don't hit every source — route by surface. Full matrix and per-source details in references/sources.md.
- Landing page + industry → Lapa Ninja (Finance/SaaS/AI categories) or Craftwork public pages (Finance/E-commerce/AI)
- User flow / onboarding → Pageflows (web + mobile flows by type)
- Visual style / aesthetic → Godly/Recent (discipline: Web/Interface/Branding) or Land-book (type: E-commerce/Apps & Software)
What ships with it
4 files beside SKILL.md in the same directory: the scripts, references and assets a skill reads on demand. Not counted in the per-session cost; read them before you install if any of them is executable.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 9d ago First seen · 118 lines · 95 tokens per session scan A f3b92f317868
design-research is a skill published in the GitHub repository int2t05/engineering-skills (3 stars, last pushed 8d ago), licensed MIT. It adds 95 tokens to every session and 1,635 once invoked, about $0.0005 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-31.
Other skills, from other repositories
recipe-front-review
Reviews completed frontend implementation for governing-source compliance, scope economy, repository quality, and security, then applies user-approved React corrections.
component-api-validator
Audit component APIs for consistency, breaking changes, TypeScript coverage, and contract compliance across a component library. Trigger when someone says: component prop review, verify component types are exported, component API audit, check our component interfaces, are our props consistent, API consistency check…
pr-workflow
Crear pull requests completas con descripcion, labels y reviewers.
react-frontend
React, TypeScript, and Next.js patterns for frontend development. Use when building React components, managing state, fetching data, optimizing performance, or working with Next.js App Router. Covers React 18-19, hooks, Server Components, and type-safe patterns.
tailwind-css
Tailwind CSS v4 patterns: CSS-first config, utility classes, component variants, v3 migration. Use when styling with Tailwind, configuring @theme tokens, using tailwind-variants/CVA, migrating v3 to v4, or fixing Tailwind styles and dark mode.
testing-react
Writes React/TypeScript tests using Vitest and React Testing Library. Use when "write react tests", "vitest", "component test", "hook test", "RTL", "testing library", "snapshot test", or testing React components, hooks, and utilities.