mokmal time

日常感じたことや、考えたことなどを忘れないようにメモするブログ。

知識がなくても簡単にできる。Inkscape(無料ソフト)でタイトルロゴをデザインしてみた。

      2017/09/08

medium_5064520524

ブログのタイトルロゴをカッコよくオリジナルにしたいなと思っていたのですが、ようやくまとまった時間が取れたので変えてみました。
出来上がりがこんなやつです。

titlerogo

巷ではGIMPを使ってる人が多いみたいですが、そこらへんよくわからないので使い慣れているInkscapeを使いました。Inkscapeはフリーソフトで,Adobeソフトに例えるならGIMPは Photoshop, InkscapeはIllustrator みたいな位置のソフトです(多分)。

デザイン職ではないワタシが、急にパンフレット作成を任された時に非常に頼りになったソフトです。

photo credit: Niels Linneberg via photopin cc



SPONSORED LINK

タイトルロゴを簡単に作る手順

Inkscapeのインストール

まずはこちらから、Inkscapeをダウンロードします。

inkscape_downroad

サイズを設定する

サイズは少し大きい方が見やすいので、「548×150」くらいにしました。
「ファイル」→「ドキュメントの設定」→「カスタムサイズ」の数字を変更してます。

Inkscape_size

ベースを決める

じっくり時間をかけて作りたいのですが、限られた時間なのでとりあえず現状のテキストのままのタイトルロゴから脱出!ということでカンタンに進めます。

まずは完成形をイメージして大枠を決めます。タイトルなので文字ベースで制作しますが、あとで変更も可能なのでぼんやりするイメージでいいです。

①テキスト選択

ブログタイトルはmokmal timeなので(なぜこのタイトルにしたのかはまた後日に)Inkscapeを立ち上げてテキストでタイトルを入力します。

②フォントや大きさの選択

inkscape_title

色を決める

これは重要ですね。タイトル=ブログのイメージにつながるのでイメージカラーを選びます。
色はたくさん選べますので、たくさん見てみてください。いろいろ試すと以外な発見があるのでオススメです。
色は下から選びます

Inkscape_color

立体感をつける

最近はフラットなものが流行っているみたいですが、フラットデザインは一枚ものであれば映えますね。
それでは立体的に影をつけます。そのままバックに文字を移動することで影ができますが、文字を動かす時にとても不便なので別レイヤーで作成すます。

レイヤーの作成

「レイヤー」から新規レイヤーを開きます。

Inkscape_sinki
レイヤーに名前を付けます。名前は分かりやすくbackとつけました。

rayer1

文字を重ねる

先に作成した文字をコピーします。レイヤーは最初に作成した「レイヤー1」です。

inkscape_mae


コピーした文字を先ほど作成した①「back」レイヤーを選択して②貼り付けます。

inkscape_back

コピーした文字の色をグレーにして、①「オブジェクト」から「フィル/ストローク」を選択して②「ぼかし」で文字をぼかします。

inkscape_bokashi

二つの文字を重ねてバッチリ調整したら、2つのレイヤーを固定します。
※間違って触ってしまって文字がズレることがありますので固定したほうがいいです。

inkscape_rock

あとは下の文字を入力して位置を調整し固定すればタイトルロゴの

完成です。

inkscape_OK

作成したデータを画像データに変換

そのままでは使えないので、PNG データに変換してサーバーにアップします。
「ファイル」⇒ 「ビットマップにエクスポート」
エクスポートの領域は「ページ」を選択します。
ファイル名と出力場所決めて(デスクトップが良いかと思いますが)「エクスポート」をクリック

inkscape_export

これで.pngデータに変換されましたので、あとはサーバーにアップするだけです。

あとがき

デザインの才能が欲しいなぁ。
自分なりに満足していますが、これをこうしたほうがなんてアドバイスしてくれる方いれば、ぜひぜひお願いします。

 - stinger, やったこと

SPONSORED LINK

SPONSORED LINK

SPONSORED LINK

SPONSORED LINK
  • このエントリーをはてなブックマークに追加
  •  
  •  

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

  関連記事

10倍楽しめる!【ロスジェネの逆襲・感想】ドラマ半沢直樹を観ずに読んでも面白い。

ついついドラマを見逃し世間の話題から取り残されていたmokmal(@mok7al …

たった2分!MacのマウスをWindowsと同じように”右クリック”マウスに変身させる方法

PCをWindowsからMacに乗り変えて真っ先に違和感を感じたことって言えば& …

『サイトマップ』が表示エラーになり対応したこと

サイトマップが急に表示されなくなってました。 おかしいと思い色々と調べてみると …

【STINGER3/WordPress】初心者のワタシが簡単にできたカスタマイズをまとめてみる

このブログで使用しているテーマ「STINGER3」 カスタマイズした箇所をより良 …

STINGER3カスタマイズ 消すのはもったいない!追尾するSNSボックスをおしゃれにカスタマイズ。

追尾式のSNSボックスってスマホで見た時に記事にかぶるから消してたんですが、復活 …

ブログテーマをSTINGER5に変更してすぐに変えたアドセンスの位置について

いかがお過ごしですか。@mok7malです。 タイトルがメールの表題みたいですが …

MacでMT4を稼働する4つの方法を考えてみて、もっとも都合の良い方法はコレだった。

先日購入したiMacでWindows同様にMT4を稼働させようと試して四苦八苦し …

コンビニで楽天スーパーポイントが貯まる!サークルK・サンクスの「+K Rポイントカード」を登録してみた。

買い物はほとんどネットで済ませているmokmalです。 10月1日よりコンビニの …

googleアカウントに不正アクセスがあった。急いで対応!!

Shocked / prawnwarp 事件は就寝間際に発生しました いきなりこ …

家の壁に穴が空いても簡単に補修できる「壁の穴かんたん補修セット」に驚いた。ついでに壁をおしゃれにDIYリフォームした。

突然ですが、家に帰ると壁に穴が空いていたらどうしますか? もちろん驚きますよね。 …