2017年11月29日水曜日

ドット絵の手直しをした話

前置きです。 どうも、ブログってやつは更新頻度が落ちると、閲覧数も比例して落ちるようですね。 仮設として、Google 先生の検索ロジックとして、更新頻度の高いサイトを順位で優遇する= 更新頻度の低いサイトを冷遇する。あるかもしれないっすね。

今は新作 Android アプリ「スーパーへーげんフレーンズ」のリリースを直近に控え、 この駄ブログの訪問者を増やしておきたい時期。 プロモーションの一環として、しばらくの間は更新頻度を高めにしていきたいと思います。

キャラ画像の修正をした件

マンガの長期連載で、初期と後期で同じ人物なのに絵柄がぜんぜん違うヤン、みたいなことは多々ありますね。 特定の人物のみならず、作風自体が変化してデフォルメの仕方がガラッと変わる場合すらあります。 例えば? と、言われて「ゴリラーマン」と「アゴなしゲンとオレ物語」くらいしか思いつかないんですが、ごめんなさい。 まあ、言わんとすることは分かっていただけると思います。

なぜこんな話をしたかというと、現在制作中のアプリにおいて初期型と後期型であまりにもドット絵が違うということが問題になっており…。 初期と後期といっても、マックスで6カ月程度しか間隔は空いてないないんですけどね。 ドット絵自体が今回初挑戦に近かったこともあって、作画の方法が初期はまだ確立されていなかったのです。

4/30 オーロックス
5/8 ヤマアラシ
5/19 シロサイ
6/3 アルマジロ
6/9 アラビアオリックス
6/18 ツキノワグマ
6/20 カメレオン
7/3 ハシビロコウ
7/18 ヘラジカ
7/20 アリツカゲラ
7/27 カバ
8/2 ジャガー
8/14 ツチノコ
8/29 博士
8/31 助手
9/16 タイリクオオカミ
9/23 キタキツネ
9/24 ギンキツネ
10/16 ヒグマ

履歴を見たら、上記のような順番でドット絵を作ったようです。 5体目のアラビアオリックスあたりで、境界線を明確にするようになり、 8体目のハシビロコウで線をクッキリさせる作画手法が完成したようです。 アラビアとハシビロコウは、カラーリング的にほぼ白黒だけのキャラなので、黒線を意識して書くようになったのだと思います。

逆に言うと初期のオーロックスやヤマアラシはボヤアっとしてるんですね。 5月の記事でついにわかったの!ドット絵の本当の意味が!を参照してもらうと分かりやすいですが、ドット絵らしいドット絵とはクッキリしているわけです。 どうせ、小さく表示するんだからわからんやろ? と、初期は思っていたハズですが、いくら小さく表示しても何となく違いが見えてくるんですよね。 見えてくると気になって仕方がない。統一感? っていうの? そういうの、だしたいやん。

圧倒的…あとからイチャモンの心理的負担

で、手直しですよ。この、手直しの精神的ダメージが莫大であり、0から作るよりよっぽど負担は小さいのに、何かしんどいんですね その理由は、曲がりなりにも一度O.K.をだしたモノを…後からアウト判定するという、そこなんですよね。 「はいオッケーです」って監督が言ったのに…後から取り直しだあ(怒)? みたいな。 あんまり手直しばっかりしてたら、キリないしなあ…、という徒労感も加わって何かしんどいんですね。

上が補正前です。こうやって拡大画像だと、輪郭がボヤアっとしているのがわかります。

そして、修正したのが上の画像です。境界線をはっきりさせたことによって、ギザギザ感が明確になっています。 こういうのを「ジャギっている」とドット絵業界では言います。 いいんです、ジャギっていて。ジャギっているのが判別可能か否かによって、ドット絵と非ドットの区別をするべし、 という説もあるくらいですから。 まあ、縮小したらわからないんですけどね。 特に最近のスマホは液晶が微細で、1ピクセルがちっちゃいですからね。

下はバグ画像ですが、拡大のパターンがいろいろあるので参考までに。 簡単に言うなら、小さいほどドット絵のジャギっている感はわかりません。 ただし、原画と同じ縦横比で、かつ 1.5倍とか4.0倍とかきれいな拡大をするのであれば、ドット絵のジャギっているのが目立つようになってもドット絵はきれいに見えます。 今回は横幅 720px の端末だと原寸大、1080px の端末だと 1.5倍に拡大して表示されるようにしています。 しかし、タブレットという異次元のスクリーンモンスターもいますからね。 いろいろなサイズに対応しないといけないスマホゲーにおいてですよ、ドット絵というのは賢い選択かもしれません。

2017年11月28日火曜日

FireBase に挑戦! Admob広告実践記事

時代は Fire Base

Admob の最新事情をわりと遅れてお送りする当サイトですが、 今の時期に Admob を語るのなら、Fire Base を無視するわけにはいきません。 Fire Base が何なのか全くわかりませんが、今回は最先端のアドモブ広告掲載方法をレクチャーです。

今回参考にさせていただいたのは下記のサイト様です。
[Android] FirebaseでのAdMob広告の実装

しかし、今回で3回目なのでもういい加減、慣れてきました。 何が3回目って? 書いてある通りにやっても、うまくいかないことですよ。 なぜうまくいかないのか? それは、似たような(開発)環境であっても、微妙に違うからなんですね。 そうとしか言えない。仕様もコロコロ変わるし。ちなみに、過去二回の悪戦苦闘の歴史を自社リンクしてみます。
驚愕!!!!!! 2014年8月31日に従来版の AdMob サービスを終了いたしました。
AdMob 広告表示せえや(2012年の記事です)

先に結論から書きましょう。 何やかんやトラブりましたが成功です。 つまり、この記事を読めば「私がいかにしてつまづき」「私がいかにして解決したのか」が分かるわけです。 もしかしたら、本当にあなたの役に立つかもしれません。 ちなみに、途中イラついたと思いますか? ああ、すげえイラついたですよ。

開発環境を少し。Android Studio 使用で、OS は Windows10。アンドロスタジオで従来の Admob 広告の実装は行っています。 つまり、従来型(2014年9月以降のバージョン)の Admod に関する SDK はアンドロスタジオに導入している状態です。 もし、本当の新規で一からやる場合は、何か違ってくるかもしれません。

では、やってみよう

まずは google-services.json ファイルをダウンロードして、それをプロジェクト内に放り込みます。 この辺は参考サイト様をご参照ください。

では、スタジオにお返しします。はい、今度はですね、gradle に追加記入します。

build.gradle(Project: xxx)に
classpath ‘com.google.gms:google-services:3.0.0’
を追加します。versionは適宜合わせてください。
文章が明確なので引用させていただいてます。 私の場合は 3.1.0 のバージョンでした。
build.gradle(Module: app)に
com.google.firebase:firebase-ads
を追加します

ここまでは、gradle の dependencies {} 内に記入です。

build.gradle(Module: app)に
apply plugin: ‘com.google.gms.google-services’
を追加します
こちらは build.gradle(Module: app)の末尾に追加です。

追加したら、Android Studio にある Sync Now ボタンを忘れずに押してください。 これを押すと、再構築します。 本来ならあとは、上記サイト様(akira-watson.com)に書いてある通り、 xml に広告用のビューを追加して、MainActivity にチョイチョイと追加すれば完了するはず…です。

どうだい? うまくいかないだろ?

そもそも、Sync Now したらエラーになるから、先に進まんやん。 と、いう人は build.gradle(Project: xxx)をご確認ください。 下の画像の注目部分の、一文が無いよ? と、いうのならぜひ追加してください。 allprojects {} 内に注目です。

画像だからコピペできませんよ。ずいぶん不親切ですね、ここは。 まあ短いからいいじゃないですか。 で、バグっているまま Activity に関連クラスを import とかしていると、インポートできません表示になるんですね。 外部クラスとの連携ができていない、と。 このあたりの問題もすべて解消してくれます。 これで、すべて解決です。

えっ? コピペさせろって? 仕方ないなあ…。 私の場合は、jcenter() までは、すでにありましたが、maven {} の部分が欠落していました。 もし、「えっ? maven {} のところ、私の gradle には記述されているんだけど?」であり、 かつ、トラブって進まん、という場合は何か他の原因が考えられます。 何とかググって、解決してください。

allprojects {
    repositories {
        jcenter()
        maven {
            url "https://maven.google.com"
        }
    }
}