タグ

UIとUXに関するreboot_inのブックマーク (16)

  • AIブームの今だからこそ見つめたい、人間性を感じるアプリUI|Goodpatch Blog グッドパッチブログ

    今デザイン界隈でもブームになっている「AI人工知能)」。トレンドを追いかけていると、便利で効率的でクリエイティブな未来にワクワクする一方、人間らしさやアナログの世界が恋しくなることはありませんか? デザインにおいて、「人間らしさ」というのは大切な要素だと思っています。例えば、ユーザーが困ったときにそっと手を差し伸べてくれるような機能。これは便利さや効率だけでは届かない、人間だから、人の優しさがあるから生まれるものでしょう。 私自身、そんな「作り手の『Humanity(人間性)』が感じられる」デザインやソフトウェアが大好きなのですが、その仕掛けの多くは、些細なインタラクションや文言に宿っているもの。意識的に観察しなければ見逃してしまうでしょう。それだけ、ユーザーの意識に融け込んだ体験であるとも言えます。 この記事では、作り手のHumanityが感じられるソフトウェアについて、アプリUIの観

    AIブームの今だからこそ見つめたい、人間性を感じるアプリUI|Goodpatch Blog グッドパッチブログ
  • 優れたフォームをデザインする

    サインアップのフローであれ、マルチビュー・ステッパーであれ、ありきたりのデータ入力であれ、「フォーム」はデジタル・プロダクト・デザインにおいて最も気を遣わなければならないものの1つです。 そこで、今回は一般的にフォーム・デザインで何をやり、何をやらざるべきかについてお話したいと思います。あくまで一般的なガイドラインですので、そのようなものとしてご理解頂いた上で、皆さんの参考になれば幸いです。

    優れたフォームをデザインする
    reboot_in
    reboot_in 2022/09/25
    “選択肢が5つ以下ならドロップダウンにせず全て表示させる”
  • 優れたユーザーインタフェース(UI)を実現するチェックリスト36項目

    【img via tabletop assistant by MattHurst】 優れたユーザーインタフェースとは何か。どのようなデザインを「優れたユーザーインタフェース」と呼ぶのに相応しいのだろうか。 GoodUIというサイトに優れたユーザーインタフェースを実現するために確認しておきたい36項目をイラスト付きで解説していた。とても分かりやすく納得できる内容が多かったので、紹介しておく! 1.マルチカラムではなく、シングルカラム 複数カラムだとユーザーの目線が左右に逸れてしまう可能性があるため。 2.まずはギフトを渡してみる 最初から買うことを促すよりもまずはこちらから何かを与えることによってユーザーに喜ばれる。 3.似た機能や項目は1つにまとめて表示する 似た機能を分散させる必要はない。 4.ユーザーからの反応を載せる 実際に使っている「ユーザーの声」を参考に買い物をする人は少なくない

    優れたユーザーインタフェース(UI)を実現するチェックリスト36項目
  • これだけは押さえよう!住所フォームの作り方 - ケンオールブログ

    まとめ 住所フォームの作り方 住所フォームを作るときには以下の4つを押さえましょう。 オートコンプリート機能に最適化する 郵便番号フィールドは1フィールドにしてハイフン有無どちらも対応する モバイルUX優先なら郵便番号が入力されたら即座に補完。精度優先なら郵便番号補完ボタンを設置 住所フィールドは「都道府県」「市区町村」「町名以下」の3フィールドが基。「建物」フィールドはオプション 文 地域SNSのユーザー登録、ECサイトの配送先入力、資料請求、自治体サイトでの電子申請など、ウェブサービスを活用する上で住所入力は欠かすことができません。 住所入力をシンプルかつ正確に行えるような入力インタフェース(住所フォーム)は、離脱率を減らし、コンバージョン率を向上させる上で重要です。 郵便番号を入力すると対応する住所を自動入力する機能(郵便番号による住所補完)は、住所フォームの改善方法として最も効

    これだけは押さえよう!住所フォームの作り方 - ケンオールブログ
  • to-round.com

    to-round.com 2024 著作権. 不許複製 プライバシーポリシー

  • プログラマのためのUXチートシート — ありえるえりあ

    はじめに http://msdn.microsoft.com/ja-jp/library/aa511258.aspx の 「Windows ユーザー エクスペリエンス ガイドライン」 「ガイドライン」 主に「コントロール」 の抜粋です。 以下の基準で抜粋しました Web UIに応用可能 実用的かつ具体的 自明ではない プライマリUIを目立たせる プライマリ UI 要素を強調するには、以下に従います。 - プライマリ UI 要素は、視線の通り道に配置します。 - タスクを開始する UI 要素は、左上隅または中央上に配置します。 - コミット ボタンは、右下隅に配置します。 - 残りのプライマリ UI は、中央に配置します。 - コマンド ボタン、コマンド リンク、アイコンなど、注意を引き付けるコントロールを使用します。 - 大きなテキストや太字のテキストなどの目立つテキストを使用します。 ユ

  • 【悪いUI・良いUI】発想の転換から打開したアイデアまで【デザイン思考】|Angry Breakfa$t

    ※某まとめサイトにてまとめていた記事の転用です BASENAME: 2150782012031271001 STATUS: Publish ALLOW COMMENTS: 1 ALLOW PINGS: 1 CONVERT BREAKS: richtext DATE: 12/06/2018 00:54:50 良い・悪いと思ったデザイン例からデザイン思考、デザインに関した事例などを多数サイトやSNSでの投稿を参考・引用してまとめました。 ■はじめにデザインに関する疑問や、ここでの前提をまずまとめていきます。 ―――デザインとは? (design)の語源は、デ(de:削る)・ザイン(sign:形作る)である。これはラテン語で「私欲を削り落とし、質を磨き上げること」を意味する。 出典 なぜゴッホは貧乏で、ピカソは金持ちだったのか? | 山口 揚平 | | 通販 | Amazon デザイン(de

    【悪いUI・良いUI】発想の転換から打開したアイデアまで【デザイン思考】|Angry Breakfa$t
  • Disney Plus: Writing a Better Sign-Up Experience for iPhone

    Unsolicited redesign of Disney Plus’ sign-up process by Jeff Shibasaki Part 1: The ChallengeBackgroundDisney+ is the on-demand, subscription streaming service that's home to movies, series and originals from Disney, Pixar, Marvel, Star Wars and National Geographic. ProblemUsers need a way to sign up to Disney+ that’s more benefit-driven and helpful at each step. If the sign-up process isn’t clear,

    Disney Plus: Writing a Better Sign-Up Experience for iPhone
  • これぞプロのデザイン!UIとUXの印象がよくなるデザインの知識とテクニックのまとめ

    デザインはちょっとした一手間を加えるだけで、ぐっとよくなります。 UI&UXデザイナーによるWebページやスマホアプリのUIUXを改善するデザインの知識とテクニックを紹介します。 UI & UX Micro-Tips: Volume One. by Marc Andrew 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 1. 装飾的な要素をたまに使うのは全く問題ありません 2. UIの要素は互いに区別できるようにする 3. シャドウはわずかな量があるだけで十分 4. 見た目的に分かりやすいフォントを選択する 5. パンくずはユーザーが理解しやすいようにする 6. 彩度の高いカラーは慎重に はじめに 次のプロジェクトのために効率的で美しいUIを作成するとき、デザインをすばやく改善するためにわずかな調整で済むことがありま

    これぞプロのデザイン!UIとUXの印象がよくなるデザインの知識とテクニックのまとめ
  • ソシオメディア | ヒューマンインターフェース ガイドライン

    ソシオメディアがまとめている、ヒューマンインターフェースをデザインする際の指針です。これらは、インターフェースデザインに関する様々な文献と、実際のデザインコンサルティングで得た知見をもとに、ソシオメディアが独自に編纂したものです。継続的に追加・更新していきます。 すべてモデルインタラクションプレゼンテーション

    ソシオメディア | ヒューマンインターフェース ガイドライン
  • Muzli - Design inspiration hub

    Designers' Secret SourceThe best design inspiration - expertly curated for you.Muzli is a new-tab browser extension that instantly delivers relevant design stories and inspiration to keep you in the loop. More about Muzli Get Muzli for Chrome Dennis SnellenbergFreelance Designer & Developer, Awwwards judge“When I just started with design Muzli helped me to get more reach and followers. The Paralla

    Muzli - Design inspiration hub
  • ゲームUIブログ

    Search for: Cancel 【雑記】GRANBLUE FANTASY: Relink資料に学ぶ絵作り ほか 恋は職場で 異世界の魔王様 銀河英雄伝説 Die Neue Saga モンスター娘TD ANGELICA ASTER エンバーストーリア ステラートラベラー(Stellar Traveler) レゾナンス:無限号列車 鋼嵐-メタルストーム Pokémon TCG Pocket ドット魔女 私は魔法(物理)で無双する リバースブルー×リバースエンド 2.5次元の誘惑 天使たちのステージ(リリステ) ウパルオデッセイ 1 of 90123…90次へ »

  • アプリのアップデート300本ノックから学ぶUI改善のヒント|宮﨑 晃

    こんにちは、HR業界でアプリマーケティングをしている宮﨑です。 ・アプリのアップデート前後のUI変化 ・Push通知など気になったGrowth施策 こうしたものを「#アプリノック」としてTwitterで投稿すること3ヶ月。300以上のネタが溜まってきました。 今回のnoteでは「フォッグの消費者行動モデル」というフレームワークを使ってまとめていきます。 行動 = 動機 × 実行能力 × きっかけ ザックリいうとユーザーに何か行動を促す際に「動機/実行能力/きっかけ」の3要素をどう揃えるか?というモノ。 詳しくは深津さんの記事がとってもわかりやすいのでおススメです。 アプリノックがUI改善の勘所だけでなく、Growthの知識も一緒に学べるコンテンツになっていくと嬉しいです。 それではいってみましょう! 【動機】がないと、やる気にならない①慣れない体験にはイメージ作りを よくわからない体験は

    アプリのアップデート300本ノックから学ぶUI改善のヒント|宮﨑 晃
  • 「Amazonのプライムビデオが難しい」というおかんの言い分を聴いてみた|Tsutomu Sogitani

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

    「Amazonのプライムビデオが難しい」というおかんの言い分を聴いてみた|Tsutomu Sogitani
    reboot_in
    reboot_in 2020/09/27
    “例えば「2週間限定で観る(400円)」「期間無制限で観る(2500円)」みたいなラベリングの方が、おかんのような人には分かりやすいと思われます。”
  • 任天堂のUI/UXデザイナーが語るデザイン思想。UI Crunch #13 娯楽のUI【書き起こし前編】|Goodpatch Blog グッドパッチブログ

    ナレッジ・ノウハウ 任天堂のUI/UXデザイナーが語るデザイン思想。UI Crunch #13 娯楽のUI【書き起こし前編】 私たちが利用するサービスやプロダクトには、毎日使う実用品もあれば、娯楽品もあります。目的は異なっても、どちらも生活に欠かせないものです。技術が進化し、新しいものが生まれ続ける現代において選ばれるサービスやプロダクトには、人に寄り添ったデザインが求められることは想像に難くないでしょう。では、娯楽品のデザインに潜むロジックや哲学はどのようなものなのでしょうか。 2018年4月27日、DeNAとGoodpatchが主催するUI Crunchは、任天堂株式会社さまをゲストに迎え「UI Crunch #13 娯楽のUI – by Nintendo –」を開催しました!告知開始直後からたくさんの反響をいただき、最終的には4200人以上の方々にご応募いただきました。伝説の回となっ

    任天堂のUI/UXデザイナーが語るデザイン思想。UI Crunch #13 娯楽のUI【書き起こし前編】|Goodpatch Blog グッドパッチブログ
  • The ultimate guide to proper use of animation in UX

    Nowadays it’s hard to impress or even surprise with an interface animation. It shows interactions between screens, explains how to use the application or simply directs a user’s attention. While exploring the articles about animation, I found out that almost all of them describe only specific use cases or general facts about animation, but I haven’t come across any article where all rules concerni

    The ultimate guide to proper use of animation in UX
    reboot_in
    reboot_in 2020/02/25
    “サイズが不均衡に変化するオブジェクトの動きは、円弧に沿って配置する必要があり、サイズの比例的な変更は直線で実行されます”
  • 1