55. トグルボタンの優位性 ケーススタディ
検討3: <input> 要素の見た目・挙動の決め方は?
Thomas S. Tullis, et al, 2007 What's the Most Effective Way to Present Two-State Toggle Buttons?
左記デザインの
優位性を検討
56. 検証実験 - メニュー内容の妥当性 ケーススタディ
実験内容
Thomas S. Tullis, et al, 2007 What's the Most Effective Way to Present Two-State Toggle Buttons?
被験者 371 名
1. ON/OFF どちらも選択されていない状態で表示
指定した選択肢を選んでもらう
2. ON/OFF どちらかが選択されている状態で表示
選択を切り替えてもらう
どちらも3秒以内に選択
57. 選択の正確さ - パフォーマンスメトリクス ケーススタディ
Thomas S. Tullis, et al, 2007 What's the Most Effective Way to Present Two-State Toggle Buttons?
Design 4, 15, 16 だけが著しく低い
58. 選択までの速さ - パフォーマンスメトリクス ケーススタディ
Thomas S. Tullis, et al, 2007 What's the Most Effective Way to Present Two-State Toggle Buttons?
Design 4, 12, 15, 16 がやや遅い
59. トグルボタンの好み - 自己申告メトリクス (自由問いかけ) ケーススタディ
Thomas S. Tullis, et al, 2007 What's the Most Effective Way to Present Two-State Toggle Buttons?
Design 6, 7 が人気
60. 総合評価 - トグルボタンの優位性 ケーススタディ
Thomas S. Tullis, et al, 2007 What's the Most Effective Way to Present Two-State Toggle Buttons?
Design 6, 7 が高得点
61. 総合評価 - トグルボタンの優位性 ケーススタディ
Thomas S. Tullis, et al, 2007 What's the Most Effective Way to Present Two-State Toggle Buttons?
Design 6, 7 が高得点
面白いことに Design 7 はブラウザ標準のラジオボタン。
古くから使われてきて使い慣れているのか、完成されたデザインだったかはわからないけれど
15種の中で最も正確性が高く、時間がかからず、見た目も好まれるデザインのひとつであることは間違いない