おしゃれでレトロなドットロゴの作成方法Illustratorなら自分で簡単にできる

ドット絵って聞いたことがありますか？イラストの輪郭線がスムーズではなく、モザイクのようにカクカクしていて「荒い」感じに見える絵。そう、ファミコン世代なら誰もが目にしていたキャラクターチップなどといえば、思い浮かびますよね。

レトロな感じがノスタルジーを誘うのか、ドット絵が再び脚光を浴びているようです。ドット絵で作られたロゴがドットロゴ。どうやって作るのか、その作成方法も見ていきましょう。

ドット絵って何のこと？

「ドット絵」という言葉を聞いたことはありますか？文字通り「ドット」で描かれた絵のことなのですが、その前にそもそも、「ドット」っていったい何のことを指すのでしょう？ドットとは、ピリオドのことを指す場合もありますが、「点」やそれに近い「円」のことです。

水玉模様のことを「ドット柄」と呼んだりもしますね。その「ドット」で描かれた絵を「ドット絵」と呼んでいます。これはコンピューターグラフィックスの技法のひとつです。コンピューターの画面上に出力できる最小単位の小さなマス目に色を置き、モザイクのように並べて表現したものです。

黎明期のコンピューターは解像度も使える色数もごく限られていました。データサイズを小さくするため、2色、4色、8色、16色ほどの色数で絵を表現していたのです。

広い意味では、正方形になっているマスを最小単位にして描かれたものであれば、コンピューターグラフィックスではなくても「ドット絵」とされることが多いようです。刺繍のクロスステッチも、布地の四角いマス目を様々な色糸で刺していく技法なので、「ドット絵」に近い表現方法の刺繍といえますね。

ロゴって何のこと？

さて次にロゴって何のことでしょう？「会社のロゴ」ってよく聞きますよね。団体名や商品名などを印刷・表示する際に使用されるもので、看板やパンフレットやパッケージ、封筒類に印刷されたり、テレビのCMなどでも表示されたりします。

日本ではロゴと略すことが多いのですが、ロゴタイプ (logotype) のことで、デザインされた文字のことを指します。ロゴタイプとマークを合わせてデザインしたものを、ロゴマークと呼びますが、ロゴと略して使っている場合もあります。

ロゴは「そのものらしさ」を有効に伝えるツールでもあり、宣伝にも大きな役割を果たします。

ドット絵でロゴを作ったら「ドットロゴ」

2019年現在、コンピューターグラフィックスでは滑らかなグラデーションを自由自在に使えます。コンピューター初期の1980年代頃に比べると使える色数も驚くほど増え、陰影豊かなイラストがいくらでも描ける時代となりました。

だからこそなのか、昔なつかしドット絵にノスタルジーを感じる人もいれば、逆に若い世代にはドット絵が新しく感じられたりもするんですね。再び脚光を浴びつつある「ドット絵」で作られたロゴが「ドットロゴ」というわけです。

「ドットロゴ」を手描きで作ってみよう！

方眼紙などの正方形になっているマスを1つづつ塗りつぶしていけば、手描きの「ドットロゴ」ができあがります。やはり下絵（文字も）を用意して、薄手の方眼紙を上にかぶせて描いていくのがやりやすいでしょう。好きなイラストやマークに名前、会社名、屋号、商品名などをレトロなドットロゴで表現したら、楽しめること間違いなしですね。

これは、手間をかけることに職人的な喜びを感じる人にオススメです。

Illustratorのソフトで作る「ドットロゴ」

次に、本格的な「ドットロゴ」が簡単にできてしまう作成方法をご紹介します。ただしこれは「Illustrator」というソフトを使います。デザイナーなら誰でも持っているソフトですが、一般の人にはあまり馴染みがないかもしれませんね。

しかし、イラストを描くのが好きな人なら持っておいて損はない、様々な描き方ができるソフトです。これはマス目をひとつひとつ塗りつぶしていくやり方ではなく、下絵からダイレクトに「ドット絵」を作る方法です。下絵は自分で描いたイラストなら、なおいいでしょう。

ドット絵はシンプルさが命なので、なるべく形も色も単純化したものを用意します。では、早速作っていきますよ。1.元になるイラストはイラストレーター上で描いたものでも、写真データ（jpegやpng形式のもの）でも構いません。

イラストレーターで描いたものはそのまま配置し、写真データの場合は「ファイル」から「配置」を選択します。2.配置したイラストや写真を選択し、「オブジェクト」から「ラスタライズ」を選択します。カラーモードはCMYK、高解像度（300dpi）に設定します。

この時点では画像に変化はありません。3.選択された状態のまま、さらに「オブジェクト」から「モザイクオブジェクトを作成」を選択します。ドットの大きさはタイル数によって変化しますので、好みの大きさになるよう調整します。

ドットが正方形になるよう幅と高さの数値も調整しましょう。4.イラストレーターで描いたイラストの場合は、不自然な部分の色や形を修正すればここで完成です。写真データの場合は、背景の不要な部分をダイレクト選択ツールを使って削除し、細かい部分を修正して完成です！

とても簡単にできましたね。「ドットロゴ」らしくするための秘訣は２つあります。ドットをあまり細かくしすぎないことと、色数を多くしすぎないことです。

ドット絵らしさが損なわれないようほどほどにしておきましょう。

ビットマップフォントはファミコン風フォント

さて「ドットロゴ（文字）」を作るのに、上記のIllustratorのソフトで作ってもいいのですが、「ビットマップフォント」というものがあります。

これはコンピュータの文字の形式で、文字を点（ドット）の集合体として表現したフォント（字体）なんです。

まさに、カクカクとしたファミコン風フォントです。ビットマップフォントにはフリーで使えるものも、漢字が使えるものもあります。これを使ってアレンジすれば、「ドットロゴ（文字）」がすぐにできますよ。ビットマップフォントにも様々な個性があるので、ぜひ自分のお気に入りを探してみてくださいね。

クロスステッチは「ドットロゴ」？

さて、番外編というべきかもしれませんが、刺繍のクロスステッチも「ドットロゴ」に近いのではないでしょうか？クロスステッチは刺繍の刺し方の1種ですが、布地が四角いマス目になっているんですね。そのマス目の１つ１つを刺繍糸でクロスに刺して埋めていきます。

「ドット絵」に近い表現方法の刺繍といえるでしょう。クロスステッチの刺し方の本やデザイン集はとてもたくさん出ています。こちらは、男子のファミコン的「ドットロゴ」とはまた違った、ガーリーな女子のおしゃれな「ドットロゴ」を作る参考になると思います。

ぜひ手にとってみてくださいね！クロスステッチで「ドットロゴ」を表現してみたら、新たな楽しみが広がるかもしれませんよ。

関連情報...ロゴのデザイン：ビズアップ ... ロゴ作成のビズアップ