Siteprint
サイトのデザインや動きを、コードを書くAIへの指示文にしてくれる拡張機能
🛠️ 自分で作れる度★★★★★🗾 日本でやれる度★★★★★
🧩どんなサービス？ 6つのポイント
👤誰が使う？
Claudeで画面を作る開発者や、デザイナーのいない小さなチームが使う。
😩困っていたこと
AIに画面を頼むと、どの業界でも同じ見た目になる。読み込み中・データなし・エラーの画面も抜けている。
✅してくれること
最初に5つ質問してから設計し、読み込み中・空・エラーの画面やスマホ表示まで実際に作る。完成前にグラフやボタンが動くか、色が見やすいかも確かめる。
🤖AIの役割
14年のデザイン経験を手順書にしてClaudeに読ませ、その手順どおりに画面を作らせる。
💰お金の仕組み
無料で公開されていて、お金はとっていない(MITライセンスのオープンソース)。
📈うまくいっている証拠
作者が30件で試して100点中86.7点(Opus 4.8でHTMLなら93.0点)。利用者数は不明。
🛠️自分でも作れる？
🧑💻率直なところ
作れる。中身はプログラムではなく文章の手順書なので、得意分野の知識があれば数週間で作れる。
🗾日本でやるなら
日本の業務ソフト会社や受託開発の会社向けに、日本語の画面ルール込みの手順書として売る。1つ数千円の販売か、会社向けに自社ルールを組み込む作成代行で月数万円(たぶん)。
👣最初の一歩
自分が得意な分野の「いつも確認していること」を紙に書き出す。それをClaudeに読ませて、出来が良くなるか10件ほど試す。
✨まねするならこのアイデア
- 役所向け画面の手順書つきAIスキル
- 飲食店のメニュー表を作るAIスキル
- 介護記録アプリの画面を作るAIスキル
- 会社の画面ルールを覚えさせる代行
- スマホ予約画面専用のAIスキル
🔬らぼのひとこと
価値はAIで画面を作ることではなく、ベテランが無意識にしている確認を言葉にした点にある。「説明しただけの画面は作ったことにしない」というルールが面白い。経験さえあれば、プログラムが書けなくても作れる商品の形だ。
🔎 くわしい点数と情報源
- devto_aihttps://dev.to/zeeshani42/i-built-a-claude-skill-that-makes-ai-design-like-a-senior-ux-designer-2gdm
原文: I built a Claude skill that makes AI design like a senior UX designer