プログラミング
前回
前回はInkscapeを使ったエンブレムの作成を行った。今回は、いよいよロゴの作成に取り掛かる。
1. はじめに
Webデザインでロゴを作成する場面は多いと思う。ベクター画像形式のペイントソフトであるInkscapeを使ってロゴを作成する方法をこの記事で紹介する。
ツールの試用は前回行ったので、ツールの使い方というよりもデザインの手順に焦点を当てて書く。Webデザイン以外でもパンフレット作成などでも使用できるので、触ってみて損はないと思う。
今回は「こころクリニック」という架空のクリニックのロゴ作成のつもりでデザインを進める。
2. キーワードの抽出
まずはデザインの元となるキーワードを抽出する。
「こころクリニック」から私がなんとなく想像した単語は「安らぎ」「こころ」「解放」の3つだった。
とりあえず手書きでも何でもいいので図に起こしてみる。
3. キーワードを膨らませる
続いて、浮かんだキーワードを思いつく限りでいいので膨らませてみる。
私の場合は次のように膨らんだ。(単純であるのには目をつぶってほしい…。)
4. ロゴデザインを行う
キーワードをある程度出したらその中からデザインに使えそうor使いたいワードを選び出す。
今回は「ハート」「扉を開く」「緑」を選んだ。
4-1. 直線を引く
まずはハートを作る。Inkscapeを起動し、縦の直線を引く。
4-2. ノードツールで変形する
上で引いた直線をノードツールで選択し、ハートの半分になるように変形する。
4-3. タイルクローンで複製する
上で作ったハートの半分を編集>クローン>タイルクローンを作成するで作成する。対称化タブを選択し、PM：反射を選び、行×列を1×2にして作成ボタンを押す。
このとき、実は左側に2つ図形が重なっているので、1つを消しておく。
4-4. パスを統合する
先ほどの図形をすべて選択し、編集>クローン>クローンのリンクを解除を選択し、リンクを解除しておく。
そしてパス>統合でパスを統合する。
するとハートの形が出来る。真ん中の線は不必要なので、ノードツールで選択し、削除しておく。
オブジェクト>フィルとストロークからハートに色を付ける。色はキーワードで出た緑を選択する。
4-5. 長方形で切り抜く
最後のキーワード「扉を開く」を表現するため、ハートにドアを付ける。矩形ツールで長方形を作り、ハートの上に重ねる。
そして全選択してから、パス>排他を押してハートをくり抜く。
4-6. ドアを作る
先ほどくり抜いた部分に同じサイズの長方形を矩形ツールで作成し、オブジェクト>変形を押して変形ペインを出す。
傾斜タブを選択し、垂直の値を適当に入力してドアが開いたような形を作る。
5. 完成
最後円ツールでドアノブを作成して完成！
以前作ったトップページに組み込んでみるとこんな感じ。(色は後から調整した。)
ページにも馴染んでいて何となくクリニックを想起するロゴが作成できた(と思う)。
6. まとめ
まったくデザインセンスが無くてもやり方を覚えれば何となくでも形にできることが分かった。
絵が描けるような人だともっと使いこなして面白いデザインのロゴを描けるのかもしれない。
ともあれ、形にできるという意味で1歩進めたので、精進しようと思う。
皆さんもぜひ触ってみてほしい。
参考サイト
はじめてでも簡単！Inkscapeを使い、1分でハートを描く