Tagged

デザイン

A collection of 255 posts

サービス

マルチデバイス時代の評価課題と提案

今後はさらに測れない領域が増える 今のところウェアラブルデバイスの通知は賢いとは言えないものの、今後利用者の文脈に応じて柔軟かつタイミングよく送られてくる可能性があります。また、Google の App Indexing [https://developers.google.com/app-indexing/android/app] や、Apple の App Search [http://www.macstories.net/stories/inside-ios-9-search-apples-plan-for-more-connected-apps/] など、アプリとデバイスとの間、アプリとアプリとの間、アプリと Web との間があやふやになっていきます。ウェアラブルやスマートフォンでは、その瞬間に欲しいコンテンツへ直接アクセスするという行動が増えていくでしょう。今までのようにアプリアイコンをタップするだけが接点ではなくなりますし、アプリのトップ画面から見ていく必要もないわけです。 通知が賢くなり、そのとき欲しいコンテンツが届くことは利用者へのメリットは大きいです。しか

ixd

今だから知りたいインタラクションデザインの基礎

再考インタラクションデザイン Project Jacquard [https://www.google.com/atap/project-jacquard/] のような技術を目の当たりにすると、いよいよすべてのモノにコンピューターが入ると実感します。株式会社シロクの石山貴広さんとのポッドキャスト [http://automagic.fm/post/119887435735/t-ishiyama] で、インタラクションデザインを再考するべきではないかという話をしましたが、コンピューターと人間との関係のデザインという 1950 年頃から続く課題がますます重要になると考えています。 もちろん当時に比べて、現在のインタラクションデザインはより複雑なものになっています。コンピューターは複数のサービスとシステムに繋がっていますし、できることも日々増え続けています。人とコンピューターの距離も ウェアラブルの普及 [http://www.yasuhisa.com/could/article/designer-should-use-wearable-now/] によってますます縮んできています。

デザイン

より良いデザイン批評をするための質問

デザイナーや開発者であれば、アプリや Web サイトを見ると何かしらリアクションがあると思います。「かっこいい」「面白い」「使いやすい」といった感想は、口に出さなかったとしても考えることです。第一印象から生まれる感覚は大事ですし、常に身の回りにあるデザインに意識を向けることは良いことです。しかし、そうした感情的なリアクションがデザインに対する良い批評にならないことがあります。 批評やフィードバックは、現行のデザインをさらに良くするために行われます。「これは使いにくい」はひとつの感想ではありますが、次のステップのための道筋とは言えません。それが誰にとって、なぜ使いにくいのかを共有しないままでは意図が伝わっていないようなものです。むしろ、使いにくいものを作ってしまったデザイナー個人への批判に聞こえてしまう恐れもあります。デザイナー自身も、すべてのフィードバックが個人に向けられているものではないことを認識すべきですが、コミュニケーションの工夫が必要です。 デザイン批評 [http://www.yasuhisa.com/could/article/design-ciritique/]

デザイン

デザイナーであればウェアラブルを今持つべき理由

まず体感せよ 一昨年くらいから Jawbone UP [https://jawbone.com/store/buy/up24] や、Android のスマートウォッチ [http://www.sonymobile.co.jp/product/smartwear/swr50/] など、幾つかのウェアラブルを試しています。先月発売された、Apple Watch [http://www.apple.com/jp/watch/] もしばらく使い続けています。「これで生活が変わりました!」と言えるほどの劇的な変化はないものの、発見や気づきがあります。 まだ購入を悩んでいる方がいると思いますが、デザイナーであれば何でも良いのでウェアラブルを今から付けて生活をしたほうが良いと思います。 もちろん今のウェアラブル市場は『幼少期』と同じようなものです。パフォーマンスも良くないですし、デバイスにインストールするアプリも「なぜか分からないけど、違う」という感覚を得ることになるでしょう。スマートフォンと似たような構造や操作感を、スマートウォッチ用に小さくしただけのアプリもたくさんあります。スマートフ

デザイン

デザインプロセスに共通する4つの段階と必要とされる能力

出すことを前提としたプロセス 製品のデザイン戦略を定義し、それを基に調査を実施。そこからプロトタイプを作成、分析・検証というサイクルを繰り返すといったデザインプロセスがあります。こうしたプロセスを早く効率的に行う手法としてリーンやアジャイルがありますが、それがすべての答えではありません。基本を知ることは重要ですが、「プロセスに沿って正しくやろう」「こうするべきだ」と固持しても結果に繋がらないことがあります。 手法と同じくらい重要なのが、組織の文化。どのようなスキルセットをもっているのかはもちろん、働き方、コミュニケーションの仕方が手法の取り入れ方に大きく影響します。「銀の弾丸」とも呼べる無敵の手法はありませんし、組織に合う手法を見つけ出すことが『ひとつの旅』と言えるかもしれません。 それぞれ自分たちに合うプロセスを探すことになるものの、どの場合でも共通していることは幾つかあります。今私が考える共通していることをまとめると上図のようになります。図には大きく 4 つの段階が含まれています。 アウトプット 手描きのスケッチからコードで書かれた動作するものまで、まず何かを作り出す段階

コンテンツ

ユーザーを補助するための「見せる」コンテンツ

語るより見せたほうが早い スマートフォンをはじめとしたタッチデバイスが世の出回って 5 年以上経つわけですが、タッチ & ジェスチャーをどうすれば良いのか分からないことがあります。アプリによって右スワイプというシンプルな動作のフィードバックが異なりますし、特殊なジェスチャーで機能へアクセスできるものもあります。分断化するジェスチャー操作は 随分昔からの課題ですが [http://www.yasuhisa.com/could/article/gesture-ui/]、最近ではユーザーの オンボーディング体験 [https://www.useronboard.com/]を通じて、操作を学習してもらうといった対策がなされているところもあります。 特殊な操作をユーザーに学習してもらうには、どのような表現が適しているのでしょうか。 従来は明確なテキストや、スクリーンショットを通して説明することが多かったですが、最近では動画が使われる機会が増えています。OS X で関心したのが「システム環境設定」のなかにあるトラックパッドの設定画面です。通知センターや、辞書で調べるといった操作をジェスチャー

コンテンツ

コンテンツやデザインに欠かせない価値観を共有するプロセス

利用者中心とは言いますが 自分たちが作りたいものを作るのは身勝手な行動のように見えますが、「自分たち 」という価値(アイデンティティ)が確立されているかされていないかは大きな差があります。価値がないまま、「利用者のため」という考えだけ一人歩きしてしまうと、極度な A/B テストの実践など、数字が高いほうを選択するという製品開発になる可能性があります。 利用者中心のデザインは必要です。しかし、それは土台になる【価値観=ビジョン】があるから成り立つものであり、いきなり利用者中心のデザインプロセスを実践しても意味のないことだと考えています。スタートアップ向けの講座で ビジョンの共有が重要 [http://www.yasuhisa.com/could/article/vision-ux-ui/] だと話したのもそのためです。プロジェクトを始める際は、必ずといっていいほど「我々は何者か」という部分を振り返るようにしています。 付箋には「気分が良い」「落ち着く」といった、感情的なフレーズが含まれることがあります。「◯◯できる」といった機能や「使いやすい」のようなデザインに関わるフレー

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

デザイン

デザインの理解につながる感情のメカニズム

上記は、ドン・ノーマン著「エモーショナル・デザイン―微笑を誘うモノたちのために [https://www.amazon.co.jp/dp/4788509210?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=4788509210&adid=1RPGXGNC0KXVHXZ0HEEE&] 」からの一節。機能的な部分より、感情に響くデザインが、今後の製品・サービスを成功へ導くだろうと説いています。確かにそうだと思いますが、感情という主観的なものを、いかにデザインへ落とし込むのか悩ましいところです。「かっこいい」「美しい」という感情だけで デザインの評価をするのは好ましくない [http://www.yasuhisa.com/could/article/how-we-talk-about-design/

コンテンツ

コンテンツ細分化の前にしておきたい最低限のコト

すぐにはできない細分化 利用者の文脈に合わせてコンテンツを配信するにはコンテンツのスマート化 [http://www.yasuhisa.com/could/article/for-intelligent-content/] は必須です。そのために、ページという概念に囚われないかたちでコンテンツをいかに格納・管理するかが課題になります。Webデザインは枠組みのない世界 [http://www.yasuhisa.com/could/article/wd101-no-edge/] と解説したことがありますが、Webコンテンツにも同様のことが言えるわけです。 コンテンツを細分化することによって、よりきめ細かく文脈に入り込める可能性が広がりますが、実践するのが意外と難しいことがあります。 コンテンツを細分化していくということは、個々のフィールドにどのような形式のデータを入力するのか厳格になります。ルールが必要になるだけでなく、それらを実際入力する手間もかかります。フィールドが増えれば、運営の負荷も少しずつ上がっていきます。運営のことを考えず理想的な細分化を推進しても続かなくなるわけで

デザイン

デザインにおける公平とは

公平と平等はイコールの意味ではない ひとりでデザインするということは、そうはありません。クライアントだけでなく、様々な技能や背景をもった人たちと一緒にデザインを進めることになります。 作業をするのがデザイナーひとりだったとしても、彼等はデザインに対して意見を出してきます。新しい視点を学ぶ機会になるので意見を出し合うことは重要ですが、すべての意見を実践しようとすると、 らくだをデザインする [http://www.yasuhisa.com/could/article/we-just-made-a-camel/] ということになります。デザイン批評 [http://www.yasuhisa.com/could/article/design-talk-feedback/] をする機会がもてない場だと、デザインという行為が少しずつ本来するべきこととは離れたところへ進むことがあります。 誰かと一緒に考えて進める工程はデザイン批評だけに留まらず、プロダクト開発のすべてに言えることです。私は常に公平であること を意識して会話をするようにしています。『公平』という言葉を聞くと、誰もの意見に耳を

デザイン

指標を見つけるための3つの質問

まずビジネスを知る プロには敵わないものの、デザイナー自ら Web 解析をする理由は、Web解析士が見ている部分がデザイナーが見たいデータと異なる場合があるからです。もちろんページビュー、滞在時間、コンバージョン率といった共通する指標項目はありますが、それらの解釈の仕方や、測定したいディメンションが異なる場合があります。利用者がどのような道筋を辿ったのかをデータを見ながら想像することは、デザインのインスピレーションになります。 しかし、問題になるのが何を指標値にすれば良いのかを決めるところです。見ることができるデータは膨大にありますし、マーティングとデザインとで指標にしたいポイントが異なることもあります。また、設計している Web サイトによって指標が変わってきますから「これを見ておけば良い」と言えるようなオールマイティな指標も存在しません。 私の場合、以下のことをクライアントと話したり調査をしながら、今のその企業に必要な指標を探すようにしています。 1. 企業・団体のミッションはなにか?何を目指しているか? 2. Webサイトの目的はなにか? 3. そのサイトを通して

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

デザイン

Year in Review 2014

無言語なものを言語化する 2014年は「デザインの言語化」として重要な年だったと思います。昨年くらいから、ようやくフロントエンド側のスタイルガイド作成 [http://www.yasuhisa.com/could/article/frontend-styleguide/] が注目されたことで、デザインをいかに柔軟で拡張しやすいものを作れば良いのかという話がしやすくなりました。しかし、コードだけでなくビジュアルや感覚のところまで共有するツールを揃えなければ、本当の意味でデザインの拡張性は望めません。 緊急時にデザインが崩れる [http://www.yasuhisa.com/could/article/why-design-goes-wrong/] のは、特定のデザイナー(又は制作会社)にデザインをすべて任せてしまっている可能性があります。これでは、Web サイトはいつまでもチラシのような存在から抜け出すことができませんし、運営という考えも根付かないでしょう。 デザイナーの手を借りなくても、ある一定の水準を保ちながらデザインされたコンテツを出し続けることが運営での大きな課題です。今年は

UX

あなたのUXに必要となる視覚化と批評

ニュアンスを浸透させる2つのフェイズ 昨年の Advent Calendar の記事 [http://www.yasuhisa.com/could/article/mysterious-ux/] でも指摘しましたが、UX は「分かる人には分かる。分かっている人と分かっていると思うことが心地いい」という雰囲気がどことなく感じることがあります。何人かのデザイナーに UX の話を持ちかけても「話しにくい」「避けたい」という声も出てくるわけですから、学びたい人へ向けた UX はこれからなのかもしれません。 しかしながら、私の中で UX を学ぶために必要なのは「利用者体験とは?」ということを探求することではなく、「良い体験」というボヤけたニュアンスをどうしたら相手に伝わるのかを考えることだと思います。そのために ペルソナ [http://www.yasuhisa.com/could/article/whats-important-for-persona/]や カスタマージャーニーマップ [http://www.yasuhisa.com/

デザイン

Webのスーパーヒーローになる方法

撮影:飯田昌之 今年で Web は 25 歳 [http://www.webat25.org/]になりました。 Web は人類に大きな変化をもたらした革命的な技術です。誰でも情報発信ができるようになったのも、膨大な量の知識や考え方を共有できるのようになったのも、すべて Web があってこそです。そして、Web のもつ可能性をひとりでも多くの方に体感してもらうのが、私たちの仕事です。 これは、デザイナーはとてつもない力を持っていることを意味しています。人々を幸せにするのも、ストレスを与えるのもデザイナーの作り方で決まりますし、時には人の考え方を変えることもできます。この記事の題名にもなっている「スーパーヒーロー」とは、デザイナーひとりひとりを指しています。 とてつもない力を持っているからこそ、私たちは責任をもって力を使わなければいけません。また、クライアントやプロジェクトメンバーに向けて、その力をどのようにすれば正しく使えるのかを伝えなければいけません。 > 大いなる力には大いなる責任が伴う “With great power comes great responsibility

アクセシビリティ

Webアクセシビリティを当たり前にするために

当たり前にしては難しい Webアクセシビリティを考慮し実践することは「当たり前」だと思いますが、その当たり前を実践することが非常に敷居が高い印象があります。仕様や規格を理解して実装しなければならないところから、クライアントのコミュニケーションやワークフローといった仕組みの見直しまで、「当たり前」を実践するために超えなければならない山がたくさんあります。 私たちが「当たり前」という言葉を使うとき、「誰でも同じように考えること・自然にできること」というニュアンスを含めています。そのニュアンスのまま当たり前と思って Web アクセシビリティに取り組もうとしても、目の前にある多くの課題に頭を抱えてしまう人もいると思います。当たり前という言葉と、現実にしなければならないことのギャップが、Webアクセシビリティを難しくしているのかもしれません。 当たり前という言葉が難しさに拍車をかけていることがある Web アクセシビリティ。それでも始めてもらうには、Web アクセシビリティの意味を少し広げて実践することだと考えています。 まずは小さな勝利から JIS規格レベルAAを目指すだけでも簡単な

デザイン

デザインが機械化されても心配しない理由

それって本当にオリジナル? レスポンシブ?フラット?ビデオをつかった背景?CSSアニメーション?ゴーストボタン?いろいろな『トレンド』を見て勉強している間に、すべて導入されている 14ドルのテンプレート [http://themeforest.net/item/frio-one-page-parallax-responsive-template/7298727] をすぐに手に入れることができます。 CMS を活用して情報が更新しやすいレストランサイトを構築したい?専用の WordPress テーマ [http://www.cssigniter.com/ignite/themes/resto] を使えばすぐに完成します。英語だからダメと思うかもしれませんが、UI のローカライズが簡単できるように工夫されているので、使うことを諦めることはありません。 制作者の視点で語られる『オリジナルのデザイン』には、ひとつの矛盾があると思います。最新のデザイン動向を追いかけ、それを実践することが良いデザインに繋がると考えることがありますが、トレンドになる表現はすぐにコモディティ化されていきます。

デザイン

目新しさが解決にならない瞬間

シーズン1 エピソード13より 私のお気に入り番組のひとつである MAD MEN [https://www.amazon.co.jp/dp/B00EI54HAM?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B00EI54HAM&adid=1JFPXTSG87VD6BKXPZ57&] で特に印象に残っているのが、スライド映写機の広告キャンペーンをプレゼンするときのシーン。最新の技術を駆使して作り上げられた映写機ですが、どう売ればいいのか頭を悩ませていたコダックに、主人公のドン・ドレイパーが異なる視点で映写機の意味を問いかけます。 今はどの分野でも技術先行になりがちです。それはアメリカの高度成長期だった 50〜60 年代も同じだったのかもしれません。最新の技術や目新しさが必要と思われがちですが、本当に必要なのは製品(サービス)との個人的なつながりだと思います。 もう 10 年近く前ですが、映画監督

デザイン

重要視されるためのデザイナーの条件

内輪受けは止めにしようではないか LSD LAB で公開されている UIデザイナー不要説 [http://lambda-structure-design.jp/lab/is-ui-designer-really-needed/] は、テクノロジーと付き合うデザイナーであれば一読しておきたい記事のひとつです。私が記事を読んで感じた課題は、 UI デザインが重要視されているかどうかということではなく、果たしてデザイナーは デザインを営業できているか [http://www.yasuhisa.com/could/article/design-talk-feedback/]どうかというところです。 たとえビジネスゴールが共有されていたとしても、デザイナーが考える UI デザインの価値と、それ以外の方が考える UI デザインの価値が異なることがあります。特にデザイナーが考える価値は、内輪受けになりやすいことが多々あるように思えます。デザイナーが「すごく良いよね」「イケてるね」というものは、ほとんどの場合デザイナー以外には理解されません。内輪で分かりやすい言葉や感覚で語りかけても、聞き手は「

コンテンツ

デバイスに囚われないスマートなコンテンツが必要な理由

[http://www.yasuhisa.com/could/content/images/wordpress/2014/11/smart_content.png] たとえ小さな市場を狙ったとしても競争が激しく、せっかく作ったコンテンツはすぐに埋もれてしまいます。また、増え続ける膨大なコンテンツを受け取れる容量をはるかに超えてしまったため、情報の受け皿を小さくしている方もいます。コンテンツ供給は膨れ上がる一方、利用者からの需要が頭打ちしている現在。良いコンテンツを作れば読まれるというわけではないからこそ、前回紹介したような 配信の仕方を工夫する [http://www.yasuhisa.com/could/article/huge-content-little-time/] 必要があります。 しかし、配信を工夫することだけがすべてではありません。コンテンツの設計や作り方を改善することで、狭くなりつつある利用者の窓口へコンテンツを届けることが可能になります。 今だけを見ないコンテンツ制作 昨年のコンテンツワークショップ [http://www.yasuhisa.com/coul

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 では、スライドショーを再生しなければアニメーションを見

デザイン

「分からない」から始まるデザインプロセス

分からなくて当たり前 デザインの意味がますます広がる今日。ビジネスや街作りに至るまで「デザイン」という言葉が使われているものの、実際に形作るには深い専門知識が必要とされます。 Web サイト制作も、ビジネスモデルやユーザー調査など様々な分野を理解しなければいけないですが、それだけでは完成しません。フロントエンドやサーバーサイドだけでなく、特定のアプリケーションの使い方を熟知することで、「Webサイト」が形作られるわけです。つまり、視野を拡大・縮小を繰り返すことが、デザインの学習、キャリアにおいて欠かすことができないわけです。 こうして書くのは簡単なことですが、実際に視野を拡大・縮小を繰り返して学習・実践するのは難しいです。時間は有限ですし、ゴールをイメージして情報収集 [http://www.yasuhisa.com/could/article/what-you-need-to-know/] したとしても、知ることができことは限られています。デザインの意味が広がり続けると同時に、デザイナーに求められる知識やスキルが深くなってきています。しかし、すべてを知らなければいけないわけで