UI - Yasuhisa Hasegawa (Page 3)

AIの進化から学ぶ会話型UIの課題

UIを考える前に本質を探る人と情報の関係が会話（チャット）のようになることに伴い、コンテンツだけでなく UI デザインも、会話の中でどのように表示すると適切なのか考える必要があります。会話型になる UI デザインについて2年前に記事にしました [http://www.yasuhisa.com/could/article/message-card-ui/]が、今は状況が大きく異なります。自然言語が使えるチャットボット「ELIZA [https://en.wikipedia.org/wiki/ELIZA]」は 1960年代に開発されました。 Facebook Messenger はボットの開発やコンテンツの最適化ができるプラットフォーム [https://messengerplatform.fb.com/]を発表していますし、Slack Bots [https://slack.com/apps/category/At0MQP5BEF-bots] は開発者にとって馴染みの深いものになっています。また、友人のように振る舞うことができる Xiaoice

UI

UIガイドラインから学ぶライティングの基礎

言葉で決まるアプリの印象 2 年前に発表 [http://www.yasuhisa.com/could/article/material-design/] されて以来、細かな更新が続いている Material Design [https://www.google.com/design/]。最近、UI の動きに関するガイドが大幅に改変 [https://www.google.com/design/spec/motion/material-motion.html] されたことで、感覚的なところも共有しやすくなってきました。Android アプリにおける UI デザインの基礎を固める上で、Material Design は非常に参考になりますが、このガイドラインは見た目のことばかり書かれているわけではありません。 Material Design の中には「Writing [https://www.google.com/design/

UI

小さく考えて積み上げるデザイン思考

体験のグラデーションデジタルは 0 と 1 で構成された世界であることから、すべてを正確に決めることができるように見えます。しかし、実際のところ紙のデザインに比べてはるかに流動的で予測が難しかったりします。グラフィックツールでつくった世界がそのままの形で再現されることはまずありませんし、利用者の環境によって見た目を変わることもあります。昔からすべてのブラウザで Web サイトの見た目をまったく同じにすることはできない [http://dowebsitesneedtolookexactlythesameineverybrowser.com/] と言われていますし、スクリーンサイズや OS のバージョンが多彩なスマートデバイスでも同様のことがいえます。しかし、見た目を同じにすることはできないからといって、ビジュアルデザインを諦めるという意味ではありません。Web やアプリをはじめとしたデジタルプロダクトのデザインで難しいのは、何をどこまでをデザインによってコントロールするのかを考えることです。デザインのコントロールをブラウザが ECMAScript や CSS をはじめとした

UI

プロトタイプに発生する溝と対処法

完成品になれない溝をどう埋めるあたかも完成品に見えてしまうデザインカンプには、様々な暗黙の了解が存在します [http://www.yasuhisa.com/could/article/web-designer-next/]。グラフィックツールで Web ブラウザ上での見た目を再現しようとしても、実際 HTML / CSS で組まれたデザインの見た目と同じになることはありません。どこまで静止画を作り込んでも、実際の完成品には成り得ない大きな溝が存在します。この溝が大きな誤解に繋がることがあります。例えばレスポンシブ Web デザインの場合、幾つかの大きさで静止画のデザインを用意したとしても、その間（可変状態）でどうなるか想像するのが難しい場合があります。また、レスポンシブ Web サイトにおける表現は多彩になってきています。要素の順番を Flexbox で変えることもできますし、画像の配置の仕方もより柔軟で表現豊かになってきています。知識や経験がある方であれば静止画では表現されていない「実はこうなる」という部分を踏まえてデザインを見ることができますが、誰でもできることではあり

UI

すべてがUIになるVRの世界

先日、報道を VR で楽しむ NYT VR [http://www.nytimes.com/newsgraphics/2015/nytvr/] を試してみました。VR はゲームをはじめとしたエンターテイメント性の高い分野で注目されていましたが、 NYT VR はジャーナリズムからのアプローチだったので新鮮でした。これは仮想空間だと分かっていても、次第に世界に没頭してしまい、現実と仮想の境目が曖昧になる感覚は VR 体験ならではです。スマートウォッチをはじめとしたウェアラブルや IoT の登場によって、従来のような GUI を前提としたインタラクションデザインではなく、No GUI のデザイン [http://www.yasuhisa.com/could/article/designer-should-use-wearable-now/] が注目され始めています。すべてをボタンのような操作 UI で表現するのではなく、音声、触感、行動でインプット・アウトプットすることがありえます。しかし、VR

UI

大きいスクリーンのタッチデザインを考える

タッチは大前提発表後、発売を待たずに売れ切れ状態になった Surface Book [http://www.gizmodo.jp/2015/10/surface_book_sold_out.html]。ノートパソコン並みの大きさを誇る iPad Pro [http://www.apple.com/jp/ipad-pro/] 。それぞれコンセプトが異なる製品ですが、スクリーンサイズが従来のタブレットの域を超えたものが注目されているのは、デスクトップパソコン以外で本格的な作業をしたいというニーズが高まりつつあるからでしょう。 Adobe のコアアプリも Windows 向けにタッチフレンドリー [http://www.engadget.com/2015/10/05/adobe-touch-friendly-design-apps/] に改良が加えられています。 Windows だけでなく、Linux 製の Gnome [https://www.gnome.org/

UI

スマートウォッチで加速する瞬間の体験デザイン

先日からソニーの SmartWatch 3 [http://www.sonymobile.co.jp/product/smartwear/swr50/] を使い始めました。以前から Fitbit [http://www.fitbit.com/jp] のような運動に最適なウェアラブルは使っていましたが、スマートウォッチと呼べるものは初めての使用になります。店頭で触ったり、動画を見るだけでは理解できないことが分かって勉強になります。今回はスマートウォッチの利用を通して感じた、デザインの課題を 2 点紹介します。 Web != Webブラウザスマートウォッチのような小さなスクリーンで Web を見るのは非常に困難です。一応、Androidアプリ [https://play.google.com/store/apps/details?id=se.vaggan.webbrowser&hl=en] がありますし、Samsung

UI

2015年以降のUIデザイン展望

消えるハードとソフトの境界線 Apple Watch のドキュメンテーション [https://developer.apple.com/library/prerelease/ios/documentation/UserExperience/Conceptual/WatchHumanInterfaceGuidelines/] には、以下のような言葉がデザインコンセプトとして記載されています。 > Even the physical border of the Retina display has been considered, resulting in edge-to-edge UI design that effectively renders that border invisible. Thoughtful app design should contribute to this experience of hardware

UI

正しくKeynoteでプロトタイプを作るコツ

09より最新版を ChatWorkの社内勉強会 [http://c-note.chatwork.com/post/93858598435/keynote]で、Keynote [https://www.apple.com/jp/mac/keynote/] をプロトタイプ制作に使う方法を共有したことがあります。コード不要な点と、共有が比較的しやすいのでオススメしています。しかし、他のプロトタイプツールと同様、得意・不得意をしっかり理解していないと時間がかかるだけで無意味な作業になることがあります。古くから Keynote を使っている方は Keynote 09 を好む方がいます。最新版に比べて UI が分かりやすく分類されていたり、AppleScript のサポートが充実していることから、今でも使っている方がいると思います（私も講演時は 09 を使うことがあります）。ただ、プロトタイプを作る際は必ず最新版を使うようにしています。最新版のほうが優れているのは以下の4点です。 0.01秒単位で微調整が可能 Keynote 09 では、スライドショーを再生しなければアニメーションを見