仕事中に見つけたロゴを勝手に視覚調整する試み(2)

前回に引き続き、ロゴの視覚調整シリーズ。こちらも2年前の試み。当時勤めていた会社の中で見つけたロゴを、勝手に視覚調整します。

試行

例によってロゴの紹介とかはしません。毎度ですが、ロゴの正規のデータがあるわけではないので、トレースしたものを使用します。ひとまず、調整前後の画像を。

アウトラインでの比較

まず、ロゴから感じるジオメトリック感、格子に従ってパスを引いた感。もうすこしヒューマニストというジャンルのフォントに近づけたいなぁという感じ。

オリジナルの分析

オリジナルの分析

まず気になっている箇所をまとめてみます。

  • 縦と横の線の幅
    • 同じ幅になっているので、横を細くすることで調整します

    • 円形の文字は、見た目の水平方向の線(Xハイト、ベースライン)よりも小さく見えがちなので、上下少しはみ出すようにします
  • Sのギクシャク感をなんとかする
    • 変曲点に角度をつけてあげることでなんとかスムーズにしてあげたい
  • カーブの進入
    • 全体的に硬いので、もう少し緩やかにカーブに入れるように調整
  • 複数のストロークが連結するポイント
    • 黒みが増してしまうので、スッキリさせる

1回目の試行

なんとか調整してみました。それでも「S」のギクシャク感は残ります。

1回目の視覚調整

2回目の試行

1回目と比べてSのカーブは緩やかになりました。しかしながら、ちょっともっさりしてしまったかもしれません。2回めでもまだ赤を入れたい感じ、入れたし。

2回目の視覚調整、下段は1回目との比較

1回目の視覚調整と、2回目の視覚調整をそれぞれオリジナルと比べてみました。やはりSはだいぶマシになったかなぁと言う感じ。

こうしてみると、aとpは下寄り、yとnは上寄りに見えます。視覚調整後は軽減されているもののまだという感じ。

1回目と2回目の視覚調整をそれぞれオリジナルと比較

まとめ

円と直線だけで構成されている文字だからこそ、視覚調整した方が良いと思っての取り組みでした。いろいろ調整してみましたが、「S」の歪んだ感じは課題が残ったし、「a」「p」が正円のままになっていたりと、まだ直せそうです…。

全体的には、線の流れがスムーズになって、もっさりした感じを取り除くことができたと思います。

投稿者: sussan_0416

さいたま市に住む一児のエンジニア。出身は北海道札幌市、学生時代に過ごした函館が好き。仕事はiOS・Androidのスマホアプリ開発。過去にはバックエンドのAPI開発(PHP)、広告配信を最適化する機械学習システムの開発(Python)を担当。