本文へ移動

シンメトリーのデザイン|アシンメトリーとの違いと使い分け

第1章 デザインの原則 読了目安 8分

INDEX目次

    「まとまってはいるけど、なんだか面白くない」。作品を見返してそう感じたことはありませんか?

    その原因は、全部を中央にそろえていることかもしれません。
    左右対称のシンメトリーは安定して見えます。ただ、安定は「動きがない」と裏表です。あえて崩すアシンメトリーを選ぶ場面もあります。
    このレッスンでは、2つの違いと、どちらを選ぶかの決め方を説明します。最後に実例を1つずつ集める観察の課題を用意しました。

    もくじ

    シンメトリーとアシンメトリーの違い

    シンメトリーは対称、アシンメトリーは非対称という意味です。デザインでは、中心の軸をはさんで左右(または上下)が同じ形かどうかで分けます。

    シンメトリーアシンメトリー
    軸の左右が同じ軸の左右が違う
    伝わる印象安定・信頼・格式・静けさ動き・軽さ・今っぽさ
    視線中央で止まる重いほうから軽いほうへ流れる
    作りやすさそろえるだけで形になるバランスを取るのが難しい
    向く題材名刺・冠婚葬祭・老舗・士業LP・雑誌・イベント・若い層向け
    シンメトリーとアシンメトリーの比較図。中心線に揃えた左右対称のポスターと、あえてずらした非対称のポスターを並べ、それぞれの印象を示した図解

    左は中心線の左右を同じ形にしたポスターです。落ち着いて見えて、「まじめなお店だろう」と伝わります。
    右は写真を左に大きく寄せて、文字を右に置きました。同じ情報量でも、動きが出て目が流れていきます。

    どちらが上手いという話ではありません。伝えたい印象で選ぶだけです。老舗の和菓子屋を非対称で崩すと軽く見えますし、若者向けのイベントを完全対称にすると堅く見えます。

    対称には3つの型がある

    シンメトリーと聞くと左右対称だけを思い浮かべますが、軸の取り方で3つに分かれます。

    対称の3つの型の分類図。線対称・点対称・放射対称のそれぞれの形と、デザインで使う場面を3枚のカードで並べた図解
    対称の3つの型
    • 線対称:1本の軸をはさんで左右または上下が同じ形。デザインで使うのはほぼこれです
    • 点対称:中心の一点を軸に180度回した形。トランプの絵札や、上下どちらから見ても読めるパッケージに使います
    • 放射対称:中心から同じ形が回りながら並ぶ形。紋章やシンボルマークで見かけます。中心へ目が集まります

    迷ったら線対称で構いません。点対称と放射対称は、ロゴやマークのような小さい図形で力を出します。ページ全体を放射対称にすると、読む順番が作れなくなります。

    身近な線対称は、無印良品の紙袋やパッケージです。ロゴを中心に置いて左右を同じ形にしています。まじめで落ち着いた印象は、この形からも来ています。

    シンメトリーが向く場面

    左右をそろえると、見た目の重さが中央で釣り合います。人はこの状態を「整っている」と感じます。次のような場面で選んでください。

    シンメトリーを選ぶ場面
    • 信頼を伝えたいとき:士業の名刺、病院の案内、公的なお知らせ
    • 格式を出したいとき:招待状、賞状、老舗の包装
    • 要素が少ないとき:ロゴ・キャッチコピー・日付だけの告知なら、中央にそろえるのがいちばんきれいにまとまります
    • 時間がないとき:中心線に置くだけで形になります。判断に迷う回数が減ります

    注意したいのは、要素が増えたときです。文章が5行以上あると、行ごとに文字数が違って左右の端がガタガタになります。中央ぞろえは要素が3個以下のときだけにしてください。

    アシンメトリーが向く場面

    アシンメトリーは、中心をわざとずらして左右の面積や重さに差をつける作り方です。ばらばらに置くこととは違います。差をつけたうえで、全体の重さは釣り合わせます。

    アシンメトリーを選ぶ場面
    • 動きを出したいとき:イベント告知、スポーツ、飲食の新商品
    • 情報量が多いとき:写真と文章を左右に分けると、両方に十分な面積を渡せます
    • 視線を運びたいとき:大きい要素から小さい要素へ目が流れます。流れる先にボタンを置けます
    • ありきたりを避けたいとき:同業他社が全部中央ぞろえなら、崩すだけで違って見えます

    釣り合いの取り方は面積だけではありません。小さくても色の濃いものは重く見えます。左に大きな写真、右に小さくて濃い色のボタン。この組み合わせで釣り合います。

    雑誌の表紙やYouTubeのサムネイルを見てください。人物を片側へ寄せて、反対側に文字を置いた形がたくさんあります。あれがアシンメトリーです。

    どちらを選ぶかの決め方

    作りはじめる前に、3つ自分に聞いてください。3つとも同じ答えに寄るはずです。

    1. 相手にどう思われたいか:安心してほしいならシンメトリー、面白がってほしいならアシンメトリー
    2. 要素はいくつあるか:3個以下ならシンメトリーで足ります。5個を超えたらアシンメトリーのほうが収まります
    3. 写真は使うか:主役級の写真が1枚あるなら、アシンメトリーで大きく使うほうが力が出ます

    1つの作品で両方を混ぜないでください。上半分が中央ぞろえ、下半分が左寄せだと、崩したのか失敗したのか伝わりません。決めたら最後まで通すのがいちばん大事です。

    完全な対称にしないほうがいい場所

    シンメトリーを選んだときでも、全部を数値どおりに合わせると、かえって不安定に見える場所があります。

    上下の余白

    上下をぴったり同じ幅にすると、少し下がって見えます。人の目は真ん中よりやや上を中心だと感じるからです。
    上を少し狭く、下を少し広くしてください。名刺サイズなら2〜3mmの差で落ち着きます。

    丸い文字や図形の位置

    円は四角と同じ大きさにすると小さく見えます。ボタンの中の丸アイコンも、数値で中央に置くとわずかに上に見えます。
    目で見て合っているほうを採用してください。数値より見え方が優先です。

    文字の左右

    「T」や「A」のように、文字ごとに字面の広さが違います。中央ぞろえにしても、行の端がそろって見えないときがあります。
    気になるときは字間を微調整します。やり方は文字詰めの基本で扱っています。

    ミニ実践:実例を1つずつ集める

    見分けられるようになると、自分で選べるようになります。所要時間は15分、道具はスマホのカメラかスクリーンショットだけです。

    1. 身のまわりの印刷物やWebサイトから、シンメトリーの実例を1つ探して撮ります。お菓子のパッケージ、名刺、病院の看板などが見つけやすいです
    2. 同じようにアシンメトリーの実例を1つ探して撮ります。雑誌の表紙、飲食店のLP、SNS広告に多いです
    3. 2枚を並べて、それぞれ中心線を指でなぞります。左右が同じか違うかを確認します
    4. それぞれについて「どんな印象を受けたか」を一言で書きます(安心・高級・楽しそう、など)
    5. 最後に「この会社はなぜこちらを選んだと思うか」を1行で書きます

    5に答えられたら、自分の作品でも同じ判断ができます。集めた画像は消さずに残しておいてください。似た仕事が来たときの参考になります◎

    自分の作品を見直すときは、次のチェックリストを使ってください。

    選び方のチェック
    • 対称にするか非対称にするかを、作りはじめる前に決めた
    • 1つの作品で両方が混ざっていない
    • 非対称なら、左右の重さが釣り合っている
    • 対称なら、上の余白が下より少し狭い
    • 選んだ理由を一言で説明できる

    やってしまいがちな失敗

    とりあえず中央ぞろえにする

    迷ったから中央、という選び方だと、文章が増えたときに端がガタガタになります。
    直し方は、要素を数えることです。4個以上あるなら左ぞろえに変えて、1本の線を作ります。

    崩したつもりが散らかっただけ

    アシンメトリーにしようとして要素を好き勝手に置くと、ただ乱れて見えます。
    直し方は、左右の分け方を先に決めます。5対5ではなく、6対4や7対3のように比率で決めてから中身を置いてください。

    片側だけが重い

    左に大きな写真、右にすき間だけ。これでは倒れて見えます。
    直し方は、軽いほうに濃い色か太い文字を1つ足します。面積で釣り合わなくても、濃さで釣り合います。

    対称にこだわって情報を削る

    形をそろえるために必要な情報を削ると、伝わらない広告になります。
    直し方は、形より内容を優先します。入りきらないならアシンメトリーに切り替えてください。

    よくある質問

    シンメトリーとアシンメトリーの違いは何ですか?

    中心の軸をはさんで左右(または上下)が同じ形ならシンメトリー、違う形ならアシンメトリーです。
    見た人が受ける印象も変わります。シンメトリーは安定・信頼・格式、アシンメトリーは動き・軽さ・今っぽさが伝わります。要素が3個以下ならシンメトリー、5個を超えるならアシンメトリーが収まりやすいです。

    アシンメトリーなデザインとは、どういうデザインですか?

    中心をわざとずらして、左右の面積や重さに差をつけたデザインです。写真を画面の左7割に敷いて、文字を右3割に寄せるレイアウトが代表的です。
    大事なのは、差をつけたうえで全体の重さを釣り合わせることです。ばらばらに置くのはアシンメトリーではなく、ただの乱れになります。

    シンメトリーの代表例を教えてください

    身近なものだと、トランプの絵札(点対称)、蝶や葉の形(線対称)、雪の結晶(放射対称)があります。
    デザインでは、名刺・招待状・賞状・書籍の表紙・企業のシンボルマークによく使われます。建築ではタージ・マハルやパルテノン神殿が左右対称の例として有名です。左右をそろえた形は、格式や永続性を伝える場面で選ばれてきました。

    Webサイトはどちらで作るのが正解ですか?

    1ページの中で使い分けます。ヘッダーやフッターのように毎回出る部分は対称にそろえると落ち着きます。本文の中の紹介ブロックは、写真と文章を左右に分けた非対称のほうが読みやすくなります。
    スマホでは縦1列に並ぶので、左右の差は消えます。パソコンで非対称に組むときは、スマホでの並び順も確認してください。

    次に学ぶこと

    このレッスンの要点をまとめます。

    • シンメトリーは安定と信頼、アシンメトリーは動きと軽さ
    • 対称の型は線対称・点対称・放射対称の3つ。使うのはほぼ線対称
    • 要素3個以下なら対称、5個を超えるなら非対称が収まりやすい
    • 非対称でも、左右の重さは釣り合わせる
    • 1つの作品で両方を混ぜない

    次は第2章のレイアウトへ進みます。グリッドレイアウトを覚えると、対称でも非対称でも、要素の位置を迷わず決められるようになります。
    順番の決め方をもう一度見たい方は視線誘導と視覚的階層へ戻ってみてください。

    ほかのレッスンはデザインの基本コース目次から選べます。

    第1章 デザインの原則 の他のレッスン

    前後のレッスン

    ← コースの目次へ戻る

    目次

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

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

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

      FOR BUSINESS

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

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

      研修について相談する

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

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