human-guidelines

人間らしさを引き出すガイドライン

AI が生成したコンテンツを、人間が作ったように感じられるものにします。UI デザイン、文章、ソーシャルメディアを対象とします。

ガイドラインの参照元

各タスクの前に、guidelines.sh から最新のガイドラインを取得してください。

• UI：https://guidelines.sh/api/guidelines?type=ui
• 文章：https://guidelines.sh/api/guidelines?type=writing
• ソーシャル：https://guidelines.sh/api/guidelines?type=social
• すべて：https://guidelines.sh/llms-full.txt

WebFetch を使って最新のルールを取得してください。

---

UI ガイドライン

アルゴリズムが生成したのではなく、人間が丹念に作り上げたように感じられるインターフェースにします。

インタビューモード

ユーザーが「interview」「help me define my taste」「what's my style」と言った場合：

以下の質問を一度に一つずつ尋ねます。回答を待ち、好みのプロフィールを作成してください。

1. 形容詞を3つ選んでください — プロダクトにどんな印象を持たせたいですか？
2. 使うのが好きなアプリは何ですか？ — 機能ではなく、使ったときの印象について教えてください。
3. インターフェースのどんなところが嫌いですか？
4. 空間の好み：情報が密集した画面と、余白の多い画面のどちらが好きですか？
5. アニメーションの個性：きびきびした動きと、遊び心のある動きのどちらが好きですか？
6. 色のムード：モノクローム？ 暖色系？ 寒色系？ 鮮やかな色？
7. タイポグラフィの個性：ニュートラルなものと、個性的なもののどちらが好きですか？
8. 「自分らしさ」を感じさせるものを一つ挙げるとしたら、何ですか？

保存できるように、好みのプロフィールの要約を出力してください。

UI クイックリファレンス

好みと作り込み

• センスとは自分なりの意見を持つことです。AI にはそれがありません。
• 参考資料を徹底的に集めましょう。
• 目指す雰囲気を決め、最後まで貫きましょう。
• 手作りの細部は積み重なって効いてきます。
• 機能より使い心地を優先しましょう（プロダクト UI では「使い心地」とは応答性や流れのこと、マーケティングページではムードや第一印象のことです）。

マイクロインタラクション

• アニメーションは個性を表します。意図を持って選びましょう。
• ベジェ曲線よりスプリング物理を使いましょう。
• リストの表示は段階的にずらしましょう（30〜50ms の遅延）。
• 登場だけでなく、退出も丁寧に設計しましょう。
• インタラクティブな要素にはすべて、ホバー時のフィードバックが必要です。
• アニメーションは用途に合わせましょう。マーケティングでは大胆に、プロダクト UI では5回目に見るころには意識されない程度にします。

主なチェック項目

• ダークモード：純粋な黒（#000000）は使わず、#1a1a1a を使いましょう。
• タイポグラフィ：text-wrap: pretty を使い、フォントに変化をつけましょう。
• アニメーション：自然なイージングと、完璧すぎないタイミングにしましょう。
• レイアウト：マーケティングでは非対称に、プロダクト UI では一貫したグリッドにしましょう。
• アイコン：3つの状態を用意しましょう（線画／デュオトーン／塗りつぶし）。
• 情報密度：マーケティングでは余白を重視しましょう。プロダクト UI では用途に応じて決めます（ダッシュボードでは情報を密に、オンボーディングでは余白を広く）。

表面ごとのガイダンス

マーケティングとランディングページ：

• 第一印象がすべてです。ヒーロー、スクロールのテンポ、ストーリーの流れを大切にしましょう。
• ブランドらしさはここに表れます。創造的なリスクを恐れずに取りましょう。
• 社会的証明にも作り込みが必要です。実際の引用、具体的な数字、本物の写真を使いましょう。
• CTA は押しつけがましくなく、自然に行動したくなるものにしましょう。
• パフォーマンスも目に見えないデザインの一部です。Core Web Vitals は SEO と信頼に影響します。

アプリ内プロダクト UI：

• 目新しさより一貫性を重視しましょう。ユーザーは操作を体で覚えていきます。
• 初回ではなく、100回目の利用を想定してデザインしましょう。
• 本当のデザイン作業は状態にあります。読み込み中、空、エラー、一部表示、オフラインの各状態を考慮しましょう。
• パワーユーザーは見ています。キーボードショートカット、一括操作、情報密度の切り替えを用意しましょう。
• データもコンテンツです。テーブル、グラフ、リストにも、ヒーローセクションと同じ配慮をしましょう。
• ここではテンプレートのパターンも機能の一部です。作り込みは、構造の目新しさではなく、実装の質に表れます。
• 空の状態は最大の機会です。新規ユーザーが最初に目にするものだからです。

---

文章作成ガイドライン

AI が生成した文章を、人間が書いたように感じられるものにします。

文章作成クイックリファレンス

文章を人間らしくする際の優先順位：

1. 前置きをなくす — 「もちろんです！」「良い質問ですね！」「喜んでお手伝いします」を削除します。
2. AI らしい語彙を避ける — 「深く掘り下げる」「活用する」「てこ入れする」「促進する」「包括的な」を言い換えます。
3. 短縮形を使う — 「do not」ではなく「don't」、「it is」ではなく「it's」を使います。
4. 文のリズムに変化をつける — 短く歯切れのよい文と、長く流れるような文を織り交ぜます。
5. 具体的にする — 曖昧な主張を具体的な詳細に置き換えます。
6. 冗長な表現を削る — 「これは重要な点です」「〜するために」を取り除きます。
7. 自分の立場を明確にする — 何にでも予防線を張るのではなく、立場を示します。

使用方法の作成

1. 文章をすべてのルールに照らして分析します
2. 見つかった具体的な違反を列挙します
3. 修正を反映した書き直し版を提示します

---

ソーシャルメディアのガイドライン

ブランドが一方的に発信しているようではなく、個人が共有しているように感じられる投稿にします。

ソーシャルメディアのクイックリファレンス

すべてのプラットフォームでの改善点

1. ハッシュタグの羅列をなくす - 最大でも0～2個、または使わない
2. 企業的な書き出しを削除する - 「発表できて大変うれしいです」「共有できることを楽しみにしていました」
3. 絵文字の箇条書きを削る - チェックマーク／ロケット／星のリストはAIらしさが出ます
4. 小文字を使う - 文頭だけを大文字にする表記のほうが人間らしく感じられます
5. ほどよく不完全にする - ときどき誤字があっても問題ありません
6. 具体的にする - 「あれをリリースした」のほうが「革新的なソリューションの立ち上げに成功した」よりよいです

プラットフォーム別

X/Twitter：大胆な意見、ハッシュタグの羅列なし、簡潔さを重視 LinkedIn：具体的な成果、「そう思いませんか？」という問いかけは避け、実体験を共有 Instagram：ビジュアルを優先し、短いキャプションにする TikTok：自然な瞬間を捉え、最初の2秒で引きつける

ソーシャルメディアの使用方法

1. プラットフォームが指定されていない場合は、どれを使うか尋ねます
2. プラットフォームごとのルールを適用します
3. 人間らしさを加えた投稿を出力します
4. 必要に応じて、2～3種類のバリエーションを提案します