課題提出ポートフォリオのロゴデザイン

ポートフォリオサイトを制作するにあたり、シンボルマークは作らずロゴタイプのみでデザインを進めようと考えていました。
しかし、今回の課題を通じロゴを作りだしていく過程で、ロゴの役割について改めて考え直しました。

今回作成するロゴは、自分のポートフォリオサイトの顔となる重要な存在である。そう考えた時、 「ロゴを活かしたサイトのデザイン」 こちらに挑戦することで、自身についてより印象づけることができるポートフォリオサイトに繋がるのでは、と考えました。

そんな、ポートフォリオサイトのデザインの要となる(ことになった)今回のロゴデザイン。
完成したものをご紹介します。

ロゴデザイン

シンボルマーク

シンボルマーク(メイン)
自身の名前「シノダマナ」の文字を使い、形を組み合わせて自分を表現しました。言われてみれば…!と分かる程度には文字を崩しすぎないことを意識しています。このロゴを見ることで、このロゴの人物はどんな人なのかを思わず想像してしまったり、いろんな方にロゴと一緒に覚えていただけたらいいな、という願いをこめています。
基本カラーは#303030です。真っ黒ではなく、親しみやすさを感じるような優しい色を選びました。
シンボルマーク(白ライン)
背景は透過しています。暗い色の背景の上に置く場合は、カラーが#ffffffのものを使用します。
シンボルマーク(白背景)
背景をベタ塗りにし、丸で囲むタイプも作成しました。その場合、背景色は#ffffffとします。
シンボルマーク(黒背景)
背景ベタ塗り丸アイコンのカラーを反転したバージョンです。

ロゴマーク(縦組み)

ロゴマーク縦組み(メイン)
シンボルマークと同様にパターンを作成しました。ロゴタイプはシンボルマークでも用いたカタカナをメインに使用しました。特に「シ」については、シンボルマークのデザインにも扱っている「○」の記号を文字に取り入れました。
ロゴマーク縦組み(白ライン)
ロゴマーク(縦組み)の白ラインのパターンです。
ロゴマーク縦組み(白背景)
ロゴマーク(縦組み)の白背景のパターンです。
ロゴマーク縦組み(黒背景)
ロゴマーク(縦組み)の黒背景のパターンです。

ロゴマーク(横組み)

ロゴマーク横組み(メイン)
ロゴマーク横組み(白ライン)
ロゴマーク横組み(白背景)
ロゴマーク横組み(黒背景)
こちらもシンボルマークと同様にパターンを作成しました。
角の角度はシンボルマークの丸みと違和感のないように調整しました。

デザインについて

コンセプト

ロゴ制作にあたり、まずは「どのようなポートフォリオサイトを制作したいのか」について考えました。

ポートフォリオサイトを制作することで、「自分のことを覚えてもらいたい」「一度この人に会ってみたいと感じてほしい」「見た人の印象に残るものにしたい」という考えが強くあることに気がつきました。

また、自分の人となりを改めて考えてみた時、 「ユーモアのある人でありたい」「親しみやすい人間でありたい」と考えていることも自覚しました。
ユーモアのある人のまわりには自然と笑顔が生まれることや、親しみやすい人間であるからこそ豊かなコミュニケーションが生まれたり、良い行動体験につながるのでは、と考えたからです。自分がそうであるというより、そうなりたい!と目標としています。

そこで、ロゴをデザインする上でのコンセプトとして

  • 印象に残る、覚えやすいデザイン
  • 遊び心のあるデザイン
  • 親しみやすさの感じるデザイン

以上の3点をテーマに設定しました。

制作の流れ

ロゴデザインのラフスケッチ

まずは手元のメモ帳にアイデア出しとしてラフスケッチを書きました。基本的に名前のイニシャルや頭文字から考え、形を組み立てました。思いついた勢いで書いているので綺麗ではありません…。

ロゴデザインのIllustratorアートボード

ラフスケッチの中からさらにイメージを広げていきたいと感じたものについて、Illustrator2025にてアートボード上に作成し、どのパターンが良いかを検証しました。縮小ツールを用いたり、席から離れ俯瞰的に眺めたりして、コンセプトに沿っているもの・一番しっくりくるものを考え、自分の顔を名前の文字で表現したものを選びました。また、ポートフォリオサイトでは自分の名前をカタカナで載せようと考えていたため、カタカナを用いてデザインしたものに決定しました。カタカナである理由は、文字で名前を書いた際、パッと見てすぐに名前を判別しやすいと感じたためです。

ロゴデザインのフォント選定・ロゴタイプの作成

選んだシンボルマークを元にフォントを選定し、ロゴタイプを作成しました。メリハリをつけるために、フォントはゴシック体の 「しっぽり太ゴシックB2 Bold」 を選び、シンボルマークの線もゴシック体に合う角の形に変更しました。また、シンボルマークのポップなイメージに合わせつつ視認性を保つために、ロゴタイプは大幅な変更を加えず、シンボルマークにも登場する「○」の記号を用いて元の書体から変化をつけました。

完成!

ロゴ(シンボルマーク) ロゴ(ロゴタイプ縦組み)
ロゴ(ロゴタイプ横組み)

感想

ポートフォリオサイトのコンセプト案を考えていたところだったので、ロゴのアイデアは意外と出てきましたが、しっくりくるものについては延々と悩み続けました。このデザイン自体を思いついたのもかなり時間が経ったあとで、自分の顔をシンボルマークにするのめちゃくちゃ恥ずかしいな…と思いましたが、その方が顔とセットで覚えてもらいやすいのでは…ということは狙いに一番沿っている…ってコト!?と自分で納得させ、最終的にこの形に収まりました。コンセプトの重要性を改めて感じました。

提出用サイトについて、ポートフォリオでの作品紹介にも活かせるレイアウト・作品として載せられるようなものが作れたらと考え、noteで作品を紹介されている方々などを参考に、サイト上でロゴをプレゼンするつもりで作成したら、結構なボリュームになってしまいました。言語化して作品を紹介することはとても大変な作業でしたが、こだわればこだわるほどアピールできる場であるとも感じました。ポートフォリオ作成がんばります…!