前回は、「UIデザインってそもそも何なの？」という概論的な説明と、UIデザイン未導入の組織の中でみんなでデザインを始めてみるための施策（プロトタイピングとユーザビリティ評価）を話しました。 今回はサービス、プロダクト開発において、デザイナーではない人でも知っていて損はないUIデザインの重要ポイントについて説明します。主に以下の３つのテーマについて順番に議論をしていきます。 デバイスやソフトによるUIの違い ユーザーにかかる身体的・認知的負荷を理解する UIの重要概念（ナビゲーション、インタラクションなど）を知る 「ちょっと」と銘打っておきながらめちゃくちゃ長いnoteになってしまったので、気になる項目だけ読むか、何回かに分けて読んでいただくことをおすすめします、。 ※どこか内容に間違ってる部分やご意見ありましたらコメントいただけたら嬉しいです。 デバイスやソフトによるUIの違い皆さんがお使

弊社Nucoでは、他にも様々なお役立ち記事を公開しています。よかったら、Organizationのページも覗いてみてください。 また、Nucoでは一緒に働く仲間も募集しています！興味をお持ちいただける方は、こちらまで。 はじめに 人は見た目が9割 皆さん一度はこの言葉を耳にしたことがあるのでしょう。内面がどれほど素晴らしくても、外見がそれに見合わないと、なかなか本当の価値を認めてもらえないものです。 この話は人間だけでなく、アプリケーションにも当てはまります。どれだけ内容が素晴らしくても、見た目がイマイチだったり使い勝手が悪かったりすると、ユーザーに敬遠されてしまいます。(私は以前ネ⚪︎フリからア⚪︎プラに切り替えたのですが、使いにくく感じたため、すぐに元のサービスに戻しました) エンジニアの皆さん、優れた技術力を持ちながら、デザインが原因でユーザー離れを招いていませんか？そうならないよう

Googleマップは2023年9月頃から新たな外観のテストを実施しており、すでに新たな外観のGoogleマップを使っている人も多いはず。そんなGoogleマップの新外観について、15年前にGoogleマップのデザインに携わったプロダクトデザイナーのエリザベス・ララキ氏が苦言を呈しています。 15 years ago, I helped design Google Maps. I still use it everyday. Last week, the team dramatically changed the map’s visual design. I don’t love it. It feels colder, less accurate and less human. But more importantly, they missed a key opportunity to…

寺本.hackforplay(); @teramotodaiki プロフィールと背景情報をあらかじめ用意しておけば、あとは相手の話した内容をもとに選択肢を表示してくれて、ボタンを押すだけ これ全人類にとって理想のUIでは？？？ #未踏ジュニア pic.twitter.com/4PAUCrC7nV 2023-11-03 11:53:30

携帯電話を用いたコミュニケーションの手法の1つに「絵文字」がある。日本で生まれたこの絵文字は、GoogleとAppleによって標準化され、今ではさまざまなスマートフォンやPCでもでも閲覧できる。 その一方、ドコモで販売されるAndroidスマートフォンには、いまだフィーチャーフォン時代の絵文字が表示される。しかしこれが今のスマートフォンにそぐわない側面が出ている。この絵文字問題について考察したい。 今の絵文字は日本のものをベースにGoogleとAppleが標準化を提案 絵文字を携帯電話に採用したのは、NTTドコモが最初だ。この後にDDI（現au）、J-フォン（現ソフトバンク）が採用する形で続く。絵文字にはシフトJISというコードが用いられていたが、互換性維持の空き領域に絵文字を割り当てたことから、キャリア間で互換性がなく、文字化けの要因となっていた。 後に自動変換サービスも展開されたが、使

店によってセルフレジの仕様がぜんぜん違うことに対応できないんだ！ なんで西友とヨークフーズとセブンイレブンとファミリーマートで 札の入れ方も小銭を入れる場所も会計スタートボタンも違うんだ？ かつて明治末～昭和初期に初めて電話機というものが普及した時期も 対応できない老人はいただろうが、ダイヤルの形状と数字の並びは どこの電話機メーカーが作ったものもほとんど同じで プッシュホンの時代になってもメーカーごとの大差はなかったはずだろ 今のレジ機器メーカー各社はそういうことを何も考えてないのか？ あとなぜ現金対応の機器とキャッシュレス専用があるのか？ キャッシュレス専用機なんてうちの近所じゃほとんど使う奴がいないぞ！ 【2/20追記】 いちばんよく行く西友のはもう慣れてるんだよ そしてなまじ慣れると別の店でぜんぜん違う仕様に出くわしたとき戸惑う（老害） あと電話機の例えは良くなかった パソコンのキ

sabrinas.spaceより。 8週間もかからなかったはずのプロジェクト 日本のウェブデザインはどう違うのか? 2013年のRandomwireのブログ投稿で、著者(David)は、日本のデザインの興味深い相違点を強調しました。日本人はミニマリストのライフスタイルで海外に知られていますが、ウェブサイトは奇妙なほどマキシマリストです。ページには様々な明るい色(3色デザイン原則を破っている)、小さな画像、そして多くのテキストが使われています。2022年11月に撮影されたこれらのスクリーンショットで、自分の目で確かめて下さい。 ブログ投稿には、文化的専門家、デザイナー仲間、そして不満を抱く市民によって支持されている、考えられる理由がいくつか挙げられていました。 この理論が今でも正しいのか、また、もっと定量的なアプローチが可能なのか気になったのでやってみました。 私が見つけたもの 各国の最も人

なかざん @Nkzn これは農業ICTのめちゃくちゃ面白いところなんですけど、 アプリ開発文化圏の人「最高のUIでユーザーに気持ちよくアプリを使ってもらえるようにするぜ！」 ユーザー「土で手も手袋も汚れてるし、いちいち手袋外して操作するのも面倒だから、アプリは操作しないな」 が最低限のスタート地点です。

モミー 【少年ジャンプ＋編集】 @momiyama2019 「少年ジャンプ＋」編集長（デジタル担当）です。ほか「ジャンプルーキー！」「MANGA Plus by SHUEISHA」など。 リプライやDMの返信は気まぐれです。 https://t.co/BcS1vrJfWQ モミー 【少年ジャンプ＋編集】 @momiyama2019 先日、見知らぬ大学１年生から、漫画アプリのUIについて物申したい！というこんなDMが。 で、実際にお会いした。 話題はアプリの設計から、最終的には漫画表現の時代に合わせた進化など、広く漫画全体の課題や未来まで広がった。 結果、逆に僕の考えが整理されて意義深い時間に。学生氏に感謝！ pic.twitter.com/Q6XZUtPAEi

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

はじめに 現代では多くの人々がスマートフォンやタブレットを所持し、ゲームを楽しんでいることと思います。 モバイル向けのゲーム市場は大きく、世界では今も多くの開発者たちが iOS / Android 向けの商用ゲームを作っています。 さて、モバイルゲームの開発には、多くの開発者を悩ませるちょっと困った事情があります。 それは ディスプレイが非常に多くの多様性を持っている ことです。 正方形に近い形のタブレットもあれば細長い端末もあり、カメラがディスプレイの中に割り込んでいたり、 OS が専有する領域があったりと様々です。物理的な大きさもバラバラですね。 そのくせモバイル端末はタッチパネルで、ディスプレイに触れる UI になっているのです。 ゲーム開発を生業とする多くのエンジニア / アーティスト / ゲームデザイナーは、 これまでに何度も頭を抱えてきたことでしょう。 本稿では、2019 年現

大阪の実家に帰った時、リビングのテレビの裏側を見たらAmazonのFire Stick TVが挿してありました。このFire Stick TVをテレビに繋ぐと、Amazonのプライムビデオを観ることができるようになります。 プライムビデオには、Amazonプライムの会員であれば、追加費用を払うことなく楽しめる映画やドラマ、アニメなどが豊富に揃っています。さらに個別に追加金額を払うとほとんどの映像コンテンツを観ることができるという、まさにTSUTAYAキラーなサービスです。 うちのおかんは月に2～3回は映画館に行くほどの映画好きなので、プライムビデオのメインターゲットといえるでしょう。本来ならプライムビデオで映画三昧の毎日を送っていてもいいはずです。 しかしながら、Fire Stick TVを挿しているにもかかわらず、プライムビデオを一度も使っていませんでした。初期設定をした私の弟が一通り使

UIデザインの考え方を学びたい、UIデザインを説明するためのロジックを学びたい、使いやすい・分かりやすいとは具体的にどうデザインすればよいのか、そんな人にかなりお勧めの一冊を紹介します。 UIデザインや人間の認知について知りたいことがすぐに分かり、役立つと思います。 UIデザイナーやディレクターだけでなく、UI制作に関わるすべての人にお勧めです。 本書は2013年に刊行された「UIデザインの教科書」の新版で、2018年の最新環境にあわせて、構成および内容を全面的に書き直しされたものです。

Webサービスやアプリなど開発や運用に関わっている方であれば、こんなことを耳にしたことがあるのでは無いでしょうか？ 5人でテストを行えば、ユーザビリティ上の問題のうち85%を発見できるこれらは業界的にはある意味で常識ですが、色々話を聞いてみると、この常識の「出処」あるいは「根拠」ってあんまり知られていないようなのです。 もちろん、ちょっと知識のある人であれば、ユーザビリティ業界の第一人者であるヤコブ・ニールセン博士が提唱したというところまでは知識として知っているでしょう。しかしながら、その元ネタとなった論文を実際に読んだ人、あるいは85%という数字の根拠やその条件について理解されている方はどの程度居るのでしょうか。 ということで本記事では「ユーザテストは5人で85%」の元ネタである下記の論文について、解説、と言うとちょっと大げさかもですが、概要を紹介してみたいと思います。願わくば、この記事

これは私が最近よく訪問する日本橋駅直結の商業ビル、東京日本橋ビル内のエレベーターのボタンです。 唐突に質問ですが、このボタンで操作ミスを起こすポイントがあるとすれば、それがどこだか分かりますか？ 説明が必要と思いますが、このビルは7Fがオフィスロビーになっています。駅直結のB1と1Fからは7Fまで直通するシャトルエレベーターがあり、全員7Fで一度降り、セキュリティチェックをし、23Fより上にあるオフィスフロアに入ります。そのオフィスロビーとオフィスフロアを行き来するためのエレベーターのボタンがこれです。 ボタンが23Fから30Fまでしかなくて、下に大きく7Fのボタンがあるのは、そういったビルの構造からです。 私と同行したディレクター（26歳）は、打ち合わせが終わってオフィスフロアからオフィスロビーに帰る際に、操作ミスをしました。それも1度だけでありません。次の打ち合わせの帰りにもまったく同