アプリゲームUIデザイン

プレイしたアプリゲームのUIデザインに関して、書き残しておこうと思います。毎日24時に更新!

「東京喰種 :re invoke」戦闘開始と戦闘終了の演出が世界観どっぷり。実装方法誰か教えて。

こんにちは、ちょこきなこです。

 

今回は「東京喰種 :re invoke」の戦闘開始と戦闘終了の演出を紹介します。 

f:id:appgameui:20190812213201g:plain

こちらは戦闘開始の演出。

 

f:id:appgameui:20190812213219g:plain

こちらが戦闘終了時の演出です。

 

独特な表示のさせ方してますよね。

実装方法はちょっと分からないかも…。少し高度な事をやると出来そうな気もしてるんですが、ここ独自の仕組みを実装しなければいけないだろうし…。

エフェクトの仕組みを流用してるのかな…。まさかレンダリングした画像をコマアニメーションで表示してるとかないよね。(※あんまりその実装は考えたくない)

 

独自にしろ仕組みにしろコマアニメーションにしろ、結構なこだわりを持ってデザインされている事が伝わるかと思います。

「とある魔術の禁書目録 幻想収束(イマジナリーフェスト)IF」アニメのキャプチャーを使用しているのにログに表情差分がある

 

こんにちは、ちょこきなこです。

 

とある魔術の禁書目録 幻想収束 IF」のアドベンチャーパートのログ画面ですが、なぜかアニメのキャプチャー画像を使った場面でも表情差分があるんですよね。

f:id:appgameui:20190706001228p:image

 

アニメのキャプチャーが表示されてる場面でのログ画面にて、キャラクターの表情差分がありました。

 

これ、どういう作り方したんだろう…。
最初に通常の立ち絵で組んでたけど、その後アニメのキャプチャーを入れる仕様に変更になった、とか?

というのもアニメのキャプチャーを使用しているのであればキャラクターの表情って表に出ないというか、ログ画面でしか確認できないものなんですよね。 

割と妙な実装になっているけど、いずれにしろ、丁寧!

 

 

「東京喰種 :re invoke」Loadingのシルエットがゆがんだデザインになっているので紹介

こんにちは、ちょこきなこです。

 

 

「東京喰種 :re invoke」ロード画面でちょっとしたデザインの紹介です。 

f:id:appgameui:20190812140435p:plain


この「Loading...」文字若干ゆがんでいます。

f:id:appgameui:20190812141336p:plain

 

ベースライン敷くと分かりやすいですかね。

f:id:appgameui:20190812162421p:plain

 

東京グールの世界観的にきれいに並んでいるより、少しいびつな方が合っています。
ホラーというかサスペンス的というか…。

かなり細かい部分ですが、デザインが入っていたので紹介させていただきました。

 

「とある魔術の禁書目録 幻想収束(イマジナリーフェスト)IF」変わったルビの表現。アニメだけでは見落としがちな箇所。

こんにちは、ちょこきなこです。

 

とある魔術の禁書目録 幻想収束 IF」にて変わったルビが出てきたので紹介します。

f:id:appgameui:20190706001237p:image

 

これ。

f:id:appgameui:20190812124835p:plain

ルビにアルファベットが使用されています。

なるほど…、こういう表現の仕方もあるんですね。
改めてルビについて考え直してみたのですが、読み方が分からない文字の読み方を表現するだけではなく、言葉として発しているのはルビの方で、本文はその意味を表す飾りという役割もあります。

超電磁砲と書いてレールガンと読ませる、的な。

それのルビがアルファベットになっただけのこと…。
ただ、今回だとルビが読めないのでついつい本文の方を読んじゃうんですよね…。新しい。 

 

こういった表現はアニメを見てるだけだと分からない部分ですね。

アニメ画像や声優を起用するのでついついアニメだけ見てれば良いや、みたいな発想をしがちですが、こういうこともあるので原作をちゃんと読んで仕様に影響がありそうな場面の把握をする必要があるな、と感じました。