こんにちは！すみろんです
今日はiPadやスマホで使える無料のアプリ ibisPaint X を使ったロゴ画像作成をご紹介します！
ワードプレスブログのホーム画面、ヘッダーのロゴ画像に
おしゃれなフォントを使用しているサイトは上級者っぽく見えますし、
かっこよくて憧れますよね！
私もおしゃれなヘッダーロゴ画像を作成したくて色々探し回った末に無料のイラスト用アプリ「ibis Paint X」がフォント数が豊富だったため使ってみたところ納得のいくロゴを作ることができました！
なので今日はアプリ「ibis Paint X」でのヘッダーロゴ作成方法をご紹介します。
ibis paint X ( アイビスペイント ) って？
アイビスペイントはスマホやタブレットで使える無料のイラスト作成アプリです。
無料でインストールするだけで PCのイラスト作成ソフトとほぼ同じような機能が使える優秀なアプリで、私も普段スタンプやブログ用イラスト作成に使い倒しています。
背景透過処理もできますし、フォントも豊富に揃っているのでとても使いやすくお勧めできるアプリです。
またApple Pencilやスタイラスペンを持っていればタイトル文字にイラストを書き込んでオリジナリティを出すことができますよ！
フォントが充実！ibis Paint X がヘッダーロゴ画像作成におすすめな理由
・無料とは思えない充実したツールが使用できる。
・背景透過の画像が作れる！
・フォントの種類が豊富（日本語だけで500種、全部で1000種以上！）
・イラストを書き加えることができる
ibis Paint Xの機能はレイヤー、多様のブラシ、とてつもないボリュームのフォント数など、無料とは思えない充実したものが揃っています。
ちなみにフォントはデフォルトでは少量ですが無料で1000種類のフォントを簡単にインストールできます。
1000種類！？思ったより多くてびっくりしました！
フォントのインストール方法
アプリ内のフォント選択画面で自分が欲しいフォントのインストールボタンを押すだけでアプリ内に保存され、使えるようになります。
（フォントのインストールは全て課金なしで使えます！）
ブログを始めたばかりでタイトルロゴ作成にこだわりたいけど、
お金は節約したい方にぴったりなアプリだと思います！
必要なもの
・タブレット or スマートフォン
・アプリ「 ibis Paint X 」( Android、iOSどちらも対応 )
・スタイラスペンやApple Pencil（ あれば ）
タブレットやスマートフォンさえあればアプリを無料でインストールするだけで使うことができます！
ペンシルについてはヘッダー部にイラストを書き込みたい場合に必要なだけなので、
ロゴのみ作りたい場合はペンが無くても問題なく作成できます。
タイトルロゴ作成方法
① アプリをインストールし、開く
② サイズを指定し、新規キャンバスを開く
ヘッダーロゴ画像はヘッダー背景画像を超えないサイズで作成しましょう。
背景画像よりも大きくなると、ロゴが背景からはみ出してしまいます。
③ 文字いれツールを使用し、タイトルを入力
左のバーの下から4段め、Tのマークを押す。
そのあとキャンバスをタッチすると出てくる入力欄にタイトルを記載する。
④ 使用したいフォント、文字色、サイズに変更
文字入力欄したの各ボタンを選ぶことで、以下の項目の調整ができます
文字
フォント
中央・左・右揃え
横書き・縦書き
サイズ
4〜2000までサイズ変更
スタイル
文字色
ふちどり色
ふちの幅
背景
フォントの背景色
背景の高さ、幅の調整
文字間隔
文字の横の余白の間隔
文字の縦の余白の間隔
⑤ 文字の周りをイラストで装飾する（やりたい人だけ）
ibis Paint X はイラスト作成アプリなので、ロゴ部分にイラストを書き加えて
オリジナリティを出すこともできます！
絶対に表示されるタイトル部分にイラストを入れることでより
自分のブログイメージを表現できると思いますよ！
⑥ 透過PNG保存を選択
ロゴが完成したら画面右下にある矢印マークを押して、画像を保存します。
ヘッダー背景を設定している場合、ヘッダーロゴは基本的に透過（キャンバスのなかで自分が色や文字を載せていない部分は透明になる）PNGにて保存をします。
⑦ Cocoonの設定画面にてタイトルロゴ画像を選択、保存
WordPressのCocoon編集画面に戻ります。
Cocoon設定 → 「ヘッダー」タブ → ヘッダーロゴ の 選択 ボタンを押し、
メディアにアップロードします。
⑧プレビュー画面にて確認、調整
ヘッダーロゴ画像設定後は、サイト表示をしてロゴ全体が表示されていて
問題がないことを確認しましょう。
※スマホ・タブレット表示でもロゴが表示されているかを確認する
Cocoonの場合はログイン後にサイト表示した時に画面下に現れる
「レスポンシブテスト」をクリックすることで
タブレットやスマホ画面（iPhone、Android、iPad）など、
画面サイズが異なる端末でのプレビュー画面を表示できます。
PC画面ではロゴが表示されていても、スマホでは半分しか表示がないということもおきますので、必ずレスポンシブテスト画面も確認しましょう。
ロゴが欠けていたり、はみ出したりしている場合は
Cocoon設定のヘッダータブ内の
「ヘッダーの高さ」
「ヘッダーの高さ（モバイル）」
「ヘッダーロゴサイズ」を使用して調整しましょう。
全ての画面プレビューでヘッダーロゴ画像が欠けや隠れなく表示されていればOKです！
まとめ
以上、私が ibis Paint X でヘッダーロゴを作成した方法を紹介しました。
私が個人的に無料にこだわっていたので、なかなか自分の納得のいくヘッダー作成ができず困っていました。
初めはWEBのロゴ作成ツールとCANVAの組み合わせで作ろうとしたのですが、CANVAの無料版は背景透過ができないんですよね…
課金はしたくないが背景透過がしたくて探し回っていたところ見つけたのがアイビスペイントでのヘッダー作成でした。
無料とは思えないほど機能面で優秀なアプリなので、イラストだけではなくロゴ作成でも快適に使用することができました。
ロゴ作成に使う方は少ないかもしれませんが操作も簡単で無料なので、ブログ始めたばかりで試しに自分でロゴ作成をしたい方におすすめできる方法です！
ぜひ、試してみてください。
コメント