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/design-talk-feedback/] 能力も必要です。 「デザインを理解してくれない」と嘆くのはナンセンス。デザインを理解してもらうのはデザイナーの仕事ですし、それを相手が理解できる言葉で伝える工夫も忘れてはいけません。 デザイナーであれば、自分でデザインを語
Webデザイン デザインを増幅させる 今使えるWeb技術 コンテンツをスマートにする [http://www.yasuhisa.com/could/article/for-intelligent-content/] には、ページの概念を取り払ったコンテンツの細分化と管理が欠かせませんが、利用者へ届けるための技術も無視できません。数年前であれば、ネイティブアプリでしかできなかったことも、Web 技術で可能になりつつあります。 マークアップの仕方がここ数年で変化したように、Web 技術も激変してきています。従来のような全ユーザーに同じコンテンツを表示するのではなく、利用者の環境・文脈に応じてきめ細かな配慮が可能になりつつあります。 Web やアプリのデザインは、技術のことを知っているか知っていないかで大きく変わります。今この瞬間のデザイン（トレンド）だけでなく、これからどうなるのかを考えながらデザインするという観点が今の Web デザインに欠けていると感じることがあります。今 Web でできることは数年前と大きく変化していて、それが新しいデザイン提案に繋がるものもあります。Ajax で動的な見せ方をするだけというのは過去の話なわけです。
UX UXとコンテンツが繋がるワークショップの裏側 2月28日 Webridge Kagawa [http://webridge-kagawa.com/meeting/sp/150228/] 主催で「 UXデザインプロセスを活用したコンテンツの評価方法 」というセミナー＆ワークショップが開催されました。このイベントは金沢 [http://www.yasuhisa.com/could/article/ux-content-workshop/]と名古屋 [http://basecamp-nagoya.jp/blog/entry-1392.html] でも行いましたが、いずれも高い評価をいただきました。先週開催されたイベントでも、実戦にもつかえる手法を学ぶことができたという感想を述べていた参加者が何人かいました。 本イベントは 5 時間という長丁場だけでなく、２回のワークショップがカリキュラムに含まれています（初回の金沢では 6 時間半でした）。今回どうしても外せなかったのがワークショップを二回するという部分。カスタマージャーニーマップ [http://www.yasuhisa.com/could/article/customer-jo
コンテンツ コンテンツ細分化の前にしておきたい最低限のコト すぐにはできない細分化 利用者の文脈に合わせてコンテンツを配信するにはコンテンツのスマート化 [http://www.yasuhisa.com/could/article/for-intelligent-content/] は必須です。そのために、ページという概念に囚われないかたちでコンテンツをいかに格納・管理するかが課題になります。Webデザインは枠組みのない世界 [http://www.yasuhisa.com/could/article/wd101-no-edge/] と解説したことがありますが、Webコンテンツにも同様のことが言えるわけです。 コンテンツを細分化することによって、よりきめ細かく文脈に入り込める可能性が広がりますが、実践するのが意外と難しいことがあります。 コンテンツを細分化していくということは、個々のフィールドにどのような形式のデータを入力するのか厳格になります。ルールが必要になるだけでなく、それらを実際入力する手間もかかります。フィールドが増えれば、運営の負荷も少しずつ上がっていきます。運営のことを考えず理想的な細分化を推進しても続かなくなるわけで
コンテンツ コン親会が教えてくれたコンテンツの仕事の面白さ 2月16日、Web コンテンツの作り方・指示の仕方・拡げ方・改善の仕方などを雑談する『コン親会』を開催しました。お付き合いが長い 株式会社エフシーゼロ [http://fc0.vc/] の @fuuri [https://twitter.com/fuuri] さんとした初めての企画です。 以前から、教える・教わるという関係を省いたかたちで、コンテンツやデザインの話がしたいと思っていました。特にコンテンツに関しては、 明確なポジションが日本では確立されていない [http://www.yasuhisa.com/could/article/who-does-content-work/] ので、実際どのような取り組みがされているのか分かり難いところもあります。自分の知見だけではなく、様々な方の意見を耳にすることで、自分の仕事にフィードバックできるはず。今回は「第0回」と題して、現状把握のための場を設けました。 参加した何人の方がイベントレポートを書いてくださったので参照してください。 * コン親会 第0回で、コンテンツとは何かを考える [http://www.kaoritt
アクセシビリティ 自信をもってアクセシビリティに取り組むための課題 2月11日、アクセシビリティ・ビギナー（初心者）向けのセミナーAccSell Meetup 008 [http://accsell.net/info/accsell-meetup008.html] へ参加しました。「アクセシビリティはよく分からないし、難しそう」と考える方に向けて合計 8 回開催されているイベント。私は今回で 2 回目の参加になります。 対象外というのは十分承知していますが、伝える仕事をしている自分としてはビギナー相手にどうアクセシビリティを伝えるのか大変興味がありました。 私はアクセシビリティ [http://www.yasuhisa.com/could/tag/%E3%82%A2%E3%82%AF%E3%82%BB%E3%82%B7%E3%83%93%E3%83%AA%E3%
コンテンツ コンテンツをスマートにするための3つの施策 理想ではなく必須の課題 今後ますますマルチスクリーン化が加速していきます。どのデバイスが流行するか … というより、特定のデバイスのためにひとつひとつ作り込むことが難しくなります。アクセスするためのデバイスは増え続けると同時に、デバイスとの接し方も千差万別です [http://www.yasuhisa.com/could/article/accessible-content/]。 Apple Watch [https://www.apple.com/jp/watch/] のようなデバイスでコンテンツを消費するということはないかもしれません。しかし、そこがコンテンツへの窓口になるとしたら、その小さなスクリーンを使った誘導の仕方や表現を考えなければいけなくなります。コンテンツを消費する場が従来と同様パソコン、スマートフォン、タブレットだとしても、キッカケを与えてくれる入り口は多種多様です。まったく新しいデバイスかもしれませんし、聞いたこともないアプリやサービスを経由して訪れる可能性もあります。 どのような形状にも耐えられるコンテンツとデザインが必要とされる時代。従来のような『ペー
デザイン デザインにおける公平とは 公平と平等はイコールの意味ではない ひとりでデザインするということは、そうはありません。クライアントだけでなく、様々な技能や背景をもった人たちと一緒にデザインを進めることになります。 作業をするのがデザイナーひとりだったとしても、彼等はデザインに対して意見を出してきます。新しい視点を学ぶ機会になるので意見を出し合うことは重要ですが、すべての意見を実践しようとすると、 らくだをデザインする [http://www.yasuhisa.com/could/article/we-just-made-a-camel/] ということになります。デザイン批評 [http://www.yasuhisa.com/could/article/design-talk-feedback/] をする機会がもてない場だと、デザインという行為が少しずつ本来するべきこととは離れたところへ進むことがあります。 誰かと一緒に考えて進める工程はデザイン批評だけに留まらず、プロダクト開発のすべてに言えることです。私は常に公平であること を意識して会話をするようにしています。『公平』という言葉を聞くと、誰もの意見に耳を
サービス デザイナーも知っておきたいIFTTTレシピ 自動化は便利で面白い 使っていないようで、実は常に使っているサービスといえば IFTTT [https://ifttt.com/]。「If This Then T hat（これをしたらあれをする）」の略で、文字通り何かが起こったら、自動的に特定の処理をしてくれます。例えば Instagram で撮った写真を、自動的に Flickr に転載するといった処理を何もしなくてもやってくれます。 似たようなサービスだと昔から Yahoo! Pipes [https://pipes.yahoo.com/pipes/] がありますし、Mac OS X だと Automator [http://support.apple.com/en-us/HT2488] もあります。最近だと iOS に特化した Workflow [https://workflow.is/
プレゼン 自己陶酔にならない、伝わるプレゼンのヒント 2014年11月から2015年1月にかけて、青森で『プロから学ぶ「伝え方」講座』というレクチャーシリーズが開催されました。日本マイクロソフト [http://www.microsoft.com/ja-jp/default.aspx]の春日井良隆さん、西脇資哲さん。株式会社スイッチ [http://swwwitch.com/]の鷹野雅弘さんという錚々たるメンバーの中に私も講師として参加させていただきました。私もセミナー・ワークショップ [http://www.yasuhisa.com/could/tag/講演/] は場数をこなしているいますが、他の方々は桁ひとつ違うくらい講演しているベテラン陣。プレッシャーもありましたが、参加者のプレゼンの審査を含めて良い経験になりました。 自分中心になっていないか プレゼンテーションのスライドは SlideShare [http://www.slideshare.net/yhassy] や Speaker Deck [https://speakerdeck.com] へアクセスすれば、たくさん見ることができます。
デザイン 指標を見つけるための3つの質問 まずビジネスを知る プロには敵わないものの、デザイナー自ら Web 解析をする理由は、Web解析士が見ている部分がデザイナーが見たいデータと異なる場合があるからです。もちろんページビュー、滞在時間、コンバージョン率といった共通する指標項目はありますが、それらの解釈の仕方や、測定したいディメンションが異なる場合があります。利用者がどのような道筋を辿ったのかをデータを見ながら想像することは、デザインのインスピレーションになります。 しかし、問題になるのが何を指標値にすれば良いのかを決めるところです。見ることができるデータは膨大にありますし、マーティングとデザインとで指標にしたいポイントが異なることもあります。また、設計している Web サイトによって指標が変わってきますから「これを見ておけば良い」と言えるようなオールマイティな指標も存在しません。 私の場合、以下のことをクライアントと話したり調査をしながら、今のその企業に必要な指標を探すようにしています。 1. 企業・団体のミッションはなにか？何を目指しているか？ 2. Webサイトの目的はなにか？ 3. そのサイトを通して
コンテンツ リセットして考えるデザインプロセスが必要な理由 [http://www.yasuhisa.com/could/content/images/wordpress/2015/01/wcan2014_session.jpg] CSS Nite [http://www.yasuhisa.com/could/article/how-to-be-a-superhero/] と同様に、年末恒例になっているのが WCAN Winter [http://wcan.jp/news/report-wcan2014winter.html] 。例年、ビジュアルデザインやコードの書き方など、「作り方・見せ方」をテーマにしたセッションが必ずひとつありましたが、今年は 3 つあるメインセッションがすべて「コンテンツ」をテーマにしていました。200名以上集まる Web サイト制作系のイベントで、全編「コンテンツ」をテーマにして話せたのは、大きな意味があったと思います。 昨年は「
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
コンテンツ ポストCMS時代のコンテンツ管理 従来のCMSは大きすぎる 従来の CMS をつかった Web サイト制作は、様々なレイアウトパターンを制作し、そこに集めてきたコンテンツを表示させるというものでした。コンテンツを MySQL のようなデータベースに格納し、それをアプリケーション側で整理や連携を行い、指定したテンプレートに書き出していきます。コンテンツの格納、操作できるアプリケーション、表示させるテンプレートという 3 つの要素をもつことが CMS の特徴といえるでしょう。 しかし、これらすべてが含まれていることが今後の CMS の姿とは言えなくなってきました。コンテンツ、アプリケーション、テンプレートという Web サイト制作のための要素が、すべてひとつのシステムによって管理されているのは作る側にとって効率的で便利ですが、運営側にとって不都合なことが幾つかあります。 * 別システムへのコンテンツの移行が難しい * 機能追加が必要な場合、CMS向けに独自開発が必要になる * テンプレートも独自開発が必要で、組み込み作業も発生する オールインワンで様々な操作ができる利便性はありますが、ひとつのシステムに監禁
アクセシビリティ 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 のローカライズが簡単できるように工夫されているので、使うことを諦めることはありません。 制作者の視点で語られる『オリジナルのデザイン』には、ひとつの矛盾があると思います。最新のデザイン動向を追いかけ、それを実践することが良いデザインに繋がると考えることがありますが、トレンドになる表現はすぐにコモディティ化されていきます。
デザイン 目新しさが解決にならない瞬間 シーズン１ エピソード１３より 私のお気に入り番組のひとつである 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 年近く前ですが、映画監督
コンテンツ デザインとコンテンツを繋げて考えるためのアプローチ 11月15日、金沢の WDF [http://wdf.jp/]主催で「UXデザインプロセスを活用したコンテンツの評価方法 [http://wdf.jp/training/ux-workshop.html]」というセミナー＆ワークショップを開催しました。今までも何度かワークショップ [http://www.yasuhisa.com/could/article/preparing-for-workshop/]をしてきましたが、いずれも 3 時間くらいで短めでした。ほぼ 1 日つかう長時間のイベントは初めてでしたが、長くなければできない貴重な体験ができました。 決めて進めるプロセスを体感 配信者側が見せたいコンテンツが、利用者が求めている情報であるとは限りません。 カフェのオーナーであれば、内装の美しさや自慢のメニューを全面に見せたいと考えるかもしれません。しかし、サイトを訪れる方にとって必要なのは駐車場があるか、今開いているかどうかといった情報という場合があります。駐車場の有無をトップページの目立つ位置に掲載することが正しいというわけではありませんが、配信者側が考える『良いコンテン
サービス OmniFocusでできるタスクに埋もれないためのシンプル設定 タスク管理は様々なツールやサービスを転々としていた時期がありましたが、ここ 2, 3 年は OmniFocus [http://www.omnigroup.com/omnifocus] で落ち着いています。私の場合、クライアントのワークフローになるべく合わせて仕事しているので、情報が分散してしまいがちです。そこで OmniFocus でタスクを収集して、整理・処理をするようにしています。デスクトップ版だけでなくiPhone版 [https://itunes.apple.com/jp/app/omnifocus-2-for-iphone/id690305341?mt=8] も購入するとなると、1万円前後の投資が必要になるので気軽に始めることはできませんが、ただ、デスクトップ版には 14 日間の試用期間があるので試してみてはいかがでしょうか。今年出た 2.0 で UI が一新されたのことで、ますます扱いやすくなりました。 OmniFocus をはじめとしたタスク管理アプリの力を発揮させるには、積極的にタスクを放り込むことが重要です。中途半端な導入ではなく、フルコミットすることで、こ
デザイン ピクサーから学ぶクリエイティビティの秘密 Early on, all of our movies suck. 我々の映画は最初はすべてヒドイものである。 これは「 ピクサー流 創造するちから [https://www.amazon.co.jp/dp/B00OYMOEOS?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B00OYMOEOS&adid=10C0A2MCK3CM3H5P2BDY&] （原書 Creativity Inc. [https://www.amazon.co.jp/dp/B00FUZQYBO?tag=could-22&camp=
