地味だけど大事!ロゴリニューアルに使えるデザインの小技

スタッフブログ

デザイナーの笠井です。

先月弊社が運営する英会話教室「ランゲージパートナーズ」のサイトが
リニューアルオープンしました。

サイトリニューアルにあたり、ロゴを変更したのですが、
みなさんこの違いがわかりますか??

間違い探し問題としては若干難易度高めかと思います。
わかりやすく違う部分もあれば、よく見ないと気づかない、というか
やった人間しかわからない部分もあります。
今回は、ロゴデザインリニューアルにあたって考えたことと、意外と地味だけど大事なデザインの小技を解説していきたいと思います。

ロゴを新しくしたい!でも印象は変えたくない!

ロゴデザインをガラッと変えるという案もありましたが、やはり今まで皆さまから親しまれたロゴで愛着もあるので、
話し合いの結果、大きくは変えずに整える、という方向で決定しました。

経営担当者から、今まで使用していたロゴに関して
「全体的にちょっとバランスがわるい気がするので整えてほしい」
という要望がありました。

まず何がバランスを崩している要因なのかを考えます。

既存のロゴデザインの意図を確認

英会話教室のロゴなので、曲線が多い特徴的なゴシックフォントを使用して親しみやすい印象を与えつつ、
規則的に同じフォントを使いバランスよく並べて整った印象、誠実な印象を与えたい、
という意図をもって作られたことがヒアリングによってわかりました。

その印象を崩さないよう、より伝わるように調整をしていきます。

バランスを崩している要因を探す

「Language」と「Partners」の二行の部分で
上段と下段の文字の大きさが違います。
そのまま「Language」と「Partners」を並べると、それぞれの文字の幅が違うため
この幅をととのえるために、「Partners」を大きくして上段に長さを合わせているようです。
これがバランスを崩している要因です。

「a」が近い位置にあるので、大きさの違いがよくわかりますね。

誠実さや整った印象などを目的としている場合、このようなちょっとしたフォントの大きさの違いや規則性のズレがあると
ひとつひとつが小さな違和感となり、全体の完成度に影響してしまいます。

全体の印象は変えない、ということが大前提ですので、
現在の四角いフォルムはそのままに、
「Language」と「Partners」を二段に重ねて、
うまく四角いフォルムを作るためどうバランスをとるかを考えます。

バランスを調整する試行錯誤

そもそも「Language」と「Partners」は同じ8文字ですが、
アルファベット個体が持っている幅が違うため、単語になると同じ字数でも長さが変わってしまいます。

「t」「r」「s」は「a」「g」「e」より幅が狭いですね。
このように個々に違う幅のものを、長さを合わせるにはどうすればよいでしょう。

字間を調整する、平体や長体を使っての調整など様々試しましたが
どうもしっくりきませんでした。

バランスを調整するため辿り着いた解

試行錯誤の結果、
フォントに手を加えて全ての文字を同じ幅に作り変える、という結論に至り
実行してみました。

基本とする文字は「a」
この形を基本として、すべての文字の幅を合わせて作り変えます。

いかがでしょう。
文字が微妙に変形されていますが、大きく印象は変わっていないはずです。
このアルファベットを使って規則的に整っている形をつくることが可能になります。

マークの調整

LPのマークについても調整します。

まず、マーク上部に小さく入っている「Language Partners」は無くしてほしいという要望があったので削除します。

次に形の見直しをします。
「L」と「P」を一筆でつなげたようなマークです。
このつながりの部分の位置ズレが若干気になったので、調整をします。

さらに、この「L」と「P」はつながっている、という部分をはっきりさせるため、
端の処理、つながっていて隠れている部分の処理と、わかるように違いを出します。
おそらくぱっと見の違いはわかりませんが、
こういった細部にこだわることで全体の与える印象も変わっていきます。

完成!

いかがでしょう。
印象を変えずにデザインを良くするためにどうしたらよいか、
試行錯誤の過程をご紹介しました。
一つ一つの作業は地味ですが、こういったちょっとしたほころびを修正する(直す)ことで全体がきれいに整い、
よりよい印象にすることが可能になります。

「神は細部に宿る」
ですね。

こういったぱっと見はわからないけど必要なデザインの小技はまだいろいろあるので
機会があればまた記事にしたい思います。