状態か機能かわからないトグルボタンの改善

概要

こういう切替スイッチ、苦手なんですよ‥‥。できれば左のほうに統一してほしい pic.twitter.com/dBlWhVj4Cv

— LV41 (@lV41_) 2017年5月26日

ちょうど2ヶ月ぐらい前に同じことを思い、改善策を考えていたので、現実的で筋が良さそうな2つの案を紹介します。

改善策1 : 機能を表すラベルとその状態を表すトグルボタンのセットにする

ボタンという機能をもちつつも、その表面に状態を表現することが混乱させてしまう原因なので、機能と状態に分離し、各々を明確に表現することで改善します。

改善策2: ツールチップを用いてそのボタンのアクションを明記する

状態は画面を見てわかっていたりするので、本当にユーザーさんが欲しい情報はそのボタンの機能だと考えると、状態は置いといて、マウスホバー時などにツールチップを用いてアクションを明記することで改善します。ホバー状態があるPCの場合に使える技ではありますが。