※ おことわり ※ この記事内で取り扱っているゲーム作品について、私は開発上の関わりは一切ありません。あくまでいち個人・いちファンとしての考察であることをご承知おきください。 今回の視伝研テーマは【UIデザインの歴史を紐解く】です。 年表形式でUIデザインの歴史を作りながらメンバーと意見を交換しました。PCやスマートフォンのOSのUIはもちろん、乗り物の操縦桿やSNSのデザインなど、さまざまな観点で資料を集めてみました。 そこで、元ゲーム屋の性として、個人的に楽しくなってしまうのはやっぱりゲームUIの歴史なのですが… なんか、ゲームのUIってこんなイメージありませんか。 ゲームUIデザイナーを目指す初心者が作りがちなやつ （一応弁明するとこれは1〜2分くらいで作った雑UIです）もちろんこういうのを作れることは大事なんだけど、「ゲームでよくあるやつ」以外のデザインの引き出しがないままだといず

ゲーム開発者であり、『Unity 2017最適化ガイド Unityのあらゆるパフォーマンス問題を解決するための手引き』の日本語翻訳を担当したへっぽこさんは、2021年8月28日に技術書『Unity uGUI アドバンスド・リファレンス』を GitHub にて無償公開した。 これは Unity の uGUI （グラフィカルインターフェース制作を助けるツール）を使用するにあたって必要な知識、パフォーマンス改善の手段などをまとめた700ページ以上の書籍。 中級者以上を対象としており、現時点でゲームキャスト向けにゲーム開発者複数人から「この書籍は素晴らしい」という推薦を得たので記事として紹介しておく。 本書が公開されてすでに2日。 ネット上でも、「お金を支払いたい」などの声が上がっており、評判は上々の模様。 本書をゲームキャストに推薦した開発者の中には、「モバイルゲームのパフォーマンスを最適化しよ

お金はないけどUIはキレイにしたい！ “インディーズゲームにおけるUI制作”のノウハウが語られたセッションをレポート ライター：高橋祐介 2021年8月21日にインディーズゲーム開発者向けのオンラインカンファレンス「Indie Developers Conference 2021」が開催された。その中で，インディーズゲームのUIにフォーカスしたセッション「プログラマしかいない お金もない それでもUIを綺麗にする！」が行われた。 登壇したのは，東方Projectのファンゲーム「幻想郷ディフェンダーズ」「幻想戦略譚」などを制作した開発グループ，Neetpiaに所属する少佐氏。氏は両作品のプログラマでありながら，同時にユーザーインタフェース（UI）のデザインも手掛けているという。 少佐氏は大前提として「UIはデザイナーが専任すべき」仕事と前置きしたうえで，「実際の現場ではそこまで人手がなく，グ

モーションのアイデア出し用にただただ思いついた動きを作ったものです。 AEPデータ販売中 Outline Rotation Scale Tile Transparency Position Deformation Other ここまで読んでくださりありがとうございました！ ご意見ご感想はお問い合わせホームから、またはTwitterからお願いします！

↓本記事はアドベントカレンダー「Game Graphic Design Advent Calendar 2019」用に書きました。 ----------------------------------------------- 記事内容の削除についてのお詫びにつきまして 本記事は、ゲームタイトルの作例をもとに自分の目線で文章を書いておりました。 しかし、「ゲームUI演出ブログ」での記事削除などの事例もあり、 法的な部分での判断により記事を削除いたしました。 本記事にコメントを寄せていただいた方、みていただいた方々、そしてご紹介したゲームタイトルに関わっていた制作者の皆様方、本当に申し訳ございませんでした。 中には記事になったものに対して不快に思われた方もいるかもしれません。 制作者の皆様に強く敬意を表すとともに、以後改めて著作物であることを強く意識していこうと思います。

最近スクロールバーを見かけなくなった気がします。ざっと調べてみると、スクロールバーはすでに消え始めており、今のスタンダードはスクロールインジケーターになってる様です。そうかと思えば、そのスクロールインジケーターすら消え始めている状況です。 ▼１．消えゆくスクロールインジケーター1.1　フェイスブックiOSアプリ フェイスブックのアプリでは、もはやスクロールインジケーターすら表示されていません。ご自身のスマートフォンで見てみると、画面右側には何も表示されないはずです。 1.2　電話帳　iOS 実は電話帳からもスクロールインジケーターが消えています。インデックスが表示されているので、スクロールインジケーターとインデックスが重なってしまうのを防ぐためと思われます。 1.3　メモ帳　iOS メモ帳ではスクロールをするまでインジケーターは表示されません。スクロール後は一定時間が経つとスクロールインジ

イージングなしとあり 画像ではイージングがわかりやすいようにグラフを入れてあります。 横が時間、縦がスケール、点がキーが打たれていることを表しています。 UIごとのイージング UI素材ごとにどのような緩急の付け方が良いのか迷うかと思います。 ダイアログアニメーション以外に、画面遷移時のUIの動きやクエスト開始演出など様々なアニメーションを入れるたびにどのイージングが正解なのか、それについては正解はありません。 ゲームの色味やデザイン、世界観を知らずにアニメーションは付けられません。 また、UIがどこまで世界観を踏襲するのかで、システムのような動きにするのか、世界観に合わせた動きにするのかも変わってきます。 こういった部分は関係部署にコミュニケーションをとってどんなゲームを作りたいのかを把握し、イージングはどうするのかを考えていきます。 そして、予備動作やオーバーシュートが必要なのか不要なの

Webサイトでもスマホアプリでも、アイコンのデザインは非常に重要です。優れたアイコンをデザインするために必要な7つの原則を紹介します。 アイコンだけでなく、UI全体のデザインにも通じるプロのデザインテクニックが詳しく解説されています。 7 Principles of Icon Design by Helena Zhang 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 Clarity -アイコンは分かりやすく Readability -アイコンは見やすく Alignment -アイコンにおける揃え Brevity -アイコンは簡潔にデザインする Consistency -アイコンの一貫性 Personality -アイコンの個性 Ease of Use -アイコンの使いやすさ アイコンのリソース Clarity -アイコンは分か

ホーム ニュース Nintendo Switchの「ホーム画面のUI」を独自に改善する“あそび”がにわかに盛り上がりを見せる。とある開発者の発言に触発か 多くのゲームファンが集まるコミュニティサイトRedditでは、PS4であれXbox Oneであれ、いわゆるホーム画面のUIを独自にデザインし直した画像が投稿されることがある。アイデアを思いついた人がその時々に制作して披露しているため、そう頻繁に投稿されているわけではなかったが、Nintendo Switchのコミュニティではこの数日だけで複数のアイデアが投稿され、ちょっとした盛り上がりを見せている。 Image Credit: thisismybike Image Credit: thisismybike デザインの方向性はさまざまだが、たとえばゲームのアイコンのサイズを変えてホーム画面により多くのタイトルを表示させたり、任意のテーマの作

デザインシステムとは、サービス開発する上で必要となるデザインの概念、スタイルガイド、コンポーネント集などで構成されるデザインのルールです。 Salesforce.comの「Lightning Design System」が2015年に登場して以来、多くの企業がこのデザインシステムを導入するようになりました。 プロトタイピングツールで有名なUXPinが提供するデザインシステムプラットフォーム「adele」では、90個以上（2019年12月現在）ものデザインシステムが公開されています。その企業のラインナップを見ると、大手ITベンダー、SaaSベンダーのみならず、自治体、金融機関、大学など多くの業界で、組織のブランド確立のために、デザインシステムを活用していることが分かります。 GoogleやAppleが提供するデザインシステムは、既に多くのブログで語りつくされていますが、その他の企業でも素晴ら