チュートリアル

はじめてのホーム画面カスタマイズ:ミクさんに吹き出し付けて喋ってるみたいなホーム画面

andronaviのほうで出したからでしょうか、ずいぶん前に作ったミクさんのホームが流れて「これどうやるの?簡単?」みたいなのがチラホラ見られました。

これですね。

これ、ミクさんとか吹き出しとかは壁紙で作っているんですけど、だからといってホーム画面カスタマイズ初心者の人に「壁紙加工しろ」というのも辛いです。
というわけで、今回はすべてスマホで同じような吹き出しミクさんホームを作ってみようと思います。

余談ですが、この昔のミクさんホームはまだGlaejaで天気やGmailの未読数が表示できなかったのでChronotopia,Glaeja,Missed It!を組み合わせて作っていたりしました。
懐かしいですねぇ…。

今回作る完成形

140430-22
これを目指します。なんだか吹き出したくさんありすぎてうるさい感じですけど。
昔ののほうがいいかもしれないけど、作り方は同じようなものなので、今回はこれで。

ミクさんの画像を用意する

画像を入手する

140430-1
クリプトンの初音ミク公式ページにデモ音源などと共にイメージ画像がアップされているので、それをダウンロードします。

140430-2 140430-3

ダウンロードしたzipファイルをファイラーなどで展開(解凍)します。中にSDのミクさん画像があることを確認して下さい。

背景を削除する

次に、このミクさん画像の白い背景が邪魔なので削除します。
「背景透明化」というアプリを使ってみましょう。

背景透明化

制作: handyCloset Inc.
価格: 無料
平均評価: 4.2(合計 860 件)

posted by: AndroidHTML v2.2

140430-4 140430-5

残す部分と削除する部分をうまく指定します。
Photoshopとか使える人はPCでそういうの使ったほうが早いのでそっちでやりましょう。

140430-6
細かいところまでは難しいですが、それなりにうまく切り取れたと思います。
保存しておきましょう。

壁紙の用意

140430-7
今回の壁紙は単色です。
以前も紹介したかもしれませんが、Colorsというアプリを使います。

Colors

制作: Tim Clark
価格: 無料
平均評価: 4.5(合計 5,055 件)

posted by: AndroidHTML v2.2

dutch tealという色がミクさんっぽかったのでそれにします。

Zooper Widgetを置く

140430-8
まずはZooper Widgetを置いて、画面いっぱいに広げます。

ミクさんを置く

140430-9 140430-10

ウィジェットをタップして「レイアウト」→「上部の+ボタン」→「Bitmap」と進みます。
Bitmapの中のBitmapという項目でさきほど作成したミクさんの画像を選びます。

140430-11 140430-12

ミクさんが表示されました。
一度ホーム画面まで戻って確かめるといい感じですね。

吹き出しを作る

Zooper勉強中:Zooper Widgetで吹き出しを作るよ | orefolder.blog
ちょっと前にこんな記事を書いたので、これを参考に吹き出しを作るのもいいでしょう。
今回はまた別の方法で吹き出しを作ります。

まず、以下のリンクからフォント(ttfファイル)をダウンロードしてください。
fuki.ttf
ダウンロードしたら端末の「ZooperWidget/Fonts」フォルダの中に移動します。

そして再びZooper Widgetの設定に戻ります。
「レイアウト」→「上部の+ボタン」→「テキスト」と進みます。

140430-13 140430-14

「高度なテキスト編集」をタップし、「R」と入力します。

140430-15 140430-16

「フォントの種類」から、なにか文字化けしているような吹き出しっぽいフォントを選びます。
これで吹き出しが表示されるので、テキストのフォントサイズを大きくしたり色を変えたり位置を調整したりします。

140430-17
なんとなくミクさんがしゃべっているような、そんな吹き出しができました。

140430-18 140430-19

同じように「テキスト」で「Q」や「M」と入力して吹き出しを量産します。
このフォントはAからQくらいまで吹き出しが表示されるはずです。

140430-20
更に増やして色も変えてみました。
だんだん何をやりたいのか、わからなくなってきました。

140430-21
吹き出しの上にZooper Widgetでいろいろな情報を文字として載せました。

140430-22
完成です。

まとめ

吹き出しを表示するフォントさえあれば(その中に気に入る吹き出しさえあれば)Zooperなどでテキストとしてそれを表示させるだけで簡単に吹き出しを作ることができます。
(今回はそういうフォントを自作するという面倒なことをやりましたが…。)

吹き出しはそのキャラがしゃべっているような演出を簡単にできるのでいいですね。
GlaejaやZooperの練習(初級編)としてやってみるといいと思います。

Random Posts

mineo、端末・プラン・オプションをまとめた「格安スマホ はじめてパッケージ」を3月3日より提供開始
スマホの緊急速報をオフにする方法-履歴の確認やその他の設定も可能
格安SIMの通信速度比較【2019年5月その2】nuroモバイルau回線はそこそこ、b-mobileとDTI SIMの爆速が続く
Xperia Aceが気になる!Xperia X Compactからの乗り換えにちょうどいいのか!?
ZenFone 6の価格比較:ひかりTVショッピングがキャンペーン条件適用で実質約3.5万円~で強い!
楽天モバイル、AQUOS R5Gを一括128,800円で発売!シャープの5G対応フラッグシップモデル
au、AQUOS sense SHV40にAndroid 9 PieへのOSアップデートを配信開始
nuroモバイルのau回線を契約しました
cheero、最大60Wで超急速充電可能な「cheero USB-C PD Charger 60W」を発売!
TaoTronics SoundLiberty 94 レビュー:1万円を切る価格でノイキャンと外音取り込み搭載の完全ワイヤレスイヤホン!
Xiaomi Mijia SJYT01FMレビュー:スマホでも手ブレの少ないヌルヌル映像が撮れる!
CHUWIのタブレットHi9 Plus/Hi9 ProがMakuakeでクラウドファンディング開始!早々に目標は達成
今なら半額の990円!アレクサで電源をオンオフできるスマートプラグ「Amazon Smart Plug」販売開始!
AIで驚異的なバッテリーライフ!Android 9 Pie搭載のフラッグシップキラー UMIDIGI F1
LG style3をドコモオンラインショップで購入するとAmazonギフト券3,000円分もらえる!