「ブログのタイトルロゴ作りたいけど、フォトショもイラレも持ってない」
「なんかいい感じの画像が作りたいけど、やり方がわからない」
そんな方におすすめなのが、無料ドローツールのVectornator（ベクターネーター）です。
- Vectornatorでテキストを挿入する方法が知りたい
- 画像作成ツールを扱う技術がない
- 画力もセンスもない
- オリジナリティのあるタイトル画像を作りたい
デザイン初心者、
フォトショもイラレも未経験の
ド素人主婦な私もできました！
無料なのに本格的、ドローツールVectornatorでテキストを挿入する方法を解説します。
「そもそもVectornatorとは？」という方はVectornatorアプリ紹介記事からどうぞ。
Vectornatorでテキストを挿入する方法
Vectornatorのテキスト挿入の方法はとっても簡単。
一般的なイラストツールなどを使ったことがある人なら感覚でできてしまうと思います。
が、私はつまずきました…
この記事では、私のように「簡単なはずなのにテキスト挿入できない！」という方に向けて、画像たっぷりでやさし〜く解説します。
それではさっそくテキストを挿入していきましょう。
この記事ではiPhone版アプリで解説していますが、PC版や iPad版でも操作は同じです。
お手持ちのVectornatorで実際に操作しながら読み進めてみてくださいね！
まずはテキストツールを選択します。
［テキストツール］（四角に［あ］のアイコン）をタップ
次に、テキストを挿入したい範囲を選択するようにスワイプします。
私はスワイプせずタップしかしなかったので、一向にテキスト入力できませんでした…
タップするだけではテキスト挿入できません！
かならず挿入場所をスワイプで選択します。
選択すると、自動で「テキスト」という文字が入力されましたか？
キーボードで文字を入力すれば、テキスト挿入完了です。
左メニューの選択ツール（矢印マーク）をタップすると、テキストの周りに枠が表示されます。
この枠がテキストエリア。
枠上にある青い点を動かすと伸縮しますが、テキストエリアが広くなるだけで、文字の大きさは変わりません。
ところで、テキストエリアの下にメニューバーが表示されていますね。
これは『クイックアクション』。
選択しているものに対して操作できるショートカット的なツールバーで、大変便利です！
例えば、［ぁあ］と書かれたアイコンをタップすると、文字の大きさをすぐに変えることができます。
クイックアクションバーが表示されないときは…
左上の設定ボタン（歯車マーク）＞［クイックアクションを表示］をオン
スタイルメニューでテキストの見た目を編集
テキスト挿入は簡単でしたね！（私はつまずいたけど）
では次に、挿入したテキストのフォントや色を編集しましょう。
テキストの見た目を変える時は、ブラシマークのスタイルメニューを開きます。
【縦向きiPhone】（∧）マーク（画面下部）をタップ
【横向きiPhone・iPad、PC】ブラシマークをタップ
フォントを変更する
まずはフォントを変えたいとき。
［スタイル］＞［テキスト］内「フォント」
標準搭載されているフォントはすぐ使えます。
「Vectornatorで使えるフォントが少ない！」
そんな時にはFontinatorが便利。
フリーフォントや手持ちのフォントをVectornatorに登録できます。
ここで注意。
スタイルメニューのテキスト項目は、テキストツールを選択しているときだけ出てきます。
スタイルメニューの内容は、その時に選択しているツールによって変化します。
テキストを編集したいときは、必ずテキストツールアイコンをタップしてからスタイルメニューを開きましょう。
- フォントの種類
- サイズ
- 位置揃え
- カーニング（文字幅・行の高さ）
- 境界（テキストエリア）を文字サイズに合わせる
- テキストからアウトラインを作成（パス化）
テキストの色を変える
［スタイル］＞ ［塗り］の色を選択
［塗り］は［テキスト］項目の下部にあります。
［塗り］の色をタップすると、テキストの文字色を変更できます。
グラデーションもできます。
“塗り“についてはVectornatorの基本知識の記事にも書いていますので、未読の方は併せてご覧ください。
テキストに影をつける
［スタイル］ ＞ ［影］をオン
［影］はスタイルメニューの最下部にあります。
影の色や向き、ぼかしの加減なども調節できます。
テキストからアウトラインを作成
アウトラインとは、テキストの境界をパス化することで図形として認識させる操作です。しなくてもロゴ化できます。
しかしサイズを変更したり、さらに細かい装飾を加えたいときは、アウトライン化しておくと自由度が高くなります！
テキストロゴを選択 ＞ スタイルメニュー
［テキストからアウトラインを作成］をタップ。
今までは編集可能だった『KIRIN』の文字が、アウトライン化することによって独立したオブジェクト（図形）になりました。
すべての文字を選択した状態で、青い点をタップしたまま移動させると…
ロゴを書き出す
いい感じのロゴができたら、画像ファイルとして書き出します。
まずは必要な画像サイズに変更します。
左上を起点（0）として、縦横にメモリがついています。
必要な大きさに合わせましょう。
アートボードのサイズ変更
画面左上にロゴの端を合わせ、大体の大きさが決まったら、アートボード（キャンバス）の大きさを変更します。
左上の設定（歯車マーク）をタップ。
アートボードのサイズが希望のサイズになったら、テキストと余白のバランスを調節します。
書き出し
サイズの変更と最終調整ができたら、いよいよ書き出しです。
書き出しとは、Vectornatorのデータを他の形式に変換し、用途に応じて使いやすくすること。
画像データとして書き出せば、ブログやSNSなどに貼り付けられるようになります。
データが画像化する瞬間！ワクワクする〜！
それではやってみましょう。
左上の共有アイコン（四角に↑）をタップ。
ブログに使うならPNG形式がおすすめ。
「透明度」をオンにすると、何も描いていない白い部分が透明になります。
画像の大きさなどを確認し、右下の［書き出し］をタップ。
次の画面で、「書き出したデータをどうするか」を選びます。
［画像を保存］をタップ。
これでiPhone（iPad）デフォルトの写真アプリに保存されます。
他にも「ファイルに保存」「メール添付」「LINE送信」などが可能。
間違って友達のLINEに送らないように注意しなければ…
これで画像の完成です！
透明化されているので、何色の背景でも使えます。
ここまでがテキスト挿入と装飾の基本です。
色やフォントを変えて、自分好みのロゴを作ってみてくださいね！
次回はマスクを使ったロゴの作り方を解説します！
