mobile-app

Mobile app screen inside a pixel-accurate device frame. Single screen, single job. Use for "mobile app", "iOS app", "Android app", "phone screen".

インストール方法

デフォルトでは、最初にソースを確認する Prompt が選択されています。直接コマンドに切り替えるか、ローカルコピーをダウンロードすることもできます。

Codex または Claude でインストールこの Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。

直接コマンドでは確認用 Prompt が省略されます。実行前にソースを確認してください。

npx skills add https://github.com/pujan-modha/clover-design --skill mobile-app

コマンドは1行のまま表示されます。コピー前に横へスクロールして全体を確認してください。

ローカルで確認しますか？SkillsMP が現在取得できるファイルをダウンロードできます。

インストールを決める前に、SKILL.md と SkillsMP に表示されている付属ファイルをお読みください。

SKILL.md

ソースの指示 · 読み取り専用プレビュー

name	mobile-app
description	Mobile app screen inside a pixel-accurate device frame. Single screen, single job. Use for "mobile app", "iOS app", "Android app", "phone screen".
triggers	["mobile app","ios app","android app","phone screen","app ui","app mockup"]
df	{"mode":"prototype","platform":"mobile","scenario":"design","preview":{"type":"html","entry":"index.html"},"design_system":{"requires":true}}

Produce a single mobile screen mockup, framed inside a device chrome.

Brief	Screen
feed, inbox, timeline, list	Feed
article, post, item, product detail	Detail
sign-up, welcome, walkthrough	Onboarding
profile, account, bio	Profile
checkout, payment, form	Checkout
timer, map, single big number	Focus

Single index.html with inline CSS. Device frame via CSS/SVG.