なんとかなかよく暮らしたい

在宅ワーク・お金・育児のリアルな情報をイラストで綴ります

はてなブログのヘッダーはibis Paintを使えば初心者でも簡単に描けました

ブログのヘッダーを スマホアプリibis Paint で作成しました。こちらのサイト でヘッダーのサイズ等を参考にさせて頂きました。【初心者必見】はてなブログのヘッダー画像サイズ・スマホサイズの適正は? - 専業主婦卒業宣言!

 

デザインテーマ:Brooklyn

スマホのヘッダーサイズ:350×200

パソコンのヘッダーサイズ:1,000×200

パソコン用のヘッダーはずいぶん横長です。絵を描くのは大変そうなので、スマホ用のヘッダーをまず描きました。

 

しかし、ブログ初心者の自分は知らなかったのですが、パソコン・スマホで共通のデザインで表示できるレスポンシブデザインというものがあるのですね。

 

メリットは、パソコンでは表示されるのにスマホだと表示されない、などのエラーが少なくなること。Googleもレスポンシブデザインを推奨している。

 

デメリットは、容量が大きいファイルだと、スマホでの読み込みに時間がかかること。などらしいけれど、あまり具体的に実感したことはありません。難しい。

 

ただ、レスポンシブデザインにすると、スマホで表示される文字が大きくなりました。見やすい方が良いです。なので、スマホ用ヘッダーとはさようならです。人様の目に触れたのは、20日程でした。

 

 

ヘッダー画像の構想:所要時間10分

ヘッダーはブログの顔なので、ブログの趣旨に合っておりなおかつ印象の残るものにしたいです。

私のブログは、家庭生活のあれこれを書いています。それなので希望としては

  • 家族3人の絵
  • 見た人の心に引っかかる絵

を目指します。

アイビスペイントを使う前に行う作業

慣れている人は、アイビスペイントのアプリ上で直に作成できるのですが、初心者なのでまずは下書きからスタート。

紙で下書き:(10分)

f:id:fumikoyamamoto:20180103215900j:image

愛用の無印良品のノートにシャーペンで構想を下書き。下書きは、鉛筆でOKです。

 

スマホのカメラアプリに取込み(5分)

f:id:fumikoyamamoto:20180103215944j:image

下書きが終わったら、スマホのカメラアプリで取り込みます。

おすすめはCam scanです。背景が白く、線は濃くなるようにモードを選択

 

お絵描きアプリに取り込み(5分)

アイビスペイントへ取り込み

 

 

f:id:fumikoyamamoto:20180315015001p:plain

 

カメラアプリに取り込んだ時よりも、線が薄くなってしまいました。

彩色(1時間)

f:id:fumikoyamamoto:20180315011125p:plain

 

アイビスペイント内の広告を見れば、18時間無料で多様なブラシツールが使えます。そうやって鉛筆を獲得して描きました。

背景の選択(5分)

f:id:fumikoyamamoto:20180315012746p:plain

 アイビスペイントは、背景やトーンなどをイラストに追加できます。だんだん何かのオマージュっぽくなって参りました。

ブログ名を文字入れ(10分)

f:id:fumikoyamamoto:20180315012112p:plain

クオリティはともかく完成。所要時間は合計1時間45分でした。

 

// jQuery読み込み // 目次 表示/非表示ボタン