Design Engineering Skills — Design skill for Claude Code

Design-Engineering Skills

Cross-platform, opinionated design-engineering skills for AI coding tools — installable into Claude Code, Cursor, Codex CLI, Windsurf, Aider, Continue, and Zed.

Sibling to [heyimjames/ios-design-skills](https://github.com/heyimjames/ios-design-skills) (which is iOS-only). This marketplace is for skills that apply across platforms — web, marketing, brand, OG images, eventually more.

"Whoever made this actually gives a shit." That's the only goal.

---

What's in here

Skill	What it covers	Lines
**OG Image Design**	Technical specs (1200×630, format, sRGB, safe zone); thumbnail-survival rules (Slack-sidebar test at 200 px, minimum type sizes by surface, word-count limits); 20 composition archetypes synthesised from ~50 ogimage.gallery images (wordmark-only, headline+visual, photo/object, spec/system, stylistic, animated); design principles (typography stack, color logic, hierarchy, gestalt); AI image-generation playbook (prompt anatomy, model selection across gpt-image / Flux / Midjourney / Recraft / Ideogram, hybrid workflow); routing across Figma MCP / Paper MCP / Pencil MCP / Satori / next/og	~460

More skills coming. The repo structure is built to scale to ~5–10 cross-platform skills covering OG/social, web marketing pages, brand systems, type specimens, and similar.

---

Install

Pick your tool. One command, one place.

First-time: `chmod +x install.sh build.sh` (the script will tell you if you forgot).

Claude Code (via plugin marketplace — recommended)

In any Claude Code session:

/plugin marketplace add heyimjames/design-engineering-skills
/plugin install heyimjames-design@heyimjames-design

After install, skills are namespace-prefixed:

heyimjames-design:og-image-design

Claude Code auto-invokes each skill based on the `description` triggers, so you rarely have to type the name in conversational use.