正しく使えてる？ チェックボックスとスイッチの使い分け
下の図のフォークを見て、それがサラダ用なのか、メイン用なのか見分けるのは簡単ではありません。形状も用途も同じものだからです。両方とも食べ物を突き刺すための、尖った部分をもつ道具ですが、それぞれコースの異なる料理用にデザインされています。 用途は同じでも異なる目的に設計されている Webデザインの世界でも、スイッチとチェックボックスを扱う際に、フォークと同様の混乱が起こります。どちらを使用するべきか、あまり大きく考えていないデザイナーの方が多いですが、適当に使用すると、ユーザーを混乱させてしまいます。フォークの例のように、異なるコンテキスト（文脈）に対して、UIを使い分ける必要があります。 スイッチとチェックボックスは、ともに設定を適用する際に使われますが、ユーザーが期待する適用のタイミングがそれぞれ違います。 正しい条件下においてUIを使い分けることにより、直感的にどうするべきか見分けられ
状態か機能かわからないトグルボタンの改善 - Qiita
概要 こういう切替スイッチ、苦手なんですよ‥‥。できれば左のほうに統一してほしい pic.twitter.com/dBlWhVj4Cv — LV41 (@lV41_) 2017年5月26日 ちょうど2ヶ月ぐらい前に同じことを思い、改善策を考えていたので、現実的で筋が良さそうな2つの案を紹介します。 改善策1 : 機能を表すラベルとその状態を表すトグルボタンのセットにする ボタンという機能をもちつつも、その表面に状態を表現することが混乱させてしまう原因なので、機能と状態に分離し、各々を明確に表現することで改善します。 改善策2: ツールチップを用いてそのボタンのアクションを明記する 状態は画面を見てわかっていたりするので、本当にユーザーさんが欲しい情報はそのボタンの機能だと考えると、状態は置いといて、マウスホバー時などにツールチップを用いてアクションを明記することで改善します。ホバー状態があ
UXの最適化には欠かせない！チェックボックスとトグルスイッチの役割と使い方のコツ
フォームの作成において、デザイナーはいくつものデザイン候補から最適なものを選ぶ必要に迫られます。ユーザーにとって自然なものを選ぶのが定石ですが、あまり認識されていない注意点もあります。今回は特にチェックボックスとトグルに注目し、最適なデザインの作り方を見ていきましょう。 まずは基本的な機能と役割をおさらいしましょう。チェックボックスはユーザーに任意の数だけ選択をしてもらう場合に使います。ゼロ、1個、2個以上など選択する個数はどれでも構いません。チェックボックスは他のものと混ざらないようにし、1つをチェックしても他のボックスの選択が外れないようにします。 トグルスイッチは実際のスイッチを模した形で、ユーザーにオンもしくはオフを切り替えてもらいます。 チェックボックスとトグルスイッチの使い方 1.基本の見た目は変えない（チェックボックス・トグルスイッチ） チェックボックスは小さな正方形で、選択
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
