クリエイターに依頼する
MENU
  • HOME
  • profile
  • coverage~Marchrl~
  • blog
Stella~Hiro´s canvas~
Hiroscanvas
  • HOME
  • profile
  • coverage~Marchrl~
  • blog
Hiroscanvas
  • HOME
  • profile
  • coverage~Marchrl~
  • blog
  1. ホーム
  2. HP/Wordpress
  3. WordPress吹き出しアイコン用のお絵かきをしてみた!

WordPress吹き出しアイコン用のお絵かきをしてみた!

2023 9/20
HP/Wordpress お役立ち 日常 趣味
2022年7月23日2023年9月20日

WordPressをはじめてデザインを可愛い仕様にしたくていろいろ調べていると吹き出しアイコンの設定が出来ることを知りました。

フリー素材から画像を登録するのでも良かったのですが、オリジナル感を出したかったのでアイコンの作成に挑戦することにしました。

アイコンの作成することによって出来ることが増えましたのでシェアしたいと思います。

目次

使ったもの

私がイラストを作成するものに利用したものを紹介します。

  • スマホ(iPhone)
  • タブレット(iPad)
  • デジタルペン(applepencil)
  • お絵描きアプリ(ibisPaintX)
  • 画像編集アプリ(LINECamera)

スマホ(iPhone)

出来上がったイラストを加工するときに使います。

画像編集アプリのダウンロードをしておくのをおススメします。

おすすめ加工アプリ

LINECamera(ラインカメラ)

カメラ、アルバム、コラージュ、ペイント等様々な加工が出来るアプリ。テキスト文のフォントが豊富!

タブレット(iPad)、デジタルペン(applepencil)

イラストを描くときに使います。

iPadはデジタルペイントを利用するときには使いやすくておすすめですが、持っていなければスマホ・タッチペンでも描くことは出来ますので。持っている端末からチャレンジしてみてください!

おすすめするペイントアプリ!

ibis Paint X

豊富な種類のペンや色塗、漫画やトーン素材、LINEスタンプの作成まですべて無料でできる優秀アプリ!無料版とプレミアム版があるが広告等気にしなければ無料版で十分利用可能!

アイコンを書いてみよう!

アイコンを増やしたいなと思ったのでHiroが実際に描いてみました。

今回のアイコンは口が開いている少し驚いた感じにしました。
下書きから背景の柄まで設定することが出来るのでぜひ使って慣れていってみてください!

ibis Paint Xでの作成例

はじめはいろいろな機能があるから戸惑うと思うけれどゆっくり練習してみよう!
ポイントはレイヤーをすべて変えること!!

①セッティング

アプリを起動し、マイギャラリーをタップします。

マイギャラリー横の+ボタンをタップするとサイズ選択が出来るので好みのサイズをタップしましょう!

いろいろなサイズに設定することはもちろん、下書きを手書きして画像を取り込むことも出来るのでデジタルに慣れていない人でもまずは手書きから挑戦してみるのもいいね!
LINEスタンプの規定サイズもあるのでLet’s challenge!!

私は今回A4サイズを選択しましたがアイコンにするなら1:1のものを選択するのがおススメです!

②ブラシの種類およびレイヤーの設定

1、左タブのブラシから選択 2、下タブの右から2番目のタブを選択するとレイヤーへ

レイヤー左+をタップするとレイヤーの数が増えるよ!

レイヤーのとは?

透明なフィルムのようなページが何枚重なり合ったもの。レイヤーの数字が大きくなっていくほど上に色が足されていく。

まず下書きはレイヤー1を使いましょう!

下書き⇒ペン入れ⇒色付け(色が変わるごとにレイヤーを追加)⇒背景

のように何枚もレイヤーを足していくことで後々編集がしやすくなるので積極的にレイヤーを使い分けていきましょう!

③下書き

ブラシタブで鉛筆を選択しサクッと下書きを書いていきましょう!

あくまで下書きなのでどんな線を入れても大丈夫!
大まかに書きたいイラストを描いていきましょう!

下書きが出来たらレイヤーを追加しましょう!

④ペン入れ

レイヤー2をにブラシの種類を変えてペン入れしていきましょう!

この時レイヤー1の下書きは色の濃さを30%程度にしておくとうっすら表示されるのでペン入れしやすいよ!
極力線を囲むようにペン入れしておくと色塗りしやすいよ!

ペン入れが完了したら下書きしたレイヤー1を表示させないように👁のマークをタップしておきましょう。

⑤色付け

新しいレイヤーを追加しておき塗る部分を決めていきます。

私の場合は肌色⇒髪色⇒顔パーツ⇒服と塗っていきます。

しっかりと線と線が重なり合っている場合は、左タブの自動選択をタップし囲みたい部分をタップすると範囲選択をすることが出来ます。

範囲選択が完了したら、薄い色から塗っていきます。初めの薄い色は塗りつぶしを選択し範囲内をタップすると一気に色を塗ることが出来ます。

レイヤーを追加していきながら濃い色を部分的に塗りながら色の凹凸が目立ちにくいようにぼかしていくと綺麗に色が付いていきます。

顔、頭、顔パーツ、服を塗るタイミングで選択解除や再選択、レイヤーの使い分けをしていくとスムーズに色付けが出来ます。

⑥背景選択

全てキャラクターの色を塗ることができたら、自動選択を背景の白い部分にタップし右上にある背景アイコンをタップし素材を選択します。

選択解除をするとイラストは完成です!

描き方、塗り方は人によって様々!沢山ためして自分が使いやすい方法をみつけてみてくださいね!

アイコン作業動画

Hiro

Mei

画像を加工してみよう!

イラストが完成したらイラストをマイギャラリーに保存し、写真に保存しましょう!

保存が出来たら加工用アプリを開きます。

私はAirDropでスマホに画像を転送し、スマホ内のアプリを使って加工しています。

完成!!

加工の仕方はあなた次第!

おすすめのサイズは1:1サイズ!

LINECameraでは枠加工が〇の種類が豊富にあるのでおすすめです。

まとめ

WordPressで使うアイコンを作ってみました。

背景も豊富で無料で作れるイラストアプリ!

レイヤーを攻略してデジタルペイントを楽しんでいきましょう!

今後ペイントアプリを使ってLINEスタンプの作り方等も紹介出来たらと思います。

ぜひチャレンジしてみてください!

※本ページはプロモーションが含まれています。

HP/Wordpress お役立ち 日常 趣味
ibis Paint X iPad WordPress アイコン アイビスペイント お絵描き お絵描きアプリ ブログ 初心者 吹き出し 吹き出しアイコンの作り方 無料お絵描きアプリ
  • これからの人生を明るくするために!!
  • live配信を経験して良かったこと悪かったこと

関連記事

  • シーリングスタンプ押してみた!
    2023年11月20日
  • ワードプレスの基本設定!テーマは何がいいの?
    2023年9月15日
  • 初心者でも簡単!WordPress立ち上げ準備をしてみよう!
    2023年9月2日
  • 17ライブにオンラインショップ搭載!?ライブコマースをより使いやすく!
    2023年8月10日
  • 1個からでも?!誰でも簡単オリジナルグッズ作り!
    2023年5月11日
  • 簡単なスマホ操作ができれば初心者でもすぐに始められる究極の収益UP法
    2023年4月28日
  • ライブ配信を楽しく配信する企画!
    2022年7月26日
  • live配信を経験して良かったこと悪かったこと
    2022年7月24日

※本ページはプロモーションが含まれています。

コメント一覧 (1件)

  • ライブ配信を楽しく配信する企画! | Hiroscanvas より:
    2023年4月8日 12:54 AM

    […] WordPress吹き出しアイコン用のお絵かきをしてみた! […]

検索
最新記事一覧
  • シーリングスタンプ押してみた!
  • ワードプレスの基本設定!テーマは何がいいの?
  • 初心者でも簡単!WordPress立ち上げ準備をしてみよう!
  • 17ライブにオンラインショップ搭載!?ライブコマースをより使いやすく!
  • 1個からでも?!誰でも簡単オリジナルグッズ作り!
カテゴリー一覧
  • HP/Wordpress
  • お勧め商品
  • お役立ち
  • レビュー
  • 商品
  • 心のこと
  • 日常
  • 美容と健康
  • 趣味
Hiro
handmadeを中心にパソコンスキルを活かし活動中!気になることや困りごと、ご依頼等ありましたら気軽にお問い合わせください。

※本ページはプロモーションが含まれています。

目次
検索
目次
  • HOME
  • profile
  • media
  • blog

1.紹介
2.コンテンツ販売
3.作品集
4.情報発信
5.お問い合わせ

広告

※本ページはプロモーションが含まれています。

ブログカテゴリー
  • HP/Wordpress
  • お勧め商品
  • お役立ち
  • レビュー
  • 商品
  • 心のこと
  • 日常
  • 美容と健康
  • 趣味
その他情報

・プライバシーポリシー
・特定商取引法に基づく表記

Hiro
handmadeを中心にパソコンスキルを活かし活動中!気になることや困りごと、ご依頼等ありましたら気軽にお問い合わせください。

© Hiroscanvas.

目次