Inkscapeを使ってトップページの画像を作ってみた

2015年8月2日2021年12月5日

ブログを開設するに際して、トップページの画像をどげんかせんといかんということで、早速作ることにしました。

Contents

はじめに

この手の用途に用いるツールといえば、Adobeさんのツールが有名ですが、私みたいなデザインセンスがなくてちょっとしたものを作れれば良いってレベルには宝の持ち腐れです。

そこで、無料のツールを探していたところ、Inkscape(インクスケープ)が良さげとのことでインストールとトップページ画像を作成してみました。

インストール環境

Windowsマシンも持っていますが、デザインならMacでしょ〜ということで Macbook Proにインストールします。

PC：MacBook Pro Retina Mid 2014
OS：OS X Yosemite ver 10.10.4

Inkscape：Stable release 0.91
XQuartz：2.7.7

インストール方法

Inkscapeの公式サイトからインストーラをダウンロードしてインストールするだけです。

Draw Freely | Inkscape　

1点、サイトに記載されているようにXQuartzというアプリも必要とのことなので、あわせてダウンロードしてインストールします。

起動

Macのアプリケーション一覧にInkscape.appがあると思いますので、こいつをダブルクリックして起動します。

内部エラーが発生しました。。

困った時のGoogle先生ということで調べたところ、文字コードをUTF8に変更すると解決できるようでした。

Inkscape.appを右クリックで開いて、「パッケージの内容を表示」を選択
「Contents」→「Resources」→「bin」フォルダ内の「inkscape」をエディタを開いて、153行目に以下を追加します。

        [ $_DEBUG ] && echo "Setting LANG from /usr/share/locale/locale.alias" 1>&2
        export LANG="$tmpLANG.UTF-8"
    fi
    export LANG=ja_JP.UTF-8
fi
[ $_DEBUG ] && echo "Setting Language: $LANG" 1>&2

保存して、Inkscape.appをダブルクリックすると・・起動しました♪

Incscapeでサイトロゴ画像を作ってみる

まずは画像サイズにあわせて作業領域の枠線を調整します。

メニューの「ファイル」→「ドキュメントのプロパティ」を開く。
ページサイズを画像サイズに合わせる。単位の初期値が「mm」になっているので、「px」に変更してください。
このままだと小すぎるので、右にある「ページをウィンドウに・・」ボタンで画面に合わせて拡大します。
画面いっぱいになりました。
ここからは実際に作成に入ります。いきなりですが完成しました！以下のような手順でしたが、詳細は別途まとめたいと思います。
1. テキストツールで文字を書く。
2. 複製して反転。
3. グラデーションを掛ける。