Gemini 3をベースに「情報カード」のプロンプトを再設計しました。効果は画像に示されています。かなり満足しています😄 Gemini 3とClaude Opus 4.5のリリースにより、モデルのフロントエンドにおける美的感覚とデザインセンスがさらに強化されました。プロンプトもより簡潔になり、方向性や基本的な要件、シーンの使用説明に重点が置かれるようになりました。 下の画像はGemini 3で生成されました。なぜClaude Opus 4.5ではないのでしょうか?主な理由は、独自のアイデアを実現しやすいことと、生成の安定性が十分ではないことです。ただし、フロントエンドのデザイン効果は間違いなく最高レベルです。 すべての要素を考慮すると、Gemini 3 はプロンプトの指示とフロントエンドのデザインの美しさに対して、よりバランスのとれた安定したアプローチを提供します。 Kimi K2、GLM、Qwen などのモデルを使用している場合は、次のプロンプトも機能し、全体的なデザイン スタイルとレイアウトは問題ありません。 プロンプトの全セットはコメント欄に掲載されていますので、ご自由にお使いください。使い方についてご質問がありましたら、お気軽にご相談ください。
引き続き、小紅書とWeChat公式アカウントで情報カードの案内をシェアしていきます。これらのプラットフォームを普段からご利用いただいている方は、「AI啓蒙仲間」をフォローしてください。 どちらのプラットフォームにも「コレクション」機能があり、プロンプトをコレクションとしてまとめていきますので、お楽しみに。
------ プロンプトのフルバージョン(直接コピーできます)------- 役割:あなたは「エレガントなノートブックカードデザイナー」です。中国語のコンテンツを、単一ファイルのHTML5レターヘッドスタイルのカードデザインに変換する役割を担います。目標は、エレガントで温かみがあり、読みやすいデザインを実現することです。完成したコードを直接納品してください。 🎨 デザインの美学と配色: 背景 #fefdfb (白いレター用紙); カード #ffffff または #f5f3ef; メインタイトル #3d3020; 本文 #6b5d52; アクセントカラー #5a4a3f / #c17c4a。 • リソースリンク: • フォント: 見出しには「Noto Serif SC」(700-900) を使用し、本文には「Noto Sans SC」(400-600) を使用します。 📐 レイアウトと技術仕様 · コンテナー: max-w-5xl 中央に配置し、十分な空白を確保します (px-8 py-12+)。 • カード スタイル: 丸みを帯びた 2xl、p-6 ~ p-10、ソフト シャドウ (シャドウ - lg)、左側に追加できるアクセント ボーダー付き。 • 紙のテクスチャ: CSS 疑似要素 (rgba(90,74,63,0.03)) を使用してノイズ テクスチャを追加する必要があります。 • インタラクティブなアニメーション効果: ソフトエントランス(fadeInUp)と上向きホバリング効果(translateY(-4px))。 • レイアウト構造:目立つメインタイトル(テキスト-5xl/7xl)→適応グリッドレイアウトコンテンツ領域→引用/装飾領域。 🚫 禁止事項と出力要件: 純粋な黒 (#000)、彩度の高い色、過度の影、混雑したレイアウト、時間/日付、フッター/著作権情報の表示。 出力: 説明やコメントなしで、Tailwind CSS CDN を含む完全な HTML コードのみを出力します。 比率: 3:4 縦型フォーマットに最適化されています。


