本文へ移動

リッチメニューのデザイン実務|規定サイズとタップされる設計

クリエイティブ編

INDEX目次

    企業のLINE公式アカウントを開くと、トーク画面の下に大きなメニュー画像がありますよね。あれがリッチメニューです。

    LINEまわりの画像制作は、バナーと並んでデザイナーへの依頼が多い定番の仕事になりました。ところが規定サイズや分割の仕組みは、意外と知られていません。
    このレッスンでは、LINEクリエイティブの種類と規定サイズ、タップされるリッチメニューの設計をまとめます。配信のタイミングや友だちの増やし方といった運用の話はしません。画像を作る人のための回です。

    LINEクリエイティブは3種類

    LINE公式アカウントでデザイナーが作る画像は、大きく3種類です。出る場所と役割が違います。

    LINEクリエイティブの3種類の一覧図解。トーク画面の下に固定表示されるリッチメニュー、画像1枚をメッセージとして配信するリッチメッセージ、複数のカードを横に並べて配信するカードタイプメッセージの違いを示した図
    種類出る場所役割
    リッチメニュートーク画面の下に固定アカウントの入口。予約・クーポンなどへの導線(行き先へつなぐ入口)
    リッチメッセージメッセージとして届く画像お知らせやキャンペーンを1枚で伝えて、タップでリンク先へ
    カードタイプメッセージ横にスライドするカード商品・店舗・人の一覧を見せる

    依頼がいちばん多いのはリッチメニューです。友だち追加した人が最初に目にする場所で、アカウントの顔になります。まずここから見ていきましょう。

    リッチメニューの規定サイズ

    リッチメニューの規定サイズ図解。大サイズは2500×1686ピクセルで最大6分割、小サイズは2500×843ピクセルで最大3分割。どちらも容量1MB以下、JPGまたはPNGで作ることを示した図

    リッチメニューのサイズは2種類です。

    • 大:2500×1686px。トーク画面の下半分近くを占めます。テンプレートで最大6分割
    • 小:2500×843px。高さが大の半分。テンプレートで最大3分割

    ファイルはJPGかPNGで、容量1MB以下。1200×810pxなどの縮小版サイズでも入稿(管理画面への画像の登録)はできますが、2500px幅で作っておけば画質の心配がありません。
    タップ領域は管理画面のテンプレートで区切ります。デザイン側の分割と、設定するテンプレートの分割を合わせておくのがポイントです。

    これらは2026年時点の規定です。変わることがあるので、制作前にLINE公式アカウントの管理画面か公式ヘルプで最新の規定を確認してください。

    大と小の使い分けは、メニューの項目数で決めます。予約・メニュー・アクセス・クーポンと項目が多い店舗系は大。トークの文章を読ませたい相談系のアカウントは、画面を圧迫しない小。どちらか迷ったら、載せたい項目を書き出してから選ぶと決まります。

    タップされるリッチメニューの設計

    リッチメニューはポスターではありません。ボタンの集合です。きれいに飾るより、押す場所が一瞬で分かることを優先します。

    • 分割数は項目数に合わせる:導線が4つなら4分割。枠を埋めるための6分割はタップ先を薄めるだけです
    • 各ボタンは「アイコン+短い言葉」:「ご予約はこちらから」より「予約」。2500px幅の画像はスマホでは幅750px程度に縮むので、文字は大きめに作ります
    • いちばん押してほしい項目に差をつける:予約や購入のボタンを大きい面積・目立つ色にします。デザインの4原則の対比です
    • 境界をはっきりさせる:ボタンどうしの境界線や色分けがないと、どこまでが1つのボタンか分かりません

    仕上げの確認はスマホの実機でやります。PCの画面で読めた文字が、実機では読めないことがよくあります。

    • 分割数と導線の数が合っている
    • 実機で全ボタンの文字を読める
    • いちばん押してほしいボタンが最初に目に入る
    • タップ領域の設定とデザインの分割が一致している

    リッチメッセージとカードタイプの要点

    残り2種類は要点だけ押さえておきましょう。

    リッチメッセージは1040×1040pxの正方形が基本です。トークに画像として届いて、タップするとリンク先が開きます。
    作り方のコツはバナーと同じで、1枚に1つの目的だけ。キャンペーンのお知らせなら「何が・いつまで・タップするとどうなるか」の3点に絞ります。文字を詰め込むほど読み飛ばされるのは、バナーで学んだとおりです。

    カードタイプメッセージは、複数のカードを横に並べる形式です。商品一覧やスタッフ紹介に向いています。カードの種類ごとに画像の推奨比率が違うので、管理画面の指定に合わせて書き出します。
    設計のコツは1枚目です。横にスライドするかどうかは1枚目のカードで決まるので、いちばん強い商品・いちばん伝えたい内容を先頭に置きます。

    ミニ実践:企業のリッチメニューを分解する

    スマホだけでできる観察練習です。10分ほどでリッチメニューを見る目が変わります。

    1. 好きな企業や店舗のLINE公式アカウントを1つ友だち追加します(コンビニ・カフェ・アパレルなど、普段使う所でOK)
    2. リッチメニューを開いて、大サイズか小サイズかを判定します
    3. 分割数を数えて、各ボタンの文言を書き出します
    4. それぞれのボタンをタップして、行き先(予約ページ・クーポン・Webサイトなど)をメモします
    5. 「いちばん目立っているボタン」と「いちばん押してほしそうなボタン」が一致しているか確認します

    3アカウントぶんやると、業種ごとの型が見えてきます。自分が作るときの引き出しになりますよ💡

    よくある質問

    リッチメニューの画像サイズは?

    大サイズが2500×1686px、小サイズが2500×843pxです。どちらもJPGかPNGで容量1MB以下。1200×810pxなどの縮小版でも入稿できますが、2500px幅で作るのが安全です。規定は変わることがあるので、制作前に公式ヘルプを確認してください。

    大と小、どちらを使えばいいですか?

    メニュー項目の数で決めます。予約・クーポン・アクセスなど導線が4つ以上あるなら大、トークの文章を読ませたいアカウントなら画面を圧迫しない小が向いています。載せたい項目を書き出してから選ぶと迷いません。

    分割数はいくつがいいですか?

    導線の数に合わせます。押してほしい先が3つなら3分割で十分です。枠を埋めるために6分割にすると、1つあたりの注目が薄まって、かえってどれも押してもらえなくなります。迷ったら少ない分割から始めて、必要になったら増やしてください。

    リッチメニューは無料ツールで作れますか?

    作れます。Canvaにはリッチメニュー用のテンプレートがあり、サイズ指定(2500×1686px)でキャンバスを作れば自作もできます。LINE公式アカウントの管理画面にも簡単な画像作成機能があります。書き出すときは容量1MB以下になっているかだけ確認してください。

    次に学ぶこと

    LINEクリエイティブは、リッチメニュー・リッチメッセージ・カードタイプの3種類。リッチメニューは2500×1686pxか2500×843pxで、分割数を導線の数に合わせて、ボタンだと分かる見た目にする。ここまでが今回の内容です。

    次のレッスンはLPデザイン。リッチメニューやバナーのタップ先になることが多い、縦長1ページの設計を扱います。

    コース全体の並びはデザイン基礎コースの目次で確認できます。

    クリエイティブ編 の他のレッスン

    前後のレッスン

    ← コースの目次へ戻る

    目次

      \ スクールが気になったら、まずはLINEで /

      公式LINE登録で、3大特典をプレゼント

      無料相談(Zoom・30分)の予約もLINEから。勧誘なし・ブロックはいつでもOKです。

      FOR BUSINESS

      法人向け「AI×デザイン」研修

      生成AIを取り入れた制作ワークフローを、半日〜2日のカスタム研修でチームに導入。デザイナー以外の職種の方にも対応します。

      研修について相談する

      オンライン・対面どちらも可 / お見積り無料

      LINE登録で3大特典
      LINE登録で3大特典スクール詳細
      PR バナー
      公式LINEで無料相談 + ロードマップPDFプレゼント中 LINE友だち追加