1.0UX TIMEShttps://uxdaystokyo.com/articles菊池 聡https://uxdaystokyo.com/articles/author/satoshi-kikuchi/rich600338<blockquote class="wp-embedded-content" data-secret="F4LlYlTbcv"><a href="https://uxdaystokyo.com/articles/vertical_surface_corners/">新しい概念: 目線に垂直な面の角度</a></blockquote><iframe sandbox="allow-scripts" security="restricted" src="https://uxdaystokyo.com/articles/vertical_surface_corners/embed/#?secret=F4LlYlTbcv" width="600" height="338" title="“新しい概念: 目線に垂直な面の角度” — UX TIMES" data-secret="F4LlYlTbcv" frameborder="0" marginwidth="0" marginheight="0" scrolling="no" class="wp-embedded-content"></iframe><script> /*! This file is auto-generated */ !function(d,l){"use strict";l.querySelector&&d.addEventListener&&"undefined"!=typeof URL&&(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&&!/[^a-zA-Z0-9]/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret="'+t.secret+'"]'),o=l.querySelectorAll('blockquote[data-secret="'+t.secret+'"]'),c=new RegExp("^https?:$","i"),i=0;i<o.length;i++)o[i].style.display="none";for(i=0;i<a.length;i++)s=a[i],e.source===s.contentWindow&&(s.removeAttribute("style"),"height"===t.message?(1e3<(r=parseInt(t.value,10))?r=1e3:~~r<200&&(r=200),s.height=r):"link"===t.message&&(r=new URL(s.getAttribute("src")),n=new URL(t.value),c.test(n.protocol))&&n.host===r.host&&l.activeElement===s&&(d.top.location.href=t.value))}},d.addEventListener("message",d.wp.receiveEmbedMessage,!1),l.addEventListener("DOMContentLoaded",function(){for(var e,t,s=l.querySelectorAll("iframe.wp-embedded-content"),r=0;r<s.length;r++)(t=(e=s[r]).getAttribute("data-secret"))||(t=Math.random().toString(36).substring(2,12),e.src+="#?secret="+t,e.setAttribute("data-secret",t)),e.contentWindow.postMessage({message:"ready",secret:t},"*")},!1)))}(window,document); //# sourceURL=https://uxdaystokyo.com/articles/wp-includes/js/wp-embed.min.js </script> https://uxdaystokyo.com/articles/wp-content/uploads/2016/04/image05.png545253最近、映画「アイアンマン」に登場するHUD（ヘッドアップディスプレイ）(※訳注1)を分析している際に、「アイアンマン3」のUIにおいてあることに気付きました。作品を批評するために、新しいコンセプトや概念について議論が必要なのです。この気付き自体は些細なもので、とりたてて記事にするほどでもないことですが、概念として興味深いものなので、どうかお付き合いください。 ※訳注1 視野上に情報が重なって表示されるもの。透過していることが多く、視界を遮らない。 映画では、AI(人工知能)アシスタントJARVIS（ジャービス）がHUDを起動させると、頭を取り囲む透明な球体上にUI要素が現れます。（要素が複数ある場合には、同心円状に重なって表示されます。）次のスクリーンショットでの左上にペッパーが映っている画面が、それをよく示しています。長方形の動画ディスプレイですが、見たところ球面に沿って、すこし弓なりに湾曲しているようです。 この画像をご覧ください 自らを取り囲む球体上に画像が表示されるので、トニーにとって都合がいい仕組みです。情報が常に目前にあり、いつでも確認できるからです。たとえば、ここに画像内に表示されているペッパー・ポッツの画面は、彼の目線上に垂直に置かれた面に印刷されているかのようで、とても見やすい。（これは以前書いた焦点距離の問題に関する記事と矛盾するのですが、実際の程は、ウィム・ウォーターズ氏がOculas Lift（オキュラスリフト）を用いてHUDを実現してみるまでは分かりません。一旦そのことは忘れて、今回の新たな気付きに話を戻しましょう。）(※訳注2） ※訳注2 Oculas LiftはHMD（ヘッドマウントディスプレイ）。HMDは視界を遮るが、これを用いると擬似的にHUDのような体験をもたらすことが可能。 そこで、2DのUI要素が視界を取り囲む球体上に表示されることが視覚的に適しているのだとすれば、どうしてこれらの要素が垂直にではなく、傾いているのでしょう？これは友人であるトニー・スターク本人に話を聞いてみたいですね。なんといっても私たちは「アイアンマン3」でそれを目にしただけであり、第三者の意見だけでなく体験した本人の意見が知りたいのです。見た目上は悪くないようですけれど。 先に述べたとおり、これらの例は悪くなさそうです。とはいえ、人々が誤ってこれを濫用すると、UIパターンはひどいものになりかねません。正確を期すために、わたしたちは「目線に垂直な面の角度」について議論しなくてはなりません。それにしても「目線に垂直な面の角度」とはあまりにも長ったらしい表現です。 これをひと言で表わす言葉を見つけようと、私はSNS上で意見を募りました。最初に多くの人々が、「矢状面 (sagittal)」や「尾側 (caudal)」といった解剖学における方向の表現を提案してくれました。しかしそのように考えたなら、それが生物の身体においてのみ適用される表現であることを忘れてはなりません。顔面の前方に冠状 (coronal) に表示されるUI要素は、顔の前方にあれば見ることができます。しかし耳の近くまで位置をずらした場合、完全に読めなくなってしまいます。なんといっても、鼻の辺りまで要素をずらしただけで、耳までずらした場合同様に読むことができないのです。 最終的に私は、「目線に垂直な面の角度」を表現するぴったりな形容詞を見つけました。インダストリアル・デザイナーのアビナブ・ダプキ氏が提案してくれた「縦方向の (lengthwise)」です。それは慣れ親しんだ言葉で、非常にイメージしやすいものです。そして同じく既知の単語から、左右への傾きを「端方向の (edgewise)」と呼ぶことにしました。（完璧を期すなら、「垂直な面の角度」を単に回転 (rotation) と呼んでもいいでしょう。） けれども「向きあった (facing)」の対義語はとなると、SNS上の不特定多数のみなさんからは何も提案が上がってきませんでした。そこで私は不本意ながら造語して、「向きあっていない (off-facing、off-faced)」と名付けることにしました。どの表現も短く、わかりやすいうえに、他で定義を決められていることもありません。しかも明確にコンセプトを表わしていて、多様な使い方ができます。 これらの表現を使えば、わたしたちは「アイアンマン」における向き合っていない(off-facing)要素や、同じように球状のHUDらの話をすることができます。そしてあまりにひどい場合にはあたかも「ボディ・スナッチャー/恐怖の街」のように指差し、悲鳴を上げる(※訳注3）ことができます。 （※訳注3 名作SF映画のワンシーンをもじったアメリカン・ジョーク） 注意してほしいのは、ここで取り上げている概念は、2DのUI要素に適用される点です。現実に目にするもののほとんどは、私たちの目線にあわせられていなくても、ほとんど問題視されることはありません。「アイアンマン」HUDの中でも、人物に向き合っていない(off-faced)けれど差し支えない要素が多く見受けられます。それはHUDで表示される拡張情報が、可読性ではなく、環境情報の補足だからです。 私がこの概念にこだわるのは、調査上「アイアンマン」のHUDが最も先進的なSFインターフェースの一つであると考えているからです。それは「マイノリティ・レポート」に登場するプリ・クライム（犯罪予防局）スクラブバー(※訳注4)の進化形と言えます。おそらくこのようなインターフェースはもっともっと影響力が高まっていくことでしょう。そしてこれらの新しい表現はSFが続く限り、より便利で必要不可欠なものとなっていくことでしょう。 ※訳注4　画面に表示された要素をジェスチャーで操作するUI。 スクラブバー：マイノリティ・リポート CHRISTOPHER NOESSEL Cooper社のトレーナー／デザイナー Chris Noessel（クリス・ノッセル）は、マーケティングで一般的に利用されている「ペルソナ」を産み出した Alan Cooper（アラン・クーパー） が率いるUXコンサルタントファーム「Cooper（クーパー）」社のUXデザイナー・トレーナーです。