先日、「イカれたUIを作ろうの会」というオンラインイベントを開催しました。多くの皆さまにご参加いただき、誠にありがとうございました。 また、当イベントでは期待以上に自由で多様なUIがお披露目され、おおいに血湧き肉躍りました。主催者としてうれしい限りです。 ちなみに社内でも「ダメなUIを作ろうの会」と銘打って勉強会を実施しました。こちらもクローズドな空間ならではの盛り上がりを見せました。 社内での勉強会のお知らせ背景そもそもこのような会を実施した背景には、つぎのように思ったことがきっかけでした。 エンジニアとかUXとかDXとかHCDとかと比べてUIのイベントが少ない気がする。酔いどれUIデザイン選手権をやりたい。一番イカれたUIをデザインしたやつが勝ち。 — yumemi (@n__yumemi) January 24, 2023 たとえば、connpassで検索したときの結果は「UIデザイ

*アノマテカ* @hoshikuzucake 偏見かもしれないけど公共交通機関ってこういうとこあるよな、と思う。JRに限らず鉄道会社で「切符の買い方」みたいな基本的な情報がホームページのどこに書かれてるかわかりやすいとこってぜんぜんない。海外から来る人とか困ったりしないのかな？ twitter.com/akita11/status… 2023-02-10 23:53:07 *アノマテカ* @hoshikuzucake 自分は身体に障害があるし遠距離恋愛してたから、デート(という名の旅行)の予定を立てたら事前に行く場所の公共交通機関をよく調べたけど、バスも前払いなのか後払いなのか、前の扉から乗るのか後ろの扉から乗るのかも、ホームページのすごくわかりにくいところに書いてあるか最悪書いてなかったりした 2023-02-10 23:56:44

これは designing plus nine Advent Calendar 19日目の記事です。 こんにちは。ritarと申します。 今年の10月頃、YouTubeに大きいデザイン変更がありました。 アイコンの変更、角丸やレイアウトなど全体的に一新されているのですが、中でも自分が仰天したのは「アンビエントモード」という新機能です。 アンビエントモードこのモードをオンにすると、動画の下側のUI領域が、まるで動画部分から光が漏れているかのようにじんわりと色づきます。 これを見たとき自分は度肝を抜かれました。なんたってUIの領域にコンテンツの色が侵食しているのです。 これを踏まえて、最近UIと色について考えたことを、UIデザインの歴史を振り返りながら記していきます。先に要点を言うと、UIはどんどん「無色透明」になっていくと考えます。これは「技術が生活に浸透することによってUIは存在感を減らし

レオン@自遊人 @Leon_Lionnoheya これ走行中に操作し難いんよね。タッチパネル表示のやつも最悪。何でもかんでもボタン無くしゃいいと思うなよ！ twitter.com/fyozz/status/1… 2022-11-29 19:29:30

こんにちは、SOMPO Digital Labデザインチームのデザイナーの金（https://twitter.com/seikei_kin）です。普段はUIデザイナー・ウェブデザイナーとしてサービスやプロダクトの開発・設計に携わっています。 突然ですが、みなさんは真面目で、協力的で、積極性があって、物覚えがよい方でしょうか？あるいは最新のアプリの動向に詳しく、それらを使いこなせるリテラシーを十分にお持ちでしょうか？ 果たして自分はどうかと振り返ってみると、少なくとも自信をもってそうであるとは言えないのが正直なところです。なまけものかつわがままで、物覚えや察しも良くなく、実際、馴染みのないウェブのサービスやアプリを利用する場合には、些細なことでつまづいたり悩んだりした結果、途中で嫌になり諦めてしまうこともしょっちゅうです。 そして、実は私のようなユーザーは決して少なくないのではないでしょうか

Googleが提供するサービスのアイコンのデザインがアップデートされ、並べてみるとこんな感じになりました。

どうも。 最近エンジニアからデザイナーになったものです。 最近UIデザイナーになってUIデザインの情報源って意外とまとまってないなと思ったので、個人的によく参考にする情報源をまとめました。 ここに載ってないやつでおすすめの情報源あればコメントとかで教えてください。 OSガイドライン OSのデザインガイドラインはUIデザイナーだったら必ず読んでますよね。 Material Design デザインシステム的な話から装飾、カラーツールなどデザインに必要な話がとてもたくさん詰め込まれているためデザイン学習の教材として非常に優秀です。コンポーネントもユースケースやスペックまできちんと網羅されていて参考になるし、金と手間隙かかってるなあと思います。 Blogもあり、更新頻度は高くないですが面白い記事が多いのでたまに読んでいます。 Human Interface Guidelines こちらはApple

WebページやスマホアプリのUIをデザインした時に、数値上は均整がとれているのに、人の目の錯覚で違和感を感じることがあります。ちゃんと揃えて配置したのに、同じサイズなのに、同じ色なのに、なんだか違和感があることはありませんか？ この目の錯覚による違和感を取り除くUIデザインのテクニックを紹介します。 Visually distorted - when symmetrical UI looks all wrong by Gil Bouhnick 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 01. ボタンと同じ色だとテキストは明るく見える 02. 同じフォントでも小さいサイズだと細く見える 03. 背景画像の上のテキストは読みにくい 04. 行間が間違っているテキスト 形の扱い方 05. 整列されたのに揃っているように見えない

キャンセルボタンをデザインする時に、カラーで悩むことはありませんか？ キャンセルボタンに色をつけてはいけない理由、ニュートラルなグレーが適している理由を紹介します。 キャンセルボタンのデザインがアクションボタンと同じだと、ユーザーは迷ってしまいます。キャンセルできることを明確にすることで、認知速度が上がります。また、ボタンが3個以上だったり、ラベルが違っていると、ユーザーは余計に戸惑います。 Why Cancel Buttons Should Never Have a Color by UX Movement 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 キャンセルボタンに色をつけてはいけない理由 ニュートラルボタンのためのニュートラルカラー キャンセルに適したラベルとは グレーを使う時は十分に暗くする キャンセルボタンはニュ

前置き 去年の暮れ頃、最初に翻訳をしようと思ったキッカケがこの記事でした。海外ではモーションデザインに関する記事がMediumに存在し、日本語記事が存在しないことにストレスを感じていました。著者のJonasさんに連絡を取り、翻訳の許可をいただいたことからこのnoteの翻訳を始めました。 引用元 : Medium - Google Design - Motion Design Doesn't Have to be Hard 著者 : Jonas Naimark Googleのマテリアルデザインチームで働くモーションデザイナー。 彼のTwitter,Dribbleアカウントはこちら。 https://twitter.com/jonasnaimark https://dribbble.com/jonasnaimark モーションデザインはUIの表現力を向上させ、使いやすくする手立てになります。そ

売上を伸ばしたい。 課金率を伸ばしたい。 でも、難しい！ コンバージョンするサブスク UI を勉強したかったので、いくつかのアプリをスクショ。あたまの整理にまとめたのでアップ。 Web の LPO はかなりノウハウ系記事がありますが、アプリのサブスク UI は、まだまだ少ない気がします。誰かの参考になれば嬉しいです。 まとめ内のコメントは個人的感想です。まだまだ勉強中なので、お気軽にご意見いただけるとうれしいです。 ※ スクショは少し前に撮影したものなので、一部古くなってるかもしれません。 UI パターン 1. ミニマム型 2. プラン比較型 3. 横スクロール型 4. リスト型 5. ロング LP 型 規約表示パターン 1. 固定表示型 2. 隠しスクロール型 3. フッター型 4. 遷移型 サービスパターン 1. 探索財 2. 経験財 3. 信頼材 UI パターン1. ミニマム型最低限

セブン―イレブン・ジャパンは25日、いれたてコーヒー「セブンカフェ」に新型機を導入すると発表した。ホットとアイスや容器の大きさを自動で検知するセンサーを備える。利用客がコーヒーの種類を選ぶ必要をなくし、押し間違いを防ぐ。コーヒーを抽出する時間は従来よりも1割強短くし、利用客の待ち時間も減らす。25日に東京都内で開いた記者発表会で、新型機の導入の狙いについて商品本部の高橋広隆総括マネジャーは「使

Alan Smith氏は、ITの領域において幅広い経験をもつ、テクノロジーに関する熱心なブロガーです。彼は現在、ロサンゼルスに拠点を置くSPINX Digital Agencyと連携して仕事をしています。 UXとUIの定義についての論争は、その２つの言葉が現れて以来ずっと続いています。UXはUser Experience（ユーザー体験）、UIはUser Interface（ユーザーインターフェイス）を表しています。 さっぱりわからないですか？　これを理解できる瞬間はおそらくこないでしょう。エンドユーザーへのインターフェイスがユーザー体験に対してどのように影響を与えるかわかるでしょうか？ また、UXとUIという言葉が同じ時期に作られたものでないという事実も、この２つをとりまく混乱の原因のひとつであることは間違いないでしょう。UXとUIは、同時期に考え出された言葉ではなく、当初は明確に定義され

こんにちは、今回がはじめてのnote投稿になります！ タイトルにもある通り、今日はTwitterにて8月に行なっていたUIトレースについて感じたことをまとめていきます。 デザインの勉強を始めたばかりで、どうやって勉強しよう？と悩んでいる人や、最近だとCocoda!に登録してUIデザインの勉強をしてみようかな...と思っている人の参考のひとつにでもなれば嬉しいです。 あくまでも自分なりの見解であり初心者目線で書きますので、どうぞ暖かい目でご覧になってください...。(アドバイス随時受け付けてます！) そしてかなり迷ったのですが、この記事ではトレースしたものだけでなく、アウトプットしたものも全部載せます。プロのデザイナーさんが見たらツッコミどころ満載の作品ばかりだと思いますが、同じような境遇の方の励みになればと思って、、、、では目次です。 目次 1. 　UIトレースを始めたきっかけ 2. 　最

ひどいときにはあの状態で固まってたりするし。 いま何やってるのか、全体のうちどのくらい進んでるのか、あとどのくらいで終わりそうなのか、ちゃんと見せてほしい。

その快適さに外国人旅行者が驚いた日本のトイレ。清潔で臭わないのは当たり前。人を待たせない工夫でも最前線を走る。狭い空間に目を凝らすと、ノーベル賞の理論やインターネット技術がぎっしりと詰まっている。東名高速の愛鷹パーキングエリア（PA、静岡県沼津市）。PAといえば「トイレ休憩」での立ち寄りが多い。観光バスが次々到着すると、トイレの前に長蛇の列ができるのはよく目にする光景だ。ここのトイレは人間の

ハッブル宇宙望遠鏡が捉えた「DF2」銀河。欧州宇宙機関提供。(c)AFP PHOTO / ESA/Hubble 【3月29日 AFP】宇宙の4分の1を構成するとされ、目に見えず解明もほとんど進んでいない「暗黒物質」のない銀河の存在が28日、天文学者らによって初めて明らかにされた。 【特集】エイリアン？それとも…？ 宇宙の「謎」写真集 英科学誌ネイチャー（Nature）に発表された論文は、今回の発見によって、銀河の形成方法に関するさまざまな仮説の見直し、あるいは大幅な修正が必要となる可能性があると指摘している。 論文の共同執筆者であるカナダ・トロント大学（University of Toronto）の天文学者ロベルト・アブラハム（Roberto Abraham）氏はAFPの電話取材に応じ、「非常に奇妙」と述べ、「この大きさの銀河なら、通常の物質の30倍の暗黒物質があるはずだが、全くなかった」

UX Movementの著者、編集長。明快で効果的なデザインを愛し、ユーザのために日々奮闘しています。 メールアドレスは、もっとも間違いやすいフォームフィールドの１つです。 入力データにはさまざまな種類の文字による長い文字列が含まれているため、間違って入力してしまいがちです。これにより、ユーザーが間違ったメールアドレスを送信する可能性があるのです。 メールアドレス確認の問題 デザイナーは、メールアドレスの確認フィールドを追加することで、間違ったメールアドレスの送信を防ぐことができると考えています。メールアドレスの確認フィールドの追加で誤送信を何件か防ぐことはできるかもしれませんが、必ずしもすべてを防ぐことができるというわけではありません。 多くのユーザーは、メールアドレスの入力内容をコピーして、確認フィールドに貼り付ける傾向があります。これでは、ユーザーが間違ったメールアドレスを貼り付ける