このガイドでできること
Pinterest で保存されるピンには「型」がある。感覚でデザインするのではなく、決まった数値と構造に沿って組み立てるだけで、安定して反応の取れるピンを作れる。
このガイドでは、Canva・Adobe Express・Photoshop など、どのツールでもそのまま入力できる具体的な数値仕様を公開する。上から順に STEP を追えば、1 枚目のピンが完成する構成にしている。
縦型クリエイティブ全般の考え方(なぜ縦型が有効なのか、保存される 3 原則など)は縦型クリエイティブの作り方ガイドにまとめているので、背景から知りたい方はそちらを先に読んでほしい。
STEP 1:キャンバスを設定する
Canva なら「カスタムサイズ」で以下を入力する。
| 項目 | 値 |
|---|---|
| 幅 | 1000 px |
| 高さ | 1500 px |
| 背景色 | #f8f7f6 |
なぜ1000×1500pxなのか。 Pinterest のフィードは 2:3 比率で表示される。この比率から外れると自動トリミングされ、意図しない切れ方をする。1000×1500px は Pinterest の推奨サイズであり、フィード上で最大面積を確保できるサイズ。
セーフエリア:上下左右120px。 テキストや要素をこのエリアからはみ出さないようにする。Canva なら「ファイル → ガイドを表示」でガイド線を 120px の位置に引いておくと便利。セーフエリアを設けることで、端ギリギリの窮屈な印象がなくなり、情報が読みやすくなる。
STEP 2:カラーパレットを決める
使う色は 5 色。このうち実際にテキストで使うのは 3 色だけ。
| 名前 | コード | 役割 |
|---|---|---|
| background | #f8f7f6 | 背景。真っ白ではなくオフホワイトにすることで目が疲れにくい |
| ink | #0B1F3B | 見出し・キーワード。濃紺で視認性が高い |
| muted | #4B5B73 | 補足テキスト・番号。inkより控えめなグレーで情報の階層を作る |
| border | #d6d3d0 | 区切り線。背景に馴染む薄さ |
| white | #ffffff | ラベルの背景 |
3色ルールの理由。 色が増えると「どこが重要なのか」の判断に認知コストがかかる。ink(重要)・muted(補足)・border(装飾)の 3 色で情報の優先度を表現し、読者の視線を自然にコントロールする。強調したい箇所は色を変えるのではなく太字にする。
Canva を使っている場合は「ブランドキット」にこの 5 色を登録しておくと、毎回手入力する手間がなくなる。
STEP 3:3ブロック構造で組み立てる
すべてのピンは「タイトル → コンテンツ → CTA」の 3 ブロックで構成する。この構造が崩れると視線の流れが乱れ、何を伝えたいピンなのか分からなくなる。
上部:タイトルブロック
ピンの最上部。フィードで真っ先に目へ入る部分。
| 要素 | 役割 | 必須? |
|---|---|---|
| ラベル | 「保存版」「初心者向け」などのバッジ | 任意 |
| プレフィックス | タイトルの前置き(例:副業を始める前に) | 任意 |
| メインタイトル | 最も大きく目立たせる一文 | 必須 |
| サブ | 補足説明(例:保存版:最初の1ヶ月で迷わないために) | 任意 |
| 区切り線 | タイトルとコンテンツの境界。幅750px(キャンバスの75%) | 必須 |
タイトルは左揃え・上部固定。中央揃えにするとカジュアルすぎて情報系コンテンツに合わない。
中央:コンテンツブロック
ピンの本体。テンプレートの種類によって形が変わる部分(詳細は STEP 5)。
| 要素 | 役割 |
|---|---|
| 番号 or マーク | 01、02、03… または ✓ |
| 見出し | 各項目のキーワード(太字) |
| 補足 | 見出しの説明文。1行に収める |
項目はタイトルと CTA の間に等間隔で並べる。間隔が不揃いだと雑な印象になる。
下部:CTAブロック
行動喚起。必ず3行で固定する。
| 行 | 内容 | サイズ | 色 |
|---|---|---|---|
| 1行目 | 誘導テキスト(▶ 続きはプロフィールから) | 20px / Regular | muted |
| 2行目 | ベネフィット(副業ロードマップ公開中) | 22px / Bold | ink |
| 3行目 | ハンドル(@yourhandle) | 24px / Regular | muted |
CTA はキャンバス下端から 120px の位置に中央揃えで配置。タイトルは左揃えだが、CTA は中央揃えにすることで「締め」の役割を視覚的に果たす。
STEP 4:テキストサイズを設定する
フォントはZen Kaku Gothic Newを推奨。Canva ならNoto Sans JPが標準で使える。
| 優先 | フォント名 | 環境 |
|---|---|---|
| 1 | Zen Kaku Gothic New | Google Fonts / Canva |
| 2 | Noto Sans JP | Canva標準 |
| 3 | 游ゴシック Medium | Windows / macOS |
| 4 | ヒラギノ角ゴ Pro W3 | macOS |
| 5 | メイリオ | Windows |
タイトルブロックの数値
| 要素 | サイズ | 太さ | 色 |
|---|---|---|---|
| ラベル | 24px | Regular | muted(枠線つき) |
| プレフィックス | 32px | Regular | muted |
| メインタイトル | 64px | Bold | ink |
| サブ | 24px | Regular | muted |
| 区切り線 | 幅750px / 太さ2px | — | border |
メインタイトルの 64px は、1000px 幅のキャンバスで 8〜14 文字が 1 行に収まるサイズ。これより大きくすると文字が折り返し、小さくするとフィードで読めなくなる。
コンテンツブロックの数値(テンプレート別)
テンプレートによって最適なサイズが異なる。項目数が多いほど文字を小さく、少ないほど大きくしてバランスを取る。
| 要素 | 5ステップ | 3ステップ | チェックリスト | Before/After |
|---|---|---|---|---|
| 番号/マーク | 48px / Regular / muted | 56px / Regular / muted | ✓ 28px | なし |
| 見出し | 32px / Bold / ink | 36px / Bold / ink | 30px / Bold / ink | 32px / Bold / ink |
| 補足 | 24px / Regular / muted | 26px / Regular / muted | なし | 24px / Regular / muted |
| 項目間の余白 | 28px | 48px | 罫線区切り(余白16px) | 罫線区切り(余白20px) |
| レイアウト | 縦1列 | 縦1列 | 縦1列 | 左右2列 |
STEP 5:テンプレートを選ぶ
コンテンツの種類に合わせて 4 つのテンプレートから選ぶ。迷ったら5ステップ型を選べば汎用性が高い。
5ステップ型(標準・最も汎用的)
「〇〇する 5 つの方法」「〇〇の手順」などハウツー系に最適。番号があると「順番に読もう」という意識が生まれ、最後まで見てもらいやすい。
構成例:
- プレフィックス:副業を始める前に
- タイトル:知っておくべき5つのこと
- サブ:保存版:最初の1ヶ月で迷わないために
- 01:目標金額を明確にする / 月1万/5万/10万で戦略が変わる
- 02:スキルの棚卸しをする / 過去の経験×市場ニーズで選ぶ
- 03:初期費用ゼロで始める / 無料ツールだけで十分OK
- 04:最初の案件を取る / クラウドソーシング3社に登録
- 05:継続の仕組みを作る / 週2時間のルーティンが鍵
- CTA:▶ 続きはプロフィールから / 副業ロードマップ公開中 / @yourhandle
3ステップ型(インパクト重視)
項目が少ないぶん、文字を大きく余白を広く使える。フィードをスクロール中でも目に留まりやすい。
構成例:
- プレフィックス:朝活を続ける
- タイトル:3つのルーティン
- 01:前夜に準備を終わらせる / 服・持ち物を枕元に置く
- 02:起きたら水を1杯飲む / 脳と体のスイッチが入る
- 03:最初の15分で最重要タスク / 集中力が最も高い時間を活かす
- CTA:▶ 続きはプロフィールから / 朝活テンプレ無料配布中 / @yourhandle
チェックリスト型(保存率が高い)
✓マークは Pinterest との相性が特に良い。「保存して後で確認しよう」という行動を自然に促す。
構成例:
- プレフィックス:引越し前の
- タイトル:やることリスト
- ✓ 不用品を処分する
- ✓ 転居届を出す
- ✓ ライフラインの手続き
- ✓ 荷造りスケジュール作成
- ✓ 住所変更リストを作る
- CTA:▶ 続きはプロフィールから / 引越しチェックリスト配布中 / @yourhandle
Before→After型(変化を見せる)
左右 2 列で変化を並べて見せる。違いが一目で伝わるため、フィードでのスクロール停止率が高い。
構成例:
- プレフィックス:朝の過ごし方を変えたら
- タイトル:1ヶ月で変わった5つの習慣
- サブ:実体験ベースで紹介
- Before:ギリギリまで寝る → After:30分早く起きる
- Before:毎朝バタバタ → After:余裕が生まれて集中力UP
- CTA:▶ 保存版テンプレ配布中 / 迷ったらこの型でOK / @yourhandle
STEP 6:公開前チェックリスト
ピンを書き出す前に、この 7 項目だけ確認する。
- 見出しが全部1行に収まっている — 2 行になっていたら短く言い換える
- 補足テキストに数字・具体語がある —「月 1 万円」「週 2 時間」「3 社に登録」など。目安は 18〜22 文字。「すごく良い」のような抽象表現は避ける
- CTAが3行になっている — 誘導(muted)→ ベネフィット(ink 太字)→ @ハンドル(muted)
- 色が3色以内 — ink + muted + border のみ。強調は太字で
- 区切り線が75%幅(750px) — 端から端まで引かない
- セーフエリア(120px)を守れている — テキストや線が端ギリギリになっていないか
- フォントが正しい — Zen Kaku Gothic New / Noto Sans JP / 游ゴシックのいずれか
デザインのカスタマイズ
基本の型を守ったうえで、以下の要素は好みに合わせてカスタマイズできる。
タイトルブロックの構成パターン
情報量に応じて 4 パターンから選ぶ。
| パターン | 構成 | 向いている場面 |
|---|---|---|
| フル(推奨) | ラベル + プレフィックス + タイトル + サブ + 区切り線 | 情報が多く、丁寧に文脈を伝えたいとき |
| プレフィックスなし | タイトル + サブ + 区切り線 | タイトルだけで十分伝わるとき |
| サブなし | プレフィックス + タイトル + 区切り線 | すっきりした見た目にしたいとき |
| ミニマル | タイトル + 区切り線 | シンプル最優先。文字が少ないほど目立つ |
ステップ番号のスタイル
| スタイル | 見た目 | 印象 |
|---|---|---|
| ベーシック(推奨) | 数字のみ(48px / Regular / muted) | 汎用的。どんなコンテンツにも合う |
| サークル(線) | 円形の枠線で囲む | 柔らかい |
| サークル(塗り) | 円形を塗りつぶし(背景ink / 文字white) | 番号を強調したいとき |
| スクエア | 角丸の四角形(背景muted / 角丸8px) | モダン |
| アンダーライン | 番号の下に線 | シンプルにアクセント |
| ドット付き | 番号の前に小さな丸(8px / muted) | リスト感を強調 |
ラベル / バッジ
タイトル上部に「保存版」「初心者向け」などのラベルを付ける場合。
| スタイル | 仕様 |
|---|---|
| アウトライン | border 1px / border色 / 角丸4px |
| 塗り | 背景white / 角丸4px |
| ピル | border 1px / border色 / 角丸100px |
共通:24px / Regular / muted / padding 8px 20px。ラベルは使いすぎると逆効果なので、本当に強調したい場合のみ。
タイポグラフィ早見表
すべての要素の数値を一覧でまとめる。制作中に参照用として使ってほしい。
| 要素 | サイズ | ウェイト | 色 |
|---|---|---|---|
| ラベル | 24px | Regular | muted |
| プレフィックス | 32px | Regular | muted |
| メインタイトル | 64px | Bold | ink |
| サブ | 24px | Regular | muted |
| 区切り線 | 750px / 2px | — | border |
| ステップ番号(5項目) | 48px | Regular | muted |
| ステップ番号(3項目) | 56px | Regular | muted |
| キーワード(5項目) | 32px | Bold | ink |
| キーワード(3項目) | 36px | Bold | ink |
| 補足テキスト | 24px | Regular | muted |
| CTA誘導 | 20px | Regular | muted |
| CTAベネフィット | 22px | Bold | ink |
| CTAハンドル | 24px | Regular | muted |
まとめ:型を守れば、毎回迷わない
Pinterest のピン制作で大事なのは、感覚ではなく再現性。
- キャンバス:1000×1500px、セーフエリア 120px
- 色:ink / muted / border の 3 色。強調は太字
- 構造:タイトル → コンテンツ → CTA の 3 ブロック
- テンプレート:コンテンツの種類で 4 型から選ぶ
- 公開前チェック:7 項目を確認して書き出し
一度この仕様を覚えてしまえば、あとはコンテンツの中身に集中するだけ。デザインで迷う時間がなくなる。
ピンの先にある記事や Amazon 導線の設計については、Pinterest→記事→Amazon導線の作り方を参照。