コロプラ、『KAZUMA KANEKO’S ツクヨミ』のUI設計プロセスを紹介。世界観と操作性を両立するUIの最適化手法を解説

コロプラ、『KAZUMA KANEKO’S ツクヨミ』のUI設計プロセスを紹介。世界観と操作性を両立するUIの最適化手法を解説

2026.06.08
ニュースUI
この記事をシェア!
Twitter Facebook LINE B!
Twitter Facebook LINE B!

この記事の3行まとめ

  • コロプラ、『没入感ある世界観と操作性の両立 ——『KAZUMA KANEKO’S ツクヨミ』のUIができるまで』と題したブログ記事を公開
  • Nintendo Switch向けタイトル『KAZUMA KANEKO’S ツクヨミ』のモックアップ制作やUIデザインのプロセスを紹介したもの
  • モバイル向けのタップ操作からゲームパッド向けに移行する際の、「選択」ステップの追加やループ処理の仕様を解説

コロプラは2026年6月1日(月)、同社のオウンドメディアにおいて、『没入感ある世界観と操作性の両立 ——『KAZUMA KANEKO’S ツクヨミ』のUIができるまで』と題したブログ記事を公開しました。

(画像は記事本文より引用)

本記事は、2026年4月に同社が発売したNintendo Switch向けタイトル『KAZUMA KANEKO’S ツクヨミ』を題材に、UIデザイン設計のプロセスを紹介した記事。

同社初となるコンシューマーゲームの開発において、UIコンセプト設計のプロセスや、モバイル向けUIからゲームパッド向けUIへと最適化を図った手法が解説されています。

本作の開発では、デザインの方向性を探るにあたり、現代の東京という舞台設定や、ローグライク、生成AIといったゲーム要素を統合するモチーフとして、「寄木細工のからくり箱」が採用されました。

このモチーフから幾何模様などのビジュアル要素を抽出し、UIのモックアップを制作しました。

(画像は記事本文より引用)

(画像は記事本文より引用)

ゲームパッド向けの情報設計においては、モバイルゲームのタップ操作にはない「選択」というステップの考慮が求められます。

開発チームは、十字キーやスティックでの対象選択とボタンによる決定を基本としつつも、タブ切り替えなどの一部操作は選択を挟まずボタンで直接実行できるように実装。

また、選択操作のループ設定に関して、操作方向が1軸の場合はループ可能とし、2軸の場合はプレイヤー間で想定が異なるためループ不可とする明確なルールを設けました。

(画像は記事本文より引用)

(画像は記事本文より引用)

さらに、複数のボタンを使い分けるゲームパッドの特性に合わせ、画面内の操作説明を画面下部に集約。対象となるUIの近くに配置することで、情報のまとまりを整理しています。

(画像は記事本文より引用)

没入感を高めるための工夫として、ダンジョンへの潜入時には、直感的に行き先が分かる演出画面を追加。ローグライクに不慣れなプレイヤーの違和感を解消し、自然にゲームへ入り込める導線を構築しています。

また、タイトル画面にアイコニックな赤い部屋を採用するなど、画面ごとに最適化されたデザインが施されています。

(画像は記事本文より引用)

その他、詳細はブログ記事本文をご確認ください。

没入感ある世界観と操作性の両立 ——『KAZUMA KANEKO’S ツクヨミ』のUIができるまで『KAZUMA KANEKO’S ツクヨミ』公式サイト

関連記事

ゲームUI/UXデザイナー急募!『ポケットモンスター』シリーズなど大型タイトルにも携わる「2DCGプラネットスタジオ」が採用強化中。プロ志向の無料クリエイター育成講座も
2026.03.17 [PR]
ブラウザでテクスチャを生成できる無料ツール「TextureCreate」リリース。商用利用も可能
2026.03.02
デザインツール「Figma」、画像を効率よくベクターに変換できるAI機能「Vectorize」の提供を開始
2026.02.05
2025年アドベントカレンダーから、ゲームメーカーズ編集部が注目した15記事を一挙紹介!
2025.12.30
カカリアスタジオ、『あんスタ!!』シリーズのUIアップデートにおける開発ワークフローの効率化手法をZennにて公開
2025.12.19
UIと3Dシーンを異なる解像度で描画できる。Unity用オープンソースライブラリ、サイバーエージェント「コアテク」がリリース
2025.12.02

注目記事ランキング

2026.06.01 - 2026.06.08
VIEW MORE

連載・特集ピックアップ

イベントカレンダー

VIEW MORE

今日の用語

ライトマップ(Light Map)
ライトマップ 事前計算されたライティング情報を焼き付けたテクスチャ。リアルタイムのライティング計算は処理負荷が高いため、事前にライトマップにベイクする手法が取られることがある。負荷軽減につながる一方、実行中に光の向きを変更しにくいなどのデメリットも存在する。
VIEW MORE

Xで最新情報をチェック!