ナイキのデザインで自分のサイトを作り直したら、別物になった
おもしろいサイトを見つけました。
getdesign.md っていうんですけど、ナイキとかStripeとかAppleとか、
有名ブランドのデザインのルールが無料で読める場所です。
「なにそれ」ってなりますよね。 ぼくもなりました。
で、せっかくなので自分のポートフォリオサイトで試してみたんですよね。
ナイキのデザインルールをそのままClaudeに渡して、「これで作り直して」って。
出てきたサイトが、なかなかよかったんです。
さっそく試してみました。
題材は自分のポートフォリオサイト。
ナイキのDESIGN.mdダウンロードして
Claudeに渡してみました
「このデザインルールでリデザインして」とお願いしただけです。
ナイキのデザインの特徴は、こんな感じ。
モノクロームのみ（黒と白しか使わない）
巨大な大文字タイポグラフィ
装飾ゼロ、余白で魅せる
出てきたのが、これです。
ビフォーのサイトはこちら。
カラフルなアイコンが並んでいて、情報量も多め。
アフターがこちら。
黒一色になって、フォントが極太の大文字に変わって、スキル一覧がグリッドのタイルになっています。
「あ、ちゃんとナイキっぽい」
そう思える仕上がりになっていました。
プロンプトは一行。 かかった時間は数分。
デザインの知識がなくても、「このブランドの文法」をそのまま借りられる。 それがDESIGN.mdの面白さだと思います。
気になる人は、getdesign.md をのぞいてみてください。
StripeでもNotionでもAppleでも、好きなブランドのデザインを試せますよ。
最後まで読んでくれてありがとうございました。
もし記事が少しでも刺さったら、💛を押してもらえると活動の励みになります！！
感想・質問・雑談、なんでも歓迎です。SNS でつながりましょう！
𝕏（Twitter）→ RED_KK7
ポートフォリオ → こちら
AIコミュニティ → わくわくKKのAI創作コミュニティ
