キャンセルのキャンセル問題から考えるダイアログデザイン｜Goodpatch Blog グッドパッチブログ
この文脈では、「編集内容のキャンセル」という処理を続行しても良いかをユーザーに確認しています。続行に同意したい多くのユーザーは直感的に同じ表記の「キャンセル」を押したくなるでしょう。しかしそれでは編集のキャンセルが実行されません。 このキャンセルボタンが意味するのは、「『編集内容をキャンセルする』のキャンセル」なのです。つまり、ユーザーが望み通りに編集内容を破棄するためには、反対側のOKボタンを選ぶべきなのです。このような「キャンセルのキャンセル」は二重否定で意味がややこしくなるので避けなければなりません。 ここで「キャンセルのキャンセル」にならなければ良いということで、次のようにボタン名を変えてみました。 これでもう迷うことは無くなりましたか……？ 私はこの修正は誤りだと判断します。「はい」「いいえ」は結果を予想しにくい表現なので、ダイアログのアクションボタンに用いることはあまり適切では
優れたボタンデザインのための７つのガイドライン
Nickはロシアのセントピーターズバーグ出身のソフトウェアデベロッパー/ブロガーです。彼による他の記事はこちらをご参照ください。 ボタンはインタラクションデザインに欠かせない要素です。ユーザーとシステムの意思伝達において大切な役割を担っています。この記事では、効果的なボタンを作成する際に知っておくべき７つの基本原則について説明します。 １. ボタンをボタンらしく見せる UIを操作するとき、ユーザーは「クリックできる」ものとそうでないものを即座に知る必要があります。ユーザーは、デザインされたすべてのアイテムを解読しなければなりません。そのため一般的に、ユーザーがUIを解読するのに必要な時間が長くなればなるほど、ユーザーにとって使いにくくなります。 しかし、ユーザーはどのようにして要素がインタラクティブかどうかを判断するのでしょうか？ UIのオブジェクトを理解するために、ユーザーはこれまでの経
正しく使えてる？ チェックボックスとスイッチの使い分け
下の図のフォークを見て、それがサラダ用なのか、メイン用なのか見分けるのは簡単ではありません。形状も用途も同じものだからです。両方とも食べ物を突き刺すための、尖った部分をもつ道具ですが、それぞれコースの異なる料理用にデザインされています。 用途は同じでも異なる目的に設計されている Webデザインの世界でも、スイッチとチェックボックスを扱う際に、フォークと同様の混乱が起こります。どちらを使用するべきか、あまり大きく考えていないデザイナーの方が多いですが、適当に使用すると、ユーザーを混乱させてしまいます。フォークの例のように、異なるコンテキスト（文脈）に対して、UIを使い分ける必要があります。 スイッチとチェックボックスは、ともに設定を適用する際に使われますが、ユーザーが期待する適用のタイミングがそれぞれ違います。 正しい条件下においてUIを使い分けることにより、直感的にどうするべきか見分けられ
状態か機能かわからないトグルボタンの改善 - Qiita
概要 こういう切替スイッチ、苦手なんですよ‥‥。できれば左のほうに統一してほしい pic.twitter.com/dBlWhVj4Cv — LV41 (@lV41_) 2017年5月26日 ちょうど2ヶ月ぐらい前に同じことを思い、改善策を考えていたので、現実的で筋が良さそうな2つの案を紹介します。 改善策1 : 機能を表すラベルとその状態を表すトグルボタンのセットにする ボタンという機能をもちつつも、その表面に状態を表現することが混乱させてしまう原因なので、機能と状態に分離し、各々を明確に表現することで改善します。 改善策2: ツールチップを用いてそのボタンのアクションを明記する 状態は画面を見てわかっていたりするので、本当にユーザーさんが欲しい情報はそのボタンの機能だと考えると、状態は置いといて、マウスホバー時などにツールチップを用いてアクションを明記することで改善します。ホバー状態があ
デザイナーに知っておいてほしいリストUIの基本 - UXエンジニアになりたい人のブログ
当たり前の基本的な話だけ。 リストUIの話。なんらかの「物」を一覧して選ばせたり操作させたりする、あのUI。結論から言うと、リストUIは基本的に、というか、構造としてはほぼ100%この形になる。 解説を組み入れると、こう。 1. 一つの「物」に対する操作実行UI すでに存在する「物」に対する操作を実行するためのUI。厳密に言うと「着目」「処理」「処理へのショートカット」の3種類がある。 1−1.「物」への着目実行UI もっとも代表的な操作例は「編集」または「表示」 一般的には、このUIを実行するとその「物」を1つだけ表示した画面に遷移する（詳細確認画面とか情報入力画面とかそういうの） タップ、HTMLリンク、ダブルクリックなど対象のプラットフォームにおける「選択」に対応する操作体系を割り当てるのが一般的。 1−2. 「物」に対する処理操作実行UI もっとも代表的な操作例は「削除」 ここにど
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
