これは2020年8月14日開催、10人規模くらいの小さなライトニングトークイベントで発表したものです(配布版としてじゃっかん再構成しています)。アクセシビリティの実装に通じる界面にまつわる雑多なトピックを、僕なりの解釈でゆるくお話するものです。
界面よもやま話── アクセシビリティの実装を解釈する趣味の世界ライトニングトーク2020年8月14日森田 雄株式会社ツルカメ 代表取締役社長インフォメーション・アーキテクト/UXデザイナー
View Slide
お前は誰だ。そしてお前の趣味は何だ。• 株式会社ツルカメ代表取締役社長にして株式会社ネコメシ代表取締役CEO、そして株式会社草冠CXOの森田雄です。IAおよびUXデザインの専門家を名乗っております。• Webにまつわる「ものづくり活動」がそもそも趣味ですが、趣味というにはちょっと業務に足を突っ込みすぎています。• しかしながら、特に「アクセシビリティ」の領域は完全に趣味だといえます。• 趣味で、25年以上やっています。• もちろん、業務でアクセシビリティをやることもあります/ました。• 本日は、アクセシビリティに通じる界面の話を、僕なりの解釈でお話しようと思います。2020/8/14 界面よもやま話 2※スライド内で使用している写真・スクショは自分で撮影したものです(いらすとやを除く)。表紙はパワポの素材です。
界面とは何か• 何かと何かの境目のことを界面といい、コンピュータサイエンスの領域では「インターフェース」ともいいます。• 界面がいかにも界面っぽくなるためには、異なる相(そう)同士の境目であることが必要です。• 界面の代表格は「ユーザーインターフェース」です。コンピュータとそれを利用する人間が情報をやりとりする(ないし操作する)際の界面を意味していて、情報を得ようとする意思がこの界面を通過してフィードバックを得ることを「インタラクション」といいます。じゃっかん鶏卵ですが、インタラクションが発生しうるコンテクストに応じて界面が発現するため、概念的には界面はレイヤーがごとく幾重にも折り重なっているといえます。2020/8/14 界面よもやま話 3
折り重なる界面レイヤー(概念)人間2020/8/14 界面よもやま話 4
折り重なる界面レイヤー(概念)人間【マウスやキーボード等】人間とコンピュータの界面2020/8/14 界面よもやま話 5
折り重なる界面レイヤー(概念)人間【マウスやキーボード等】人間とコンピュータの界面【OSやブラウザ等】ユーザ(サイバー空間における人間)とデータの界面2020/8/14 界面よもやま話 6
折り重なる界面レイヤー(概念)人間【マウスやキーボード等】人間とコンピュータの界面【OSやブラウザ等】ユーザ(サイバー空間における人間)とデータの界面【コンテンツないしデータ等】振る舞いの代行者(マウスカーソルやフォーカス)とHTML要素(情報のモジュール)の界面2020/8/14 界面よもやま話 7
折り重なる界面レイヤー(概念)人間人間が得ようとしているなにがしかのオブジェクト(情報であったり、操作そのものであったり)【マウスやキーボード等】人間とコンピュータの界面【OSやブラウザ等】ユーザ(サイバー空間における人間)とデータの界面【コンテンツないしデータ等】振る舞いの代行者(マウスカーソルやフォーカス)とHTML要素(情報のモジュール)の界面2020/8/14 界面よもやま話 8
アクセシビリティはすべての界面に宿る• ユーザビリティを「使いやすさの度合い」というのに対して、アクセシビリティは「近づきやすさの度合い」などといわれます。• 折り重なる界面レイヤーを極限まで薄くし、人間が得ようとするなにがしかのオブジェクトに対して、いかに容易に到達させるかということを「アクセシビリティを実装する」といいます。• 人間は界面を障壁として認識するのではありません。アクセシビリティが宿った界面は、それ自体が道具であり、また人間自身の代行者でもあります。2020/8/14 界面よもやま話 9
世の中には、自分が馬鹿になったのではないかと錯覚するオブジェクトが無数にあります。• そうしたオブジェクトと人間の境目には「クソUI」という界面があります。• 本日はライトニングトークということで、そうしたクソUIを界面レイヤーの解釈で解きほぐし、つくってしまったデザイナーのつもりになって自戒していきたいと思います。• ちなみに、人間は生きているだけで、無数のクソUIに遭遇しますので、そのたびに自戒して改善案を講じるのは、効率のいいトレーニングです。• なお、界面を薄くすることがアクセシビリティの勘所なので、それを阻害するデザインは何であれアクセシビリティ品質の低下につながります。ユーザビリティの問題でもUXデザインの問題でもマーケティングの問題でも、何でもです。• 非webにおけるクソUIも、転じてwebに生かせることが多々ありますので良い教訓になります。2020/8/14 界面よもやま話 10
洗浄便器の操作パネル(1)2020/8/14 界面よもやま話 11
洗浄便器の操作パネル(1)2020/8/14 界面よもやま話 12「小」と「eco小」で迷わせる意味がわからない。もし「eco小」で流れなかったら小より非ecoになる。
2020/8/14 界面よもやま話 13洗浄便器の操作パネル(2)
2020/8/14 界面よもやま話 14洗浄便器の操作パネル(2)「快便」って何だ?出ない時に使うボタン?というかアイコン小便だろこれ。「Kids」キッズ自身に読めないラベルなぜつけた
洗浄便器そのもの(蓋閉じ時)2020/8/14 界面よもやま話 15
洗浄便器そのもの(蓋閉じ時)2020/8/14 界面よもやま話 16うん、パンダだな
洗浄便器そのもの(蓋開き時)2020/8/14 界面よもやま話 17
洗浄便器そのもの(蓋開き時)2020/8/14 界面よもやま話 18座ってるパンダだけでいいだろなぜ正面を繰り返す
トイレ使用後の注意文2020/8/14 界面よもやま話 19
トイレ使用後の注意文2020/8/14 界面よもやま話 20いまどきのトイレはえてして、立ち上がると自動洗浄になるので間に合わない。使ったことないやつが注意書きするな。
トイレ使用に関する注意文2020/8/14 界面よもやま話 21
トイレ使用に関する注意文2020/8/14 界面よもやま話 22駅長かと思ったら便器そのものちなみにこれは別にクソUIではない(便所におけるUIではあるが)
2020/8/14 界面よもやま話 23洗濯機の操作パネル
2020/8/14 界面よもやま話 24洗濯機の操作パネル「これっきりボタン」説明書を読まないとわからないラベルをつけるな。必要かこれ?こんなラベルつける暇あったら隣の鍵アイコンのところに「ロック」って書け
2020/8/14 界面よもやま話 25スライサーの厚さ調節レバー
2020/8/14 界面よもやま話 26スライサーの厚さ調節レバーこれは際どい。そこまでクソでもないが、説明書を見なくてもわかるようにするべきだろう
2020/8/14 界面よもやま話 27スライサーの厚さ調節レバーの説明書
2020/8/14 界面よもやま話 28スライサーの厚さ調節レバーの説明書この説明書は、スライサーのパッケージの裏面である。100%捨てられる。番号は1・2・5のほうが良かったのでは?
2020/8/14 界面よもやま話 29リモコン(TV会議システム)
2020/8/14 界面よもやま話 30リモコン(TV会議システム)シールですでに押してるだろ…
2020/8/14 界面よもやま話 31リモコン(エアコン)
2020/8/14 界面よもやま話 32リモコン(エアコン)除湿切替?冷房や暖房は切替ではない?内部クリーン?電流カット?不在ECO?
2020/8/14 界面よもやま話 33壁据え付けのエアコンスイッチ
2020/8/14 界面よもやま話 34壁据え付けのエアコンスイッチツマミを強にしている時、最強を発動可能
照明のスイッチ2020/8/14 界面よもやま話 35
照明のスイッチ2020/8/14 界面よもやま話 36方角は不変なので間違いないといえば間違いないが…
映画の券売機2020/8/14 界面よもやま話 37
映画の券売機2020/8/14 界面よもやま話 38購入番号の黄色い欄がフォーカス。なぜフォーカス移動は上下ボタン?これタッチパネルなのに。
駐車料金の精算機2020/8/14 界面よもやま話 39
駐車料金の精算機2020/8/14 界面よもやま話 40挿入例、虚無に挿入してるだろ
駐車料金の看板2020/8/14 界面よもやま話 41
駐車料金の看板2020/8/14 界面よもやま話 42高すぎるもはや罠である
ビジネスホテル2020/8/14 界面よもやま話 43
ビジネスホテル2020/8/14 界面よもやま話 44デスクのほとんどを電子レンジが占めている。電子レンジとの対話。
不法侵入禁止の看板2020/8/14 界面よもやま話 45
不法侵入禁止の看板2020/8/14 界面よもやま話 46合いの手?
紙ゴミの捨て方2020/8/14 界面よもやま話 47
紙ゴミの捨て方2020/8/14 界面よもやま話 48難易度が高すぎる。もはや紙を捨てるのはあきらめたほうがいい。この紙も捨てられない。
東京水道局のパスワード再発行フロー(1)2020/8/14 界面よもやま話 49
東京水道局のパスワード再発行フロー(1)2020/8/14 界面よもやま話 50転居の際に住所変更しようとしたらログインできなかったのでパスワード再発行を申請したところハ、ハガキ……?しかも審査終了後って
東京水道局のパスワード再発行フロー(2)2020/8/14 界面よもやま話 51
東京水道局のパスワード再発行フロー(2)2020/8/14 界面よもやま話 52するとハガキの前にメールが届くそうなんだ。てか500日くらい余裕だろ。勝手に退会させるな。仕方ないので新規作成することに
東京水道局のパスワード再発行フロー(3)2020/8/14 界面よもやま話 53
東京水道局のパスワード再発行フロー(3)2020/8/14 界面よもやま話 54けっきょくハガキ金の無駄遣いでは?(むしろ脆弱性な気も)
くらしTEPCOの「秘密の質問」の設定2020/8/14 界面よもやま話 55
くらしTEPCOの「秘密の質問」の設定2020/8/14 界面よもやま話 56ここまでやるなら、出身地と行ってみたい場所もお名前にしてほしかった
まとめ• 僕はクソUIを見るたびに、自分の仕事ではすべての界面レイヤーを極限まで薄くして、アクセシビリティを高めたいっていう気持ちが高まります。• もちろん僕にできることは限られるので、せめてwebのアクセシビリティだけでもどうにかしたいということになります。• 最後に、本LTをご覧いただいた皆さんへの有益なお土産として、イケてる書籍を紹介します。アクセシビリティにド直球な書籍は「アクセシビリティ」で検索すれば出てきますので、そうじゃなくて、しかもどっちかっつーと古典的な名著です。2020/8/14 界面よもやま話 57
クソUIとの向き合い方を論じ続けてきた名著3選(1)ユーザーインターフェイスデザイン―Windows95時代のソフトウェアデザインを考える (Programmer’s SELECTION)https://www.amazon.co.jp/dp/4881353683/1996/5/1アラン クーパー (著)2020/8/14 界面よもやま話 58
クソUIとの向き合い方を論じ続けてきた名著3選(1)ユーザーインターフェイスデザイン―Windows95時代のソフトウェアデザインを考える (Programmer’s SELECTION)https://www.amazon.co.jp/dp/4881353683/1996/5/1アラン クーパー (著)てか売ってない入手困難すぎる僕は今までに5冊は買ってる2020/8/14 界面よもやま話 59
クソUIとの向き合い方を論じ続けてきた名著3選(2)コンピュータは、むずかしすぎて使えない!https://www.amazon.co.jp/dp/488135826X/2000/2/1アラン クーパー (著)2020/8/14 界面よもやま話 60
クソUIとの向き合い方を論じ続けてきた名著3選(2)コンピュータは、むずかしすぎて使えない!https://www.amazon.co.jp/dp/488135826X/2000/2/1アラン クーパー (著)Amazonで中古1700円前後価値が見出されていない買うなら今だ2020/8/14 界面よもやま話 61
クソUIとの向き合い方を論じ続けてきた名著3選(3)About Face 3インタラクションデザインの極意https://www.amazon.co.jp/dp/4048672452/2008/7/22アラン クーパー (著)2020/8/14 界面よもやま話 62
クソUIとの向き合い方を論じ続けてきた名著3選(3)About Face 3インタラクションデザインの極意https://www.amazon.co.jp/dp/4048672452/2008/7/22アラン クーパー (著)Amazonで中古で29,850円値段が高騰しすぎさすがに買わなくていい2020/8/14 界面よもやま話 63
おしまい2020/8/14 界面よもやま話 64
おしまい2020/8/14 界面よもやま話 65ちなみに名著3選は3冊ともだいたい同じことが書いてあるので、とりあえず「コンピュータはむずかしすぎて使えない」を買おう!