アイツのつくりかた

絵と手描き文字で「伝わる」デザインaitsu factoryのブログです

手描き&紙派の方必見!手描き文字を写真に載せる裏ワザ【後編】【ibispaint】

f:id:aitsu-factory:20200903091216j:plain

 

みなさまこんにちは。

 

絵と手描き文字で「伝わる」デザイン

 

aitsu factoryのみかりんです。

 

 

 

さて!今日は、前回の後編です♪

 

前回の記事はこちらです〜↓

aitsu-factory.hatenablog.com

 

スマホで無料で使えるお絵かきアプリ「ibispaint」を使って

 

紙に書いた手描き文字を、デジタル写真の上に乗せるやり方を伝えさせてもらいました。

 

今回はその続編♪

 

 

①デジタル化した線の色を変更しよう~!

 

②デジタル化した文字を移動して、より写真にしっくり来るようにしよう♪

 

の2つをお伝えしたいと思います★

 

 

 

これができると、前回ブログでも載せたような、

 

青い空に白抜き文字~みたいなこともできちゃうんです!!

 

f:id:aitsu-factory:20200830110222j:plain

 

では、早速やっていきましょう。

 

 

 

①デジタル化した線の色を変更しよう~!

 

前回、鯛焼きの写真の上に「めで鯛」と載せてみましたが、

 

こちらの文字を赤い色に変えてみようと思います。

 

f:id:aitsu-factory:20200903092238j:plain

 

まずは、アイビスペイントを起動して、

 

「マイギャラリー」から、前回やった続きのワークを開いてみてくださいね。

 

(前回って何よ!?という方は、前回のブログをご一読くださいませ)

 

 

 

では、開いていただきましたら、

 

下に並んでいるアイコンのところから、右から2番目の「レイヤー」のアイコンをタップしてくださいね。

 

f:id:aitsu-factory:20200903092442j:plain

 

こちらには、おそらく写真のレイヤーと、前回作った手描き文字のレイヤーがあると思います。

今回は手描き文字が載っているレイヤーを選択してくださいね。

選択方法は、プレビューが見えている四角い枠をタップすると、そのレイヤーが青色に変わります。それが選択できているサインです。

 

f:id:aitsu-factory:20200903092506j:plain

 

では、レイヤーを下にしまっていただき

(おしまいするときは、再度下の右から2番目の矢印が下に2つ向かってるアイコンをタップしてね)

 

次は、左から2番目のツールボックスのアイコンをタップしてください。

(私の場合は、ブラシのアイコンになってますが、違うアイコンかも!とにかく左から2番目がツールがいっぱいあるところ!と覚えててくださいね)

 

f:id:aitsu-factory:20200903092600j:plain

 

 

 

そこで「フィルター」と書いているアイコンをタップしてください。

 

f:id:aitsu-factory:20200903092701j:plain



 

すると、いろんなフィルターがいーっぱい!出て参りますよ~。

(写真のレイヤーを選択しておくと、写真加工も色々できますので、ぜひ、お時間ある時に遊んじゃってくださいね!)

 

f:id:aitsu-factory:20200903092644j:plain

 

この中で、右にスクロールしていくと、「線画色変更」という項目が出てきます。

 

f:id:aitsu-factory:20200903092735j:plain

 

これは、文字通り、線の色を変更するツールです。

 

色が一色指定されていますので、(初めて使う人は黒かなぁ)

こちらの四角をタップすると・・・

 

f:id:aitsu-factory:20200903092809j:plain

 

 

パレットが出てきます!

 

f:id:aitsu-factory:20200903092833j:plain

この中から好きな色を選んでもらってもいいし、

 

パレットの一つ横のアイコンをタップすると

色の輪っかみたいなのが出てきますので、こちらで色を作り出すこともできます。

(ただ初心者はちょっと使いづらい!)

 

f:id:aitsu-factory:20200903092851j:plain

 

微妙な色味を調整して作成するなら

一番右側の、スライダーがオススメです。

色々いじってみてくださいね♪

 

f:id:aitsu-factory:20200903092907j:plain

 

そして、色が決まりましたら、チェックを押してくださいね。

 

f:id:aitsu-factory:20200903092925j:plain

 

そうしましたら、黒の文字が赤になりました!!

 

f:id:aitsu-factory:20200903093107j:plain



 

 

続きまして、

②デジタル化した手描き文字を移動して位置を調整する

をやっていきますね。

 

今回は、「めで鯛」の、サイドにある装飾(これなんて名前なんだろう・・・)の位置を変更してみますね。

 

f:id:aitsu-factory:20200903093148j:plain

 

まずは、こちらの装飾のみ動かしたいので、

 

この部分だけ「投げなわツール」で選択します♪

 

 

 

下の左から2番目のツールのアイコンをタップして

「投げなわ」ツールを選択します。

 

f:id:aitsu-factory:20200903093226j:plain

 

そして、この装飾のところを指でぐるっと囲んでください。

 

f:id:aitsu-factory:20200903093239j:plain

 

点々に囲まれるようになりました!

 

そうしましたら、次に、毎度お馴染み左から2番目のツールのアイコンから

「移動変形」を選択してください。

 

f:id:aitsu-factory:20200903093257j:plain

 

そうしましたら、下の方にグレーの帯状の物が現れます。

 

こちら、回転機能が隠れていますので、グレーのところをタップしたら、ツールの全体像が現れます。

 

f:id:aitsu-factory:20200903093320j:plain

 

 

今回、移動だけでなく、角度も変えたいので、

この矢印がまるっとなっている、回転ボタンを押してくださいね。

 

f:id:aitsu-factory:20200903093441j:plain

 

人差し指1本でスライドさせたら、移動だけできて、

親指と人差し指で広げたり狭めたりしたら、拡大縮小もできます。

また、親指と人差し指の角度を変えてあげると、回転もします。

 

f:id:aitsu-factory:20200903093500j:plain

 

納得した場所に配置できたら、チェックマークをタップです!

 

f:id:aitsu-factory:20200903093522j:plain

 

これを繰り返して、

直線的な配列だった「めで鯛」の文字を、円弧の上に配列したように、まぁるく配置してみました!

 

f:id:aitsu-factory:20200903093544j:plain

 

 

再配置ができることで、より自分の思い通りの配置を叶えることができますね~。

是非是非、色々遊んでみて、自分の者にされてみてくださいね!

 

 

この、「線画抽出」の機能を使っての応用編として、

 

写真の上に文字やイラストを載せるだけではなく、

 

イラストに着色することもできます。

 

それをLINEスタンプに加工したり、SNSプロフィール画像やカバー画像を作ったりとか!

 

色々な応用が可能です♪♪

 

 

 

 

ブログでお伝えできることはほんの少しですが、

 

もし、「こういうのどうやったらできますか?」とご質問いただきましたら、

 

ひょっとしたらお答えもできるかも~?(内容によりますが・・・)

 

 

 

このアイビスペイントというアプリ、本当に私気に入ってて、

 

今はipadで月300円払って、使用してます!

 

仕事にも無茶苦茶使っているので、ギャラリーの並び替えができるのがデカイ!

 

月300円なんて安すぎ!元取りまくりです♪

 

スマホ版は、広告をみさせてもらいながら、

 

今もありがたく無料版を使わせていただいています♪(同期できないのだろうか・・・調べない私)

 

 

 

もしアプリが気にいって、どんどん使用したい!と思ったら、

 

有料版にしてアプリ開発者様への感謝の気持ちをお伝えくださいね♪

 

 

 

そして!ipadとアップルペンシルで、本格的にibispaintでお絵かきしたい〜という方は、

私の大好きな「すごはん」のまっすー先生のブログ要チェック☆です!!

ibispaintで描くPOP講座!なども開催されてます!アイビスペイントのワザもブログでチラ見せしてくれてますっ!!(ブログ内の検索ワードで「アイビスペイント」で検索すると、関連する情報が出て参ります!)

(こうやって、まっすー先生に勝手にバトンタッチしてすいません)

www.sugohan.com

 

 

 

最後まで読んでくださり、ありがとうございました♪