アクションを促すデザイン（押す／引く4）：猫でもできるグラフィックデザイン63
アクションを促すためのデザインのうち、「押す」と「引く」についてみています。押すと引くは相互に互換することが可能なアクションでした。画面上では押すアクションと引くアクションを使い、他のいろいろなアクションを擬似的に再現しています。
前回説明したように、押すアクションと引くアクションとは同時に使われることが少なく、それぞれ押すことだけでオン／オフを、また引くことだけでオン／オフを切り替えるスイッチとして用いられています。このように同じアクションで状態の切り替わるスイッチを「トグルスイッチ」と呼びます。トグルスイッチは、本来はレバー状のスイッチを上下、または左右に切り替えることでオンとオフを切り替えられるスイッチのことですが、IT用語としてはもう少し広義で取り扱われます。
トグルスイッチは操作がわかりやすく、シンプルなのが長所です。身近にもたくさんあるスイッチなので、画面上でも頻繁に用いられます。また、設置する際の面積が少ないのも大きなメリットです。ON用のスイッチ、OFF用のスイッチと二つ並べたものに比べると、面積は半分で済みます。
一方で、現在の状態がわかりにくいというデメリットもあります。これを解決するために、物理スイッチではボタンの飛び出し具合をオン状態とオフ状態とで変えたり、スイッチの周辺に状態を明示したりします。また、ボタン内に光源を仕込んで点灯させることでオンやオフを示すこともあるでしょう。
画面上でのトグルスイッチでも、同様のデザイン的工夫がなされます。トグルスイッチを一番良く見るのはスマホの設定画面でしょうか。オーバル（厳密には角丸長方形）型の枠と同じ径の円を組み合わせて、タップ毎にオンとオフを入れ替えます。画面上では物理的スイッチよりもさらに「変更した感」が少ないので、枠内を明るくしたり振動したりして状態が変わったことを示します。
また、PCの「メニュー」もよくみるトグル操作といえるでしょう。メニューは普段は折りたたまれていますが、クリックすると中身が展開されてより詳細な操作の一覧を見ることができます。
画面上のトグルスイッチはいずれも「押す」操作だけで利用できますので、初見でもみつけやすく、同じ操作で取り消しもできますので、ユーザーが安心して使うことができます。また、多くのユーザーが親しんでいるインターフェースなので、それがトグルスイッチであることをきちんと示すことができれば積極的に使っても問題のないUIのひとつです。