タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

UIとUXに関するuca_coのブックマーク (10)

  • その Dialog は本当に必要ですか? - Qiita

    ダイアログは、ユーザとの対話の中でも特に「確認」や「注意」を促すために用いられる UI コンポーネントの一つです。二択あるいは三択の項目を配置して、YES/NO や OK/Cancel などのインタラクションを用意することで、ユーザとの対話をすることが出来ます。あるいは、単に現在の状態を表示(読込中など)し、その他の各種操作をブロックすることで、待つ必要が有ることを明示することも出来ます。 一方で、ダイアログはその表示が画面の前面に大きく表示され、時にダイアログ以外へのインタラクションを禁じる場合もあることから、使いどころを間違うと非常に陶しく見えるものでもあります。また、ダイアログのキャンセル操作が出来ない場合において、いつまでもダイアログが出続けてしまうとユーザの負担は大きくなります。 この記事では、ダイアログを使用している場面において、その他の表現方法や実装の工夫を使うことができる

    その Dialog は本当に必要ですか? - Qiita
    uca_co
    uca_co 2018/07/25
  • OKボタンの配置は、左右どっち?UI設計のための情報アーキテクチャ - 酔いどれデザイン日誌 - Drunken Design Diary -

    仕事Bootstrapを使って管理画面の設計およびデザインをする機会がありました。そこふと気になってみて調べてみたのですが、皆さんはOKボタンを左右どちらに置いていますか? これについての興味深い研究結果がありました。2006年の調査と少々古いものではありますが、その質は非常に情報アーキテクチャとしての的を得ています。概略を説明すると、Windowsは左にOK、右にキャンセルが標準のUIMacintoshはその逆で左にキャンセル、右にOKであり、この調査ではそれぞれのOSのユーザーに対して、左右どちらのOKボタンの方が認識されやすかったか?というのを統計で明らかにしています。 私はどうも、Windows標準の「左側にOKボタンがある配置」が気持ち悪く感じます。別にマカーでも無いですし、むしろ生まれてこのかたずっとWindowsを使っているのにも関わらずです。 そこで調査結果を見てみた

    OKボタンの配置は、左右どっち?UI設計のための情報アーキテクチャ - 酔いどれデザイン日誌 - Drunken Design Diary -
    uca_co
    uca_co 2017/04/12
  • 「OK」「キャンセル」、どちらが先か?

    OKボタンはキャンセルボタンの前と後、どちらに置くべきか? ダイアログボックスをデザインするたびにその都度判断するよりも、各プラットフォームでの慣習に従う方が大切だ。 OK–Cancel or Cancel–OK? by Jakob Nielsen 2008年5月27日 ユーザエクスペリエンス全体には大して影響しないようなUIデザインの細々とした問題について、われわれの元には数え切れないほどの質問が寄せられる。昔からよくあるのが、ダイアログボックス内でのボタンの並び順はどちらにすべきかという質問だ: OK / キャンセル キャンセル / OK 両方ともそれなりに筋が通っている並べ方であり、どちらを好むかは人それぞれで、一方に決めるのは無理だろう: OKを先にする並べ方は、英語を始めとする左から右へ読むタイプの言語では、自然な読み取り順序に沿っていることになる。これ以外のボタンの組み合わせも

    uca_co
    uca_co 2017/04/12
  • ボタンデザインで押さえておきたい4つのポイント【プロ直伝】 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    こんにちは、株式会社LIGでアートディレクターをしている竹原と申します。 「デザインとは情報設計」、といわれています。例えばボタンでも、アクションやレイアウトに応じてさまざまな設計をおこなっているんです。 今回は、僕が普段ボタンデザインをする際に考えてることをまとめてみました。デザイナーの方にはWebやUIのデザインをする際の考え方の参考に、デザイナー以外の方には、デザイナーって普段こんなことを考えながらデザインしているんだな、と感じていただければ幸いです。 独学でつまずいていませんか? Webデザインをもっと効率的に学びたい、プロの現役デザイナーに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGでもWebクリエイター育成スクール「デジタルハリウッドSTUDIO by LIG」を運営しております。「今すぐスクールの概要を知りたい!」という方は、ぜひこちらより資料を

    ボタンデザインで押さえておきたい4つのポイント【プロ直伝】 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
    uca_co
    uca_co 2017/04/12
  • ボタンのラベルや配置順序のベストプラクティスとは | UX MILK

    サイトやアプリにおける典型的なフォーム(もしくはダイアログボックス)には、通常いくつかのボタンがあります。ほとんどのケースで、ユーザーは2つの選択肢を目にします。1つはユーザーの主となるタスクを表し、一方は付随する副次的なタスク(フォームに入力した内容の取り消しやキャンセルなど)を表します。 この記事ではアクションボタンに関する基的なUXについて概観し、デザイナーの間でよくある質問である「OKかキャンセル、どちらのボタンが最初にくるべきか」に答えます。 エラー防止 Jakob Nielsen氏のユーザビリティ・ヒューリスティックによると、「丁寧なデザインによって、最初の段階で問題が起こることを防止する」とあります。ユーザーが突発的に間違ったものを選択してしまうかもしれない状況を排除できるように努力する必要があります。 濃淡で視覚的な区別をつける 2つのボタンの違いを明確にするために、ボタ

    ボタンのラベルや配置順序のベストプラクティスとは | UX MILK
    uca_co
    uca_co 2017/04/12
  • 常にキャッチアップしよう!iOSヒューマンインターフェイスガイドライン

    この投稿は、 UI Design Advent Calendar 2016の14日目の記事です。 OSのアップデートに伴い新機能が追加されているため、改めて見返すとiOSのヒューマンインターフェイスガイドライン(以下HIG)も一部変更が加えられています。 過去に読んだことはあっても常にキャッチアップしなければ、デバイスに適した設計からずれてしまい、ユーザーの期待する体験を提供できなくなってしまうのではないでしょうか。 今回は、アプリデザインをする際に改めて意識すべきHIGをおさらいしつつ、以前と変わった部分などをピックアップしながらご紹介したいと思います。 iOSのUIデザイン基3原則おさらいの第一歩として、原則を改めて見てみましょう。 他のプラットフォームとの区別にもなり、品質と機能性を高めるためにも必要なUIデザインの基3大原則があります。 実はこの原則、iOS9まではDefere

    常にキャッチアップしよう!iOSヒューマンインターフェイスガイドライン
    uca_co
    uca_co 2017/04/12
  • 『「AWA」のデザインはどのようにして作られたのか。』

    こんにちは。 AWAでアートディレクション/デザイン/ブランディングを担当しているムロハシと申します。 今回はAWAのUIデザイン、インタラクションがどのようにしてつくられたのか、 先日行った「 メディアプロデューサー養成講座」の講義内容をベースに、 簡単ではありますが書いていきたいと思います。 「AWA」とは? AWAとは、ひとことで言うと 「登録なしですぐに音楽が聴ける定額制の音楽配信アプリ」です。 サービスの特徴として第一にあげられるのは、 ・好きなアーティストを聴くだけでなく「プレイリスト」を軸に、自分の好みにあった音楽が「リコメンド」されること リコメンドを通じて「昔好きだったあの曲」や「まだ知らなかったけど好きな曲」を一人ひとりにパーソナライズしてお届けしています。 そのほかの詳しい説明は プレスリリースをご覧いただければと思います。 インタラクションモックの重要性 AWAの初

    『「AWA」のデザインはどのようにして作られたのか。』
    uca_co
    uca_co 2015/08/31
  • UIデザインとUXの超基礎「UI Design & UX for ENGINEER」

    第1回スマホデザイン会議 #sdkaigi AQUA SOCIAL DRIVE - http://aquadrive.jp/ Newers - http://www.newers.net/ Pelo - http://www.pelo.jp/ Cotto - http://cotto.jp/ Pelo's Puzzle - http://www.bascule.co.jp/pelopuzzle/ Bascule Inc. - http://www.bascule.co.jp/ Bascule GO! - http://www.facebook.com/BasculeGo

    UIデザインとUXの超基礎「UI Design & UX for ENGINEER」
    uca_co
    uca_co 2014/04/21
  • 1分でわかるUIとUXをわかりやすく説明する写真とお話 | インタラクションとデザイン

    ユーザインタフェース 使いやすいように、 わかりやすい画面に、 間違えにくいように、 美しい情報デザイン、 丁寧な説明。 すばらしいユーザインタフェースができた。 ユーザエクスペリエンス しかし、そのATMは少し時間がかかった。 結果的にお客さんは並ぶことが多くなった(気分を害す、イライラ)。 「お金を引き出す、預ける」という銀行の体験は悪くなってしまった。 解説(UIからUXが重要と言われようになった理由) この場合、良いユーザインタフェースを設計できたとしても、並んでしまうことを問題として扱わなくなる。ユーザインタフェースの設計としては、最高のATMを提供することはできるだろう。しかしユーザエクスペリエンスからみると、最高の預金・引出体験にはらない。つまり、最高のUIを提供しても、ユーザの問題を解決したことにならない。だから「ユーザの体験という視点からUIを設計していこうよ!」という流

    uca_co
    uca_co 2012/11/01
  • デオシークの口コミや効果を検証!ワキガの私が使い込んでみました! | 愛と小町

    デオシークの特徴 加齢臭も撃退 強烈な足のニオイも撃退 ワキ、足など全身のニオイをシャットアウト デオシークは厚生労働省が認可した医薬部外品で、殺菌効果や消臭効果がきちんと認められた有効成分が配合されている商品です。 市販されているデオドラントクリームと比べると、医薬部外品は入っている成分が違いますので、消臭効果が高いです。 デオシークは、デオドラントクリーム単品でも消臭効果が期待できますが、ボディソープとのセットを使用することでさらなる消臭効果が期待できます。 ワキガや加齢臭などのような頑固な臭いによる悩みは深いですが、デオシークによって悩みから解放される人が増えています。 博士有効成分は消臭効果や殺菌効果が認められている成分なんだ 頑固な臭いはデオシークで一発なんだ もう怖くないんだ 価格 3,380円(定期コース) 6,980円(単品購入) 有効成分 パラフェノールスルホン酸亜鉛、イ

    uca_co
    uca_co 2012/08/09
  • 1