タグ

ブックマーク / popinsight.jp (11)

  • トグルボタンが混乱を招く理由 - ポップインサイト

    すべてのボタンがアクションを実行するわけではありません。たとえばトグルボタンなどは、アプリの状態を変えるために使われます。1つのコントロールで複数の機能をもつので、UIのスペースを節約することができます。トグルボタンは押すと状態が瞬時に切り替わりますが、それ故に正しく設計しないと問題が発生します。 反転したカラースキーム vs 通常のカラースキーム トグルボタンの課題は、現在の状態をいかに明らかにできるかというところにあります。視覚的な手がかりが明確でない場合、ユーザーはアクティブな状態を認識できないことがよくあります。これにより、誤ったオプションを選択してしまい、意図しない状態を引き起こしてしまう可能性があります。 特に混乱が起きやすいのは、現在の状態を示す視覚的な手がかりが反転色である場合です。このトグルボタンは一般的ですが、最適解ではありません。ユーザーには、暗い色のボタンがアクティ

    トグルボタンが混乱を招く理由 - ポップインサイト
    atomicmap
    atomicmap 2019/09/06
  • すぐれた開発者体験のためにデザイナーができること - ポップインサイト

    AlexanderはStockholmに住むUXデザイナーです。アクセシビリティやフロントエンドの開発において長年の経験があります。 私は仕事の中で、優れた開発者経験がプロジェクトの成功に大きく寄与していることを知りました。この記事では、デザイナーとしてプロジェクトに貢献するヒントを紹介します。 私は、スウェーデンのストックホルムでUXデザイナー、フロントエンド開発者として8年間働いています。これまでに参加したプロジェクトを振り返ってみると、すばらしいユーザー体験を提供することができたプロジェクトには、いつも優れた開発者体験がありました。一方で、開発者を無視したプロジェクトでは、期待された体験が得られないことが多かったのです。 少し単純化しすぎかもしれませんが、開発者体験(DX=Developer Experience)は開発者のユーザー体験であると言えます。 「開発者体験」という言葉は珍

    すぐれた開発者体験のためにデザイナーができること - ポップインサイト
    atomicmap
    atomicmap 2019/07/17
  • ユーザーを離脱させない電話番号の入力フォームとは - ポップインサイト

    UX Movementの創立者、ライター。ユーザーに優しいUXデザインのスキルを読者の方が上達できるよう、UX Movementのブログを始める。 電話番号入力フォームは、生年月日入力フォームと並んでくせ者です。たくさんのフォーマットがあり、どの入力方法が正しいかを見分けにくいことがよくあります。国番号を入力すべきか否かさえよくわかりません。 適切な入力フォーマットを判別できないと、ユーザーは電話番号入力フォーム以外の項目も入力内容が不適切なのではと不安になります。電話番号入力フォームでエラーがでると、フォーム入力自体を放棄してしまうかもしれません。 どのフォーマットが正しく、どのフォーマットでエラーが出るのかを、ユーザーが入力時に困惑しないように伝えるべきです。もしユーザーが困惑するようあればユーザー体験が乏しいということなので、デザインし直す必要があります。入力フォーム改善のためには、

    ユーザーを離脱させない電話番号の入力フォームとは - ポップインサイト
    atomicmap
    atomicmap 2019/01/21
  • マイクロインタラクションを考慮すべき4つの理由 - ポップインサイト

    自身の旅行体験をまとめているフリーWebデザイナー。オンラインの小さなリブランディング会社と仕事をしている。会社の理念は、顧客が希望を持ち、人生を新たにもっと楽しめるような製品を作り、提供すること。 マイクロインタラクションは、私たちの周りに溢れています。これはユーザインターフェイスの特定の瞬間のやりとりに用いられるものです。たとえば、ユーザーがモバイルアプリのボタンをタップするとナビゲーションメニューが開かれるなどが一般的なマイクロインタラクションになります。 より詳しく述べると、マイクロインタラクションとはユーザーがどこかでなにかの操作をしたときに起こる、インターフェイス上のアニメーションや変化を指します。ユーザーにとって有益な情報を提供するインタラクティブなアニメーションのことだと考えてください。マイクロインタラクションを利用する理由はたくさんありますが、ここでは4つの例を紹介しまし

    マイクロインタラクションを考慮すべき4つの理由 - ポップインサイト
    atomicmap
    atomicmap 2019/01/16
  • 優れたダッシュボードをデザインするための10のガイドライン | UX MILK

    Neilは、イギリスのAstraZenecaで働くUXデザイナーです。現在さまざまなUXデザインプロジェクトを率いています。 もしあなたがプロの自転車競技に詳しければ、「アシスト(Domestique)」という用語を聞いたことがあるでしょう。馴染みがない人に向けて説明すると、アシストとは自転車競技のチームにおける選手の役割を指します。「Domestique」はフランス語で「下僕」という意味です。 アシストの選手は、水のボトルをチームの車から集めてほかのチームメイトに渡すという役割を担っています。また、チームの車が近くにいないときに先頭選手の自転車が故障したら、自分の自転車や予備のタイヤを渡します。さらに、遅れているメンバーがいれば、先頭集団に追いつくまで彼らを牽引し、追いついたら自分はペースを落とします。このようにアシストの選手は無欲にひたすら奉仕し続けます。決してアシスト自身がレースに

    優れたダッシュボードをデザインするための10のガイドライン | UX MILK
    atomicmap
    atomicmap 2018/12/05
  • クレジットカードのオンライン決済で考慮したい3つの好事例 - ポップインサイト

    Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 クレジットカードでのオンライン決済は簡単です。私たちのうちほとんどは、財布からクレジットカードを取り出し、カード情報を入力して、送信ボタンを押してオンライン上で支払いを済ませます。しかし、カードデータの入力をさらに簡単にする方法があるのです。 オンライン決済でクレジットカードデータを収集するための、3つの異なる方法をみていきましょう。 方法1. データ入力の手続きをガイドする クレジットカードで支払いをするとき、ユーザーは通常、以下の情報を入力します。 カード番号 有効期限 セキュリティコード フルネーム 下のGIF画像はRamakrishna氏によるコンセプトで、上記の情報を正確かつクリエイティブに要求するものです。ユーザーがクレジットカード番号の入力を始める

    クレジットカードのオンライン決済で考慮したい3つの好事例 - ポップインサイト
    atomicmap
    atomicmap 2018/11/19
  • 見出しを最後まで読まないユーザーのためのアイブロウヘッドライン - ポップインサイト

    UX Movementの創立者、ライター。ユーザーに優しいUXデザインのスキルを読者の方が上達できるよう、UX Movementのブログを始める。 ユーザーがオンラインで読むことを想定して、文言を書いていますか? アイトラッキング調査によると、多くのユーザーはオンライン記事の見出しを数単語だけ読み、最後までは読まないそうです。 さらなる調査で、ほとんどのユーザーが見出しの最初の2単語だけに目を通していることがわかりました。ユーザーはCTAをクリックする前に、見出しを見て内容を予測しているのです。 ユーザーは早くキーワードを知りたがる 見出しの最初の2単語でユーザーに文のヒントを与えないと、ユーザーは見出しをスキップするだけではなく文自体も読まないでしょう。 ユーザーが情報を手に入れるまでの忍耐力と行動力は長く続きません。そのため、彼らの興味を引くために見出しの最初の数単語に強いキーワー

    見出しを最後まで読まないユーザーのためのアイブロウヘッドライン - ポップインサイト
    atomicmap
    atomicmap 2018/10/22
  • エラーメッセージはフォームのどこに表示するべきか - ポップインサイト

    UX Movementの著者および設立者です。ユーザー体験のデザインスキルの開発を手助けしてよりユーザーフレンドリーな世界のために、このブログを創設しました。 フォームのどこにエラーメッセージを配置していますか? ユーザーの期待する場所にエラーメッセージが置かれていないと、ユーザーはフォーム入力を完了できなくなってしまうかもしれません。 フォーム入力を間違えたら、ユーザーはそれを修正して送信し直すために、なにが間違っていたのかを理解する必要があります。フォームを完了しようと思っていたとしても、それがあまりにも大変であればユーザーは心変わりしてしまうでしょう。 フォームの上か、フィールドのインラインか エラーメッセージの配置場所でもっとも一般的なのは、「フォームの上」と、「エラーのあるフィールドのインライン」という2箇所です。どちらの配置場所が、ユーザーにとってより直感的でしょうか? 調査に

    エラーメッセージはフォームのどこに表示するべきか - ポップインサイト
    atomicmap
    atomicmap 2018/08/28
  • ダッシュボードで上手に情報を可視化するためのガイドライン - ポップインサイト

    JustinはUsabilityGeekの創始者であり、使いやすい記憶に残るオンライン体験の創出において15年以上もの実績があります。 システムが完全なものになるにつれ、定性的なデータや定量的なデータもまたさまざまな頻度・複雑さでを取得できるようになります。このような状況では、情報の可視化がさらに重要になります。 端的に言うと、情報の可視化(information visualisation)とは、抽象的なデータをユーザーが理解できるように可視化し、さらにデータ間の関係性を理解できるようにすることです。 デザイナーの役割と情報の可視化 デザイナーの役割は、ユーザーにとってわかりやすい方法でデータを表現することです。これには、課題や制約、データを表現するために利用できるスクリーンサイズという制限が伴います。 もしデザイナーがユーザーが理解しやすいデータを作成できないと、ユーザーがデータを利用

    ダッシュボードで上手に情報を可視化するためのガイドライン - ポップインサイト
    atomicmap
    atomicmap 2018/05/09
  • マテリアルデザインの概念を受け継いだ、マテリアルデザインライトとは - ポップインサイト

    JerryはUXPinのコンテンツストラテジストです。過去に、Braftonでのクライアント向けのコンテンツ戦略、広告代理店のDBB San Franciscoでの経験があります。 今年のデザインのトレンドが、マテリアルデザインの表現であることは、間違いありません。 GoogleAndroidをベースにしたデザイン手法であるマテリアルデザインは、当初モバイル端末向けのインターフェイスとしてスタートしました。しかし現在では、デバイスやプラットフォームの境界を越えて使われています。 ここ数年はフラットデザインが最大のトレンドですが、マテリアルデザインはフラットデザインにはできないユーザビリティを高めるための装飾をきちんと加えることができます。フラットデザインのように、視覚的な魅力を重視して装飾をそぎ落とすのではありません。マテリアルデザインの根幹は、ユーザビリティなのです。 マテリアルデザイ

    マテリアルデザインの概念を受け継いだ、マテリアルデザインライトとは - ポップインサイト
    atomicmap
    atomicmap 2017/10/16
  • 相手を説得するときにデザイナーがやってはいけない8つのこと - ポップインサイト

    Paul BoagはUXデザイナーでデジタルトランスフォーメーションのエキスパート。非営利団体がWeb、ソーシャルメディア、モバイルを利用する支援をしている。 私たちは仕事をするために、クライアントとステークホルダーを納得させる必要があります。彼らがいないと、私たちは必要なことをするための承認を得ることができません。しかし、私たちのほとんどは説得するのが驚くほど下手です。よって問題は、私たちがどのように説得に失敗するのか、それについてどのように対処するべきかです。 私は、6月末のオンラインワークショップの準備にあたり、クライアントやステークホルダーとどのように協力して仕事するのかについて、多くのことを考えました。これは、同僚やクライアントから同意を得る方法について4つのパートから説明するものです。 私がこのようなワークショップを開くのは、ほとんどすべての作業において、やる価値があると他人を

    相手を説得するときにデザイナーがやってはいけない8つのこと - ポップインサイト
    atomicmap
    atomicmap 2017/10/03
  • 1