복고풍 픽셀 스타일의 세 장면 영상을 Hyperframes용 HTML로 만듭니다. 제목과 색상을 바꾸고 장면 전환과 움직임을 갖춘 구성으로 완성합니다.
- 픽셀 스타일의 소개 영상을 만들 때
- 세 장면 영상의 내용을 교체할 때
- HTML에서 장면 전환을 확인할 때
OpenDesign에 기존 스킬과 디자인 시스템을 기여하고 문서를 번역·수정하거나 버그를 보고하도록 돕습니다. 내용 검증부터 변경 제안과 보고서 작성까지 안내합니다.
One-click contribution flow for OpenDesign (nexu-io/open-design) — even for non-coders. Pick one of four cards (ship a Skill or Design System you made with OD; translate docs; fix a typo / write a blog; report a bug), the agent validates and opens a PR (or issue) for you. Trigger words contribute to open design, ship my OD skill, ship my OD design system, translate OD docs, report an OD bug, od-contribute.
od-contribute는 프로그래밍 경험이 없는 사람도 따라갈 수 있는 절차로 OpenDesign 기여를 돕습니다. 기존 스킬과 디자인 시스템 제출, 문서 번역, 오탈자와 링크 수정, 블로그와 사례 글 작성, 버그 보고를 지원합니다. 내용에 맞게 검증하고, 변경을 제안하는 PR이나 문제를 기록하는 Issue를 만듭니다.
OpenDesign으로 만든 결과물을 공유하거나 번역과 문서 수정부터 기여를 시작할 때 유용합니다. 누락되거나 오래된 번역, 작은 문서 수정 후보도 찾습니다. 버그 보고에서는 재현 절차와 기대한 동작을 정리하고 관련된 기존 보고를 확인합니다.
OpenDesign에 대한 기여만 다룹니다. GitHub CLI 설치와 인증 등 사전 조건을 확인하며, PR 제출 전에는 사용자의 명시적 확인이 필요합니다. 대화는 사용자 언어로 진행하지만 PR과 Issue 본문, 커밋 메시지 등은 영어로 작성합니다. 코드 기능 추가, 코드 버그 수정, 새로운 결과물 생성은 범위에 포함되지 않습니다.
이 소개문은 공개된 SKILL.md를 바탕으로 AI(OpenAI Codex)가 작성했습니다. 정확한 사양은 아래 원문을 확인하세요.
AI가 SKILL.md의 내용만을 근거로 4가지 관점에서 판정했습니다. 스타 수나 인기도는 판정에 넣지 않았습니다.
총점은 각 항목을 A=25점, B=15점, C=5점으로 더한 값입니다. 2026년 10월 20일 기준으로 AI(OpenAI Codex)가 판정했습니다. 참고용이므로 설치 전에 원문도 확인해 주세요.
설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.
Locked to nexu-io/open-design. Branches by contribution type, not by issue. Replaces the dev-loop with type-specific no-code validators. Designed so a product user with zero coding background can ship a real PR.
Mirror the user's language in every user-facing message — AskUserQuestion labels and descriptions, status updates, error explanations. Detect from their first message; when uncertain, default to English.
Generated artifacts (PR titles, commit messages, PR/issue body files, branch names) MUST be English regardless of the user's chat language. GitHub conventions, maintainer review, and search all assume English. The templates under templates/ are already English — keep them that way when rendering.
Scripts live under scripts/. Source the shared helpers from any script:
source "$(dirname "$0")/config.sh"
SKILL_DIR below = the directory that contains this SKILL.md.
bash "$SKILL_DIR/scripts/check-prereqs.sh"
GH_USER=<login> from stdout. Default TARGET_FORK="${GH_USER}/open-design".If gh repo view "$TARGET_FORK" fails, ask the user (one AskUserQuestion) whether to fork now via gh repo fork nexu-io/open-design --clone=false. Default to yes.
Single AskUserQuestion (header: "Contribution", multiSelect: false), four options. Translate option labels/descriptions into the user's chat language; the branch routing is unchanged.
3a3b3c3d (issue path, no PR)Each branch below is self-contained. Steps 7–8 (preview + push) are shared across branches 3a/3b/3c. Branch 3d skips them entirely.
3a.1 Ask user: "What's the local path to the artifact you want to ship?" (single free-text, translated into the user's chat language). Common: a folder path (Skill) or a single DESIGN.md file (Design System).
3a.2 Sniff type:
# Skill: folder containing SKILL.md with frontmatter.
# Design System: file matching DESIGN.md anatomy.
If ambiguous, ask the user to confirm.
3a.3 Run setup:
bash "$SKILL_DIR/scripts/setup-workspace.sh" skill <slug>
# or
bash "$SKILL_DIR/scripts/setup-workspace.sh" design-system <slug>
<slug> is od::slugify of the Skill name frontmatter field or of the brand name. Capture WORKDIR from stdout.
3a.4 Copy artifact into workspace at the right target dir:
$WORKDIR/skills/<slug>/$WORKDIR/design-systems/<brand-slug>/DESIGN.md (+ any sibling assets in the same folder)3a.5 Validate:
bash "$SKILL_DIR/scripts/validate-skill-submission.sh" "$WORKDIR/skills/<slug>"
# or, with 1-2 reference DESIGN.md files passed in:
bash "$SKILL_DIR/scripts/validate-design-system.sh" \
"$WORKDIR/design-systems/<slug>/DESIGN.md" \
--reference "$WORKDIR/design-systems/airbnb/DESIGN.md" \
--reference "$WORKDIR/design-systems/apple/DESIGN.md"
If validation fails, surface the FAIL lines verbatim, ask the user to fix, retry. Never push a failing artifact.
3a.6 Ask 3 short questions via AskUserQuestion (translate the labels into the user's chat language):
3a.7 Render templates/PR-BODY-skill.md (or PR-BODY-design-system.md) with substitutions:
{{SKILL_NAME}}, {{SKILL_SLUG}} (or {{BRAND_NAME}}, {{BRAND_SLUG}}){{PITCH}} (the one-line){{MOTIVATION}} (free-text — agent can offer to draft this from the skill body, but user confirms){{TRY_PROMPT}} (a prompt they recommend trying — agent suggests a default, user confirms){{SCREENSHOT_BLOCK}} (Markdown image block if a screenshot path was given, else empty){{DISCORD_INVITE}} from $OD_DISCORD_INVITEWrite to $WORKDIR/.od-contrib/PR-BODY.md.
→ Jump to Step 7.
3b.1 Setup workspace (slug = translate-<doc>-<lang> if known, else translate):
bash "$SKILL_DIR/scripts/setup-workspace.sh" i18n translate
# capture WORKDIR
3b.2 Discover gaps:
bash "$SKILL_DIR/scripts/discover-i18n-gaps.sh" "$WORKDIR" > /tmp/od-i18n-gaps.json
Each line is JSON. Rank by:
status: "missing" first (missing language is highest leverage)status: "stale" ordered by english_commits_since_translation desc3b.3 Take the top 3–4 gaps and present via AskUserQuestion (header: "Translation target"). Each option label like: README → 한국어 (Korean) / QUICKSTART (zh-CN) refresh — 12 commits behind. Translate the header text into the user's chat language but keep the option labels descriptive (the language names belong in their native script).
3b.4 Once user picks, rename branch to be specific:
git -C "$WORKDIR" branch -m "od-contrib/i18n/<doc>-<lang>-<date>"
(or pre-set the slug in step 3b.1 if the user confirmed earlier.)
3b.5 Translate. Read the English source. Translate structure-preserving:
Write the result to $WORKDIR/<TRANSLATED_PATH> (e.g. QUICKSTART.es.md). Show user a unified diff vs. the English source for visual sanity-check (line-count delta within ±15% is a healthy signal).
3b.6 Validate the translated file against the English source. The --reference flag tells the validator to ignore relative refs that were already broken in the source — OD docs frequently link to website route slugs (e.g. skills/blog-post/) that aren't files on disk; we don't want a structure-preserving translation to fail because of pre-existing dead refs.
bash "$SKILL_DIR/scripts/validate-markdown.sh" \
"$WORKDIR/<TRANSLATED_PATH>" \
--reference "$WORKDIR/<ENGLISH_PATH>"
If FAIL → surface verbatim, fix, retry.
3b.7 Render templates/PR-BODY-i18n.md with {{DOC_NAME}}, {{LANG_DISPLAY_NAME}}, {{LANG_CODE}}, {{TRANSLATED_PATH}}, {{ENGLISH_PATH}}, {{STATUS}}, {{TRANSLATION_NOTES}} (one paragraph from the agent: anything tricky, untranslated terms it kept, etc.), {{DISCORD_INVITE}}.
→ Step 7.
3c.1 Setup workspace (slug docs):
bash "$SKILL_DIR/scripts/setup-workspace.sh" docs <slug>
3c.2 Ask user (one AskUserQuestion):
3c.3 (Auto-discover branch) Run:
bash "$SKILL_DIR/scripts/discover-doc-gaps.sh" "$WORKDIR" > /tmp/od-doc-gaps.json
Group by kind (typo / deadlink / todo). Show the user up to 6 candidates via AskUserQuestion. Once picked, apply the fix in code (typo: replace word; deadlink: ask user for the new URL; todo: that's a proper task, ask user to write the missing prose).
3c.4 (Specific-fix branch) Read the file, apply user's described change. Confirm via diff.
3c.5 (Blog branch) First check whether OD has a blog directory:
ls "$WORKDIR/docs" 2>/dev/null
If a docs/blog/ or similar exists, place the new post there. If not, ask the user where it should live, defaulting to docs/<slug>.md. Generate an outline → user fills in user-specific bits (their use case, screenshots, the prompt they used, the rendered output) → agent stitches into a final Markdown.
3c.6 Validate every changed/added file. For files that already exist in the repo (typo fix, dead-link fix, doc edit), pass --reference pointing at HEAD's version so we only fail on relative refs the user introduced, not on pre-existing route slugs:
# For modifications to existing files:
git -C "$WORKDIR" show "HEAD:<path>" > "/tmp/od-contrib-orig-<basename>" 2>/dev/null
bash "$SKILL_DIR/scripts/validate-markdown.sh" \
"$WORKDIR/<changed-path>" \
--reference "/tmp/od-contrib-orig-<basename>"
# For brand-new files (e.g. a blog post the user is creating from scratch),
# omit --reference. The validator will skip the relative-ref check entirely
# (since it can't tell route slugs from real paths in isolation).
3c.7 Render templates/PR-BODY-docs.md with {{ONE_LINE_SUMMARY}}, {{DETAILS}}, {{FILES_LIST}}, {{DISCORD_INVITE}}.
→ Step 7.
3d.1 Read OD's actual schema at runtime to make sure we mirror it:
gh api "repos/${TARGET_REPO}/contents/.github/ISSUE_TEMPLATE/bug-report.yml" --jq .content | base64 -d > /tmp/od-bug-report.yml
If the schema has drifted from the template (templates/ISSUE-BODY-bug.md), regenerate the body to match.
3d.2 Ask the user via AskUserQuestion, one structured prompt per critical field. Use plain language, not the YAML field names:
| Bug-report field | Prompt to user |
|---|---|
description | "What went wrong? One sentence is fine." |
steps | "How can I reproduce it? Walk me through step by step." |
expected | "What did you expect to happen?" |
version | "Which OD version are you running? (About menu, or od --version)" |
platform | dropdown: macOS (Apple Silicon) / macOS (Intel) / Windows / Linux / Other |
logs | "Any error logs you can paste? Skip if you don't have them." |
screenshots | "Path to a screenshot? Skip if you don't have one." |
Translate every prompt above into the user's chat language at runtime.
3d.3 Auto-collect what we can (these don't need to ask the user):
unamenode -v if relevant3d.4 Dedupe: extract 3–5 keywords from the description, run:
gh search issues "<keywords>" --repo "$TARGET_REPO" --state open --limit 5 --json number,title,url
If matches exist, present them to the user via AskUserQuestion (translate to user's language): "These existing issues look related. Do you want to: (a) comment on an existing one, (b) open a new issue anyway, (c) cancel?"
3d.5 If proceeding with new issue, render templates/ISSUE-BODY-bug.md and submit:
bash "$SKILL_DIR/scripts/create-issue.sh" \
--title "$TITLE" \
--body-file "$WORKDIR_OR_TMP/.od-contrib/ISSUE-BODY.md" \
--dedupe-keywords "<keywords>"
3d.6 Print the issue URL on its own line. Do not push branches or open PRs from this branch.
Show the user a clean summary:
About to commit:
Branch: od-contrib/<type>/<slug>-<date>
Files:
+ skills/foo/SKILL.md (1.2 KB)
+ skills/foo/preview.png (54 KB)
Push to: <fork or upstream>
Open PR: nexu-io/open-design:main ← <fork>:<branch>
Then git -C "$WORKDIR" diff --stat and a head -40 of the rendered PR body for visual sanity.
Required AskUserQuestion confirmation (translate to user's language): "Push this PR?" with three options:
Never push without an explicit "Ship it".
bash "$SKILL_DIR/scripts/create-pr.sh" \
--workdir "$WORKDIR" \
--type "<skill|design-system|i18n|docs>" \
--title "<PR title from references/newcomer-tone.md>" \
--body-file "$WORKDIR/.od-contrib/PR-BODY.md"
Print the PR URL on its own line. Done.
main / master / develop. The push scripts refuse.--force push. Just don't.$OD_WORK_ROOT (default $HOME/od-contrib-work). od::assert_in_workroot enforces this.gh issue create.xxiaoxiong from any contributor lookup ([[feedback_no_outreach_xxiaoxiong]]).auto-github-contributor instead (it has the TDD loop). This skill deliberately doesn't run lint/typecheck/tests because content paths don't need them.아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.
로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.
아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.
복고풍 픽셀 스타일의 세 장면 영상을 Hyperframes용 HTML로 만듭니다. 제목과 색상을 바꾸고 장면 전환과 움직임을 갖춘 구성으로 완성합니다.
소셜 미디어 광고와 검색 광고의 제목, 설명, 본문을 작성하고 표현을 반복해서 수정합니다. 광고 문구 후보를 준비하고 개선안을 검토할 때 활용합니다.
어두운 배경과 세리프 글꼴로 패션 잡지 같은 세 페이지 동적 연출을 만듭니다. 글자 단계 표시와 장면 전환을 포함한 단일 HTML 파일로 출력합니다.
브라우저에서 페이지를 살펴보고 클릭, 입력, 화면 캡처, 정보 추출을 수행합니다. OpenDesign의 로컬 미리보기를 중심으로 웹 앱의 동작과 품질을 확인합니다.
AI 음악 앨범의 콘셉트 구상부터 가사 초안, 곡 순서 검토, 내보내기까지 다룹니다. 독립 제작 실험과 브랜드 음악 기획에 활용합니다.
p5.js에서 계산 규칙과 난수로 생성 예술을 만듭니다. 난수의 초깃값을 고정해 같은 그림을 재현하며, 포스터와 동적인 느낌의 정지 이미지, 구도 시안 제작에 활용합니다.