← 一覧へ
🎨 デザインClaude Code難易度: 中級
メールマーケティング email-marketing
魅力的なHTMLメールを、簡単に作ろう!
これは何?
これは、HTMLメールを制作するためのスキルです。プロダクトローンチやニュースレターなど、ブランドのイメージに合わせた美しいデザインを簡単に作ることができます。シングルカラムのレイアウトで、CTAやプロダクトの仕様もきれいに表示されます。初心者でもわかりやすい手順で、すぐに使えるのが魅力です。

これでできること
- シングルカラムのHTMLメールを制作できます
- プロダクトローンチに最適なデザインを作れます
- CTA(Call to Action)を効果的に配置できます
- プロダクトの仕様を美しく表示できます
こんな時に便利
新商品のローンチメールを作りたい時
ブランドのニュースレターを配信したい時
MJMLを使ったメールテンプレートを作成したい時
プロダクトの詳細を伝えるメールを作りたい時
使い方
まず、DESIGN.mdを確認してデザイントークンを選びます。次に、ブランドとプロダクトを選び、具体的な内容を設定します。そして、指定された順にレイアウトを組んでいき、最後にHTMLを書きましょう。スタイルはインラインCSSで、画像はSVGやグラデーションを使うと良いです。
使用例(こう頼んでみよう)
新商品のローンチメールを作ってくださいブランドのニュースレターテンプレートを作成してくださいMJMLを使ったメールデザインを提案してください必要なもの
- 特になし
導入方法
いちばん簡単(AIに頼む)
次のスキルを入れて: https://github.com/nexu-io/open-design/tree/main/design-templates/email-marketing手動で置く
Claude Code →
~/.claude/skills/email-marketing/Codex →
~/.agents/skills/email-marketing/使いこなしのコツ
- デザイントークンを活用して、ブランドのイメージを統一しましょう
- CTAは1つに絞ることで、ユーザーのアクションを明確にします
- 480px幅での表示も確認して、読みやすさを確保しましょう