こんにちは、ちょこきなこです。 今回はUIパーツのアンチパターンの紹介です。こういうネタはあまり好きでは無いのですが、実例を元にお手本として広まってしまうのも良くないので、紹介させてください。 アンチパターンって何？ ここで言うアンチパターンと…

こんにちは、ちょこきなこです。 「妖怪ウォッチメダルウォーズ 」にて、アバターを着替えた後にモーションがあるのが良いなと思いました。今回はこのモーションがある理由を考えてみます。 なぜ着替えた後にモーションがあるの？ 最初は着替えを完了したこ…

こんにちは、ちょこきなこです。 「妖怪ウォッチメダルウォーズ 」の実装事例からタブデザインについて考えてみました。 情報の取り扱い方という視点から見た時に、タブは基本的には情報の優劣がなく並列な情報を扱うものです。しかし、ゲームにおいては五十…

こんにちは、ちょこきなこです。 UIって一貫性とか統一性って重視されますよね。「妖怪ウォッチメダルウォーズ 」のバトル中のバフ、デバフのアイコンでその一貫性に関する実例の参考になりそうな実装があったので紹介します。 実例は以下の2つの画面です。 …

こんにちは、ちょこきなこです。 「妖怪ウォッチメダルウォーズ 」にフィルタがソートのみで、抽出がないことにびっくりしました。今時シンプルなフィルタ機能は珍しいので考察と紹介をしてみます。 シンプルなフィルタ機能で困らないの？ フィルタ機能がシ…

こんにちは、ちょこきなこです。 UIって無駄な情報は削るのが原則だったりします。 それは必要な情報をより際立たせ、ユーザーが何をしたら良いのか迷わないようにする目的があります。ただ、ゲームにおいては必ずしもそうとは言えません。 そこで「妖怪ウォ…

こんにちは、ちょこきなこです。 UIのパーツを作成していて、汎用の素材を使ってウィンドウをデザインすることって多いと思います。それは汎用的な素材の方がデータの読み込みが速かったり、デザインの統一性が図れたりするためです。 「妖怪ウォッチメダル…

こんにちは、ちょこきなこです。 「妖怪ウォッチメダルウォーズ」では、クローゼット画面に鏡があるんですよね。これを見たときにちょっと感動しました。こういったデザインって見たことなかったんですよね。 じゃあ、今後こういった画面では鏡は必須になる…

こんにちは、ちょこきなこです。 「七つの大罪 光と闇の交戦 : グラクロ」にてワールドマップを移動すると、樹が動く演出について考えてみました。 「ワールドマップを移動すると、樹が動く演出」って何？っていう方のために説明しますと… ▼gif (ワールドマ…

こんにちは、ちょこきなこです。 一般的にボタンはボタンという形状をしていないとボタンと認識されません。あるいは押せると分からりません。 なので、ボタンは押せる形状でデザインする必要がある。 というのが原則ですが、今回はその例外の事例を紹介して…

こんにちは、ちょこきなこです。 以前、ルビの振り方に関して記事を書いたことがあったのですが、妖怪ウォッチメダルウォーズのルビの振り方の意図が分からなかったので考えてみました。 「刀使ノ巫女」ルビの振り方にこだわりが感じられる - アプリゲームUI…

こんにちは、ちょこきなこです。 BGMが良いからゲームを起動したくなる テラバトルの特徴の一つに音楽が良いことがあげられます。 具体的にはホーム画面で流れるBGMです。良すぎて画面が遷移出来ないです(するけど) ゲーム好きな人ならあるあるかもしれませ…

こんにちは、ちょこきなこです。 「テラウォーズ」キャラを出撃させる際に、出撃すべきキャラクターが分からない、という部分のサポートとして 盤面のキャラクターとの相性が分かるような機能が実装されています。 キャラクターの属性が表示される キャラク…

こんにちは、ちょこきなこです。 「テラウォーズ」において、戻るボタンの位置がバラバラなので、それについて書いてみます。 戻るボタンの位置は不統一でもOK？ 結論から言うと、基本的には戻るボタンの位置は統一した方が良いです。まず「戻るボタン」のデ…

こんにちは、ちょこきなこです。 テラウォーズの一部見出しですが、カーニング設定してないように見えました。 この部分です。AとYの間。 改めて引いてみるとこんな感じです。ちょっと気になりませんかね…。 恐らく画像ではなくシステムで表示してるので、カ…

こんにちは、ちょこきなこです。 「東京喰種 :re invoke」の実績の一括受け取りは便利だな、って話です。 「東京喰種 :re invoke」の実績機能はこのように複数タブを跨いで達成報酬を受け取ることが可能です。 複数タブを跨いで獲得することが出来るので手数…

こんにちは、ちょこきなこです。 今回は主にUIデザイナー以外の方向けの記事になります。早速ですが、この口の形、可愛くないですか？ ドヤ顔。 インデックス is 可愛い。 動くインデックス この辺りはUIというよりUXの範疇かもですが、IPにおいてキャラを似…

こんにちは、ちょこきなこです。 今回は「東京喰種 :re invoke」の戦闘開始と戦闘終了の演出を紹介します。 こちらは戦闘開始の演出。 こちらが戦闘終了時の演出です。 独特な表示のさせ方してますよね。 実装方法はちょっと分からないかも…。少し高度な事を…

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

こんにちは、ちょこきなこです。 「東京喰種 :re invoke」ロード画面でちょっとしたデザインの紹介です。 この「Loading...」文字若干ゆがんでいます。 ベースライン敷くと分かりやすいですかね。 東京グールの世界観的にきれいに並んでいるより、少しいびつ…

こんにちは、ちょこきなこです。 「とある魔術の禁書目録 幻想収束 IF」にて変わったルビが出てきたので紹介します。 これ。 ルビにアルファベットが使用されています。 なるほど…、こういう表現の仕方もあるんですね。改めてルビについて考え直してみたので…

こんにちは、ちょこきなこです。 タイトルのメニューがくるくる回る実装になっていました。 これは…どういう意図だろう…。元々たくさん並んでたのかな…。「お問い合わせ」と「TVアニメ」のプロモーションのリンクがある感じですね…。 「お問い合わせ」のリン…

こんにちは、ちょこきなこです。 「とある魔術の禁書目録 幻想収束 IF」の共闘クエストにて、視線の誘導が上手くいっておらず情報が分散しているように感じました。 具体的なシーンですが、他プレイヤーがボスにダメージを与えたときです。 攻撃したこと、ダ…

こんにちは、ちょこきなこです。 「とある魔術の禁書目録 幻想収束 IF」のタップエフェクトが世界観に合ったデザインだな、と感じたので紹介します。 gifだとこんな感じです。 なぜUIのブログでタップエフェクトを紹介するの？と思われるかもしれませんが、 …

こんにちは、ちょこきなこです。 「テラウォーズ 」のフレンド周りの機能が充実しているように感じました。 プロフィールを見る チャットメッセージを送る バトルを挑む リアルタイム観戦 カムバックリクエスト フレンド解除 ハイタッチ アイテムリクエスト …

こんにちは、ちょこきなこです。 「きららファンタジア」にて、チェックボックスとタブのデザインが同じなので、見た目から予測される挙動が分かりづらいと感じました。 ちょっと分かりづらいデザインですが、上の段はタブの挙動で、下の段がチェックボック…

こんにちは、ちょこきなこです。 今回は「テラウォーズ 」のショップのバナーデザインについて書いてみたいと思います。ちょっと見た感じ分かりづらく感じたんですよね… 早速ショップ画面の訴求画像を見てみます。 ぱっと見のショップのちぐはぐ感…。 ポップ…

こんにちは、ちょこきなこです。 「きららファンタジア」のミッションリストにてタブを越えて報酬が受け取れるのが便利なので、紹介します。 挙動としてはこんな感じです。デイリータブを選択している状態で、トータルタブのミッションが受け取れているのが…

こんにちは、ちょこきなこです。「妖怪ウォッチメダルウォーズ」の画面紹介です。今回で最後、冒険まわりの画面の紹介です。 クエスト選択 トレジャーミッション デイリーミッション クエストボタン ストーリークエスト お手伝い ともだち イベント ストーリ…

こんにちは、ちょこきなこです。 「きららファンタジア」にはプレゼントリストとミッションリストで一括受け取りの機能があるのですが、それぞれボタンの位置やデザイン、文字列が異なっているのが気になりました。 プレゼントリストはこちら。 こちらは画面…