デザインシステムは最優先にはならないです
どちらかというと優先順位は低めですデザインシステムの必要性を説く時代は終わりましたが、その利用促進や運用継続は容易ではありません。デザインシステムの構築者とプロダクト設計者が同じ人物であるような小規模組織では、ガバナンスの課題は些細なものばかりです。また、コミュニケーションが活発な小さな開発チームなら、メンバーのモチベーションが続く限り、維持・管理は比較的容易です。 組織が大きくなり、様々な体制やプロセスを持つ複数のプロダクトが存在する場合、全員一丸となってデザインシステムを取り組むのは難しくなります。その結果、「作る側」と「使う側」に分かれがちです。この問題を解決するため、各プロダクトから代表者を集めて議論する連邦制のような体制が考えられます。しかし、デザインシステムへのコミットメントを本業と両立させるのは容易ではありません。 プロダクトの開発と改善に集中しているチームにとって、デザイン
4つの組織タイプから考えるデザインの始め方
組織の特徴を理解してアプローチを考える ある組織ではうまくいくことも、別の組織では空振りといったことはよくあります。例えば、組織 A ではカスタマージャーニーマップを作ることで課題共有がしやすくなったとします。この成功を基に組織 B で試してみたら、まったく響かないケースがあります。 UX デザインに限ったことではないですが、新しいことを始めるのが難しいのが、それぞれユニークな組織文化に合うアプローチを考え、実践しなければいけないところ。ベストプラクティスを実践しても成功しないのも、組織というペルソナを無視して手段を実行しているためでしょう。 いろいろ試して模索するのもひとつですが、少しでも組織の特徴を理解した上で施策をうちたいところです。組織の特徴を把握するための手段のひとつに Competing Values Framework（競合価値観フレームワーク）が役に立ちます。 Robert
性別選択UIにあるデザインの課題
私は男性として生活をしています。 ソーシャルメディアなどにプロフィールを記載する場合は「男性」を選択しています。女性であればプロフィールに「女性」と選択して、自身を「女性である」と考えるでしょう。 こうした性別選択は、多くの方にとって当たり前すぎて深く考えないことです。しかし、こうした自分を表現する小さな部分にも課題は隠されています。人によっては「男性」「女性」という分類に当てはまらない方もいますし、それを特定の人にしか公表したくないという場合もあります。自分のジェンダー（gender, 性）は男性でも女性でもなく、「〇〇である」と意思表示をしたい方。自分の意向に合う呼ばれ方をしたいと考える方もいるはずです。 この課題に取組んでいるソーシャルネットワークを幾つか見かけるようになりました。男性、女性のという選択肢だけでなく「カスタム」という項目を用意し、そこに自分の性を表すのに適切な言葉を自
デバイスと利用シーンへの最適化から学べること
Web サイトデザインでは 2, 3 年くらい前から モバイルファーストでデザインをするという考え方が浸透し始めていますが、最近アプリでも似たような傾向が見られるようになってきました。先週 Foursquqre が チェックインとショップガイドを分けると発表しました。一方、Facebook は、メッセージアプリを分断しようとしています（Google+ は、Hangout を分断してしばらく経ちます）。 デスクトップ版の使い勝手に慣れ親しんでいる方にとっては『改悪』なのかもしれません。しかし、モバイル（又はスマートデバイス）中心で活用している方には、適したアプローチといえます。モバイル中心の利用者は、操作すれば何でも手に入るアプリではなく、文脈に応じて適した量の情報や機能を提供するアプリを求めています。つまり、アプリを立ち上げれば、ニーズに応えてくれるものを求めているわけです。 Facebo
コンテンツからみるWebアクセシビリティの課題と提案 : could
コンテンツは本当にアクセシブルか Webアクセシビリティは、大きく分けて 2 つの『デザイン』があります。ひとつは、情報を分かりやすく整理し、目的の情報へた辿り着くための Web アクセシビリティ。この要素は、色、形状、動き、スピードなど、UI デザインの課題と重なるところが多いです。もうひとつの要素は、情報の構成や文章のスタイルといった「編集」とも呼べる Web アクセシビリティです。 前者の情報構造や操作性は、明確なガイドライン化がしやすく、チェックもしやすいですが、後者の編集の部分は、パッと見では判断がしにくいだけでなく、ガイドラインとして共有するのも難しいです。 Webアクセシビリティにある 2 つの『デザイン』 もちろん JIS X 8341–3:2010 でも「利用者が理解できるコンテンツ」を制作・維持できるようにすることが重要であると書かれていますが、技術で解決できるところに
世界最初のWebサイトが教えてくれるデザインの原則
4月30日は World Wide Web にとって重要な日。先日 CERN が、W3 の関連技術をパブリックドメインにしてから、20 年を迎えました。CERN 公式サイト では W3 の歴史を振り返ると共に、1993 年に公開された 最初の Web サイト もオリジナルの URL に再公開されました。 世界最初の Web サイト（上図）は、コンテンツとデザインに関する講演をする際に何度か取り上げています。例えば、2011年ロフトワークが主催した いまさら聞けない！？ 企業のスマートフォン対応 で、20年前に作られたサイトにも関わらずスマートフォン対応されていると紹介しました。 シンプルなマークアップですし、装飾も一切ないので表示されて当然かもしれません。しかし、今まで私たちが作ったサイトの中で、作った当時には予測もしなかったデバイスでも情報をきちんと伝えることができるのがどれだけあるでし
2012年 デザインの4つの課題
ここ 1, 2 年でアプリが爆発的に増えただけでなく、スマートフォンの普及により Web がさらに身近になりました。便利な世の中になったかのように見えますが、今見るトレンドから新たな課題が浮き彫りになりました。今年末から来年にかけて、デザインの観点から解決していきたい課題が 4 つあります。こうした課題を Web やイベント、会合を通して議論できたらなと考えています。 一貫性のないジェスチャーインタラクション マルチタッチスクリーンは、インタラクションデザイナーに新たな可能性を提示たのと同時に、大きな課題を残しています。ジェスチャーUIの課題と対策でも指摘しましたが、現状ジェスチャーにはスタンダードと呼べる操作がなく、アプリごとに異なる解釈をしています。 iPhone のメールアプリで左から右へスワイプをすると「削除」のボタンが右側に表示されますが、同じジェスチャーを Twitter 公式
ミニマリズムUIの課題と対策
実世界のオブジェクトのような質感を UI に加えることで、使いやすさを向上させるアプローチは 親しみやすさを生み出すことから、インターフェイスデザインによく採用されるようになりました。これとは別にアプリの UI デザインでよく見かけるのが、モダニズムを彷彿させたミニマムなデザイン。装飾を最小限に抑え、グリッドで整理された見せ方になります。 代表的なのが Flipboard や Pulse のようなニュースリーダーアプリ。Textdeux や Sparrow といった仕事に使えるアプリでもミニマムなアプローチをよく見かけます。Instapaper や Read it Later は、すべての Web サイトをミニマリズムに再現できるアプリで、これらも高い支持を得ています。 もちろん、アプリデザインだけではありません。Windows Phone 7、Windows 8 で採用されている Met
楽天から学べる日本的なWebアプローチ
学べるところが多い楽天ページWebデザインに関わる様々な情報やノウハウが世界中で共有されているとはいえ、お国柄は存在します。Yahoo!でも、世界共通にみえる UI コンポーネントがありますが、アメリカと日本と中国ではアプローチが異なります。情報にメリハリをきかせているアメリカ。今の話題を中央にたくさん詰め込めるように工夫してある日本。クリックをしなくても膨大な情報を消化することができる中国。ポータルサイトをひとことで言ってもやり方がいろいろあることが分かります。 各国の Yahoo! を見て「欧米はシンプルなのに、日本や中国はなんかごちゃごちゃしている」と感じた方はいるかもしれません。なぜそんな小さなところに情報を詰め込むのか、なぜページを整理しなのか、メッセージを絞ってメリハリをつけないのか、といった悩みを抱えるデザイナーもいるかもしれません。 日本らしい忙しいデザインの代表例としてよ
イノベーションが続くF2Pゲームの現在と未来
ここ 1,2 年で頭角を現しているソーシャルゲームですが、MMOG (多人数オンラインゲーム) のジャンルから見ると、今の流行の前兆をいくつか見つけることができます。 10歳前後をターゲットにしている Club Penguin。親が安心できるような機能やサービスを充実させ、サービススタート当時から高い評価を得ています。 2005年から運営している Club Penguin (2007年にディズニーが買収) は、ブラウザベースの子供向け MMORPG で、無料で遊べるものの有料会員制も導入しています。ソニーが 2009年か運営している Free Realms は、子供をメインターゲットにしているオンラインゲーム。PlayStation 3, Windows, Mac で遊べる MMORPG で無料から遊べることが出来ます。いずれもノンゲーマーと呼ばれてる人たちからも指示を得ているカジュアルオ
文脈によって活かされるコンテンツ配信
今年の始めに執筆した「文脈を理解したWebコミュニケーションデザイン」で、利用者の文脈を理解して Web サイトを設計する必要性を解説しました。当時は Web サイトデザイン全般について供述していましたが、コンテンツ戦略にとっても文脈は大事です。 先日のWordCampで紹介した NPRの映画レビューのページが好例です。PC版では大きなスクリーンサイズと高速回線を活用して、大きな写真や動画だけでなく本文に付随する様々な情報が用意されています。しかし、モバイル版では小さな画像と本文のみが提供されています。小さなスクリーンで移動中かもしれない利用者に対して「目的の記事を読む」というニーズに素直に応えた形になっています。さらにiPadアプリだと、また見せ方が少し違います。タブレットはリビングルームのような気軽な生活の場で利用されるデバイス。ゆったり座りながら記事が読めるようなレイアウトと情報構成
アドビさんへ３ : could
Adobe意見 アドビさんへ３ バグも少なくなく不安定なアップグレードがつづくなか、アップグレードポリシーが変更されたことにより不満の色濃くなったところがあると思います。Adobeに必要なのは今まで以上の透明化とコミュニケーションの窓口を増やすことではないでしょうか。 次期バージョンからのアップグレードポリシーの変更とAdobe Creative Cloudの発表で、昨日から Adobeユーザーの間から様々な声が発せられています。今年はサブスクリプションサービスの提供を開始し、さらに Cloud によって価値を高めようとしているものの、思惑どうりにはいっていないようです。今まで過去 2,3 バージョン遡ってアップグレードできたのが、1バージョン前からしかアップグレード価格が適応されなくなるのが大きな原因。今までも利用者の間では「アドビ税」と呼ばれている Creative Suite ですが
認知の違いから分かる効果的な情報の見せ方
情報は単に配信すれば伝わるというわけではありません。仕様書を読んで理解できる人もいれば、噛み砕かれた解説書を読むことで理解できる人もいます。また、文章を読んで論理的にアイデアを組み立てる人もいえば、絵から全体像を掴みながらアイデアを考える人もいます。伝えるための情報デザイン、文章デザインで、情報（文章や絵図）をいかに構成することで人に伝わりやすくなるという話をしました。今回は情報を受け取る人に注目し、人が情報をどのように認知しているのかを考えてみます。 今回、Cognitive style and learning strategies という文献を参考にしました。認知の視点から人がどのように学習をするのかを簡潔にまとめています。その文献によると、段階的に学習する Serialist と、メタな観点から学習する Holist の二種類の学習方法があるといわれています。使い分けて学習する方も
WD101: Webは見た目のコントロールがきかない
このシリーズでは Web Design101（WD101）と名付けて、ウェブデザインをより深く理解するための最初の一歩になる知識やノウハウをコラム形式で紹介していきます。 DTPという名の足かせ Webデザインはよくも悪くも DTP のノウハウを受け継ぎながら徐々に成長してきた領域です。今でも根強く残っている「ページ」という概念。タイポグラフィ・グラフィック・レイアウトなど DTP が培ってきたノウハウは CSS と HTML （ときどき JavaScript）を使って再現されたりしています。DTPの概念とノウハウがなければ Dreamweaver のようなソフトは生まれなかったでしょうし、Dreamweaver のようにコードを手打ちしなくても DTP 感覚で Web デザインに入り込めるソフトがなければ、Web デザイナーを職業とする方もこれほど増えなかったかもしれません。 しかし、D
SNSにある自己表現とFacebookが見出した人の欲求
以前 脱テンプレートなFacebookの難しさと関係の変化 という記事で、SNS の構造や仕組みから見た Facebook の独自性を解説しました。今回は SNS と利用者との関わり方を重点において解説します。日本でこれからどうなるか分からないですが、海外では学生からお年寄りまで魅了している Facebook。なぜ彼等は他の SNS ではなく Facebook にハマるのでしょうか。 ハマるといえば、最近ではゲームの要素を盛り込むという話がよく出てきます。私も昨年末に ゲームをテーマにした講演 をしましたし、そこでもゲームの要素を加えることで楽しさを増幅させることが出来ると解説しました。しかし、そうした要素を追加する前にソーシャルアプリやサービスの本質を見極める必要があります。そこの理解をなしにしては、たとえゲーム的な要素を加えたり、最新技術を盛り込んだとしても意味がありません。Faceb
拡大・縮小機能からみるブラウザの課題
拡大・縮小はレガシー機能？ JIS X 8341-3:2004 には、ブラウザの機能で文字の拡大・縮小ができるようにしたり、ユーザースタイルシートで変更できるようにすることを推奨しています。当時多く方が利用していた IE6 は、ピクセル指定の文字の拡大縮小が出来なかったこともあり、ブラウザの機能とは別に JavaScript で実現した文字サイズ UI が実装されてたのだと推測しています。もちろん、JIS規格が IE 中心で見ていたとは思っていませんが、ブラウザによって拡大・縮小の解釈が様々でした。その名残もあって今でも Web サイトに文字サイズ変更の UIが設置されている場合があります。 今は時代も変わりほとんどのブラウザがピクセル指定がしてあってもレイアウトも文字も拡大・縮小出来る機能を実装しています。こうした時代の変化を考慮して JIS X 8341-3:2010 では、文字に関す
これからのWebデザイン教育【２】
前回の「これからのWebdデザイン教育」の記事は、Facebook グループをはじめ様々な場で意見が飛び交いました。あのような記事を書いた理由は、不満をぶちまけているのではなく、書くことによってちょっとだけ考えてみる機会を皆に持って欲しかったわけです。今回は様々な意見が出てきたことを踏まえて、私のほうで感じたことを幾つかまとめていきます。 教育機関だけの問題ではない 教育の話になると、まず学校の改革・カリキュラムの見直しという教育機関へ向けた問題解決に集約してしまう傾向があります。しかし、実際のところ教育機関が今のようにスキル中心の教え方をしている理由は、そこに需要があるからという現実もあると思います。企業の募集ページをみると「○○が出来る方」というスキルセットがリストアップされているわけですし、即戦力とはそういったスキルがある方を指す場合がほとんどです。勉強会・セミナー・ブログを覗いてみ
ジェスチャーUIの課題と対策
タブレットやスマートフォンで積極的に導入されているマルチタッチテクノロジー。デジタルなオブジェクトに触れているような感覚が味わえるタッチインターフェイスは、抽象的なマウス操作に比べて直感的だと言われています。スクリーンに触れるだけの動作は直感的で簡単そうですが、これにジェスチャーが加わることで突然ややこしくなる場合があります。感覚的・直感的というよりかは、操作を覚えなくてはならない負荷がかかる可能性もあります。 未来のインターフェイスを語る上でよく出て来るのが映画『マイノリティ・リポート』。この映画に登場するマルチタッチ UI の技術は一般化されつつあるといっても過言ではありませんが、大きく腕を振りかざし、長時間立ち続けなければならないのであれば、すぐに疲れてしまいそうです。トム・クルーズ並みの強靭な身体でないと使えない・・・なんてことになると困りますね。 例えば Mac OSX とその上
Webデザインにある駆け引きとコダワリ
Webは人とデータに開放された世界 電子書籍の登場で、再び DTP デザインと Web デザインが比較されることが増えてきた印象があります。もちろん以前から「DTP デザインの呪縛」のようなものが Web デザインの世界で長く受け継がれています。随分 Web に最適な手法が盛り込まれているものの Dreamweaver のような老舗アプリは「DTPデザイナーでも Web サイトが作れる」というコンセプトが今も残っています。Webデザイナーは表現の仕方の違いからフラストレーションをためている方もいると思いますし、発注者側も DTP と Web の違いを伝えてもらっていないことからコミュニケーションに困っている場合もあると思います。 紙には物理的な境界線があることから情報量に限界がありますが、完全に隔離された世界を作ることができます。その世界は紙という媒体によって完全に守られていて、デザイナー
Waveから見えてくるGoogleの弱点
発表された当時から「なんかスゴそうだけど何かよく分からない」と言われていたGoogle Wave。常に細かな改善はされていましたし、今年の 5 月に開催された Google I/O 2010 では Wave を利用したカンファレンスの整理や情報交換に利用されていました。私も先月開催されたセミナー＆ワークショップで Wave を利用していたわけですが、発表されてわずか1年でGoogle Wave 開発中止になりました。 一般公開されている Public Wave を見てみると結構盛んなやりとりをされているものも少なくなく、利用者の使い方を反映してどう改善していくのか楽しみだっただけに少し残念です。Wave の技術や学んだことは Chrome OS へ受け継がれるでしょう。 Waveが残したもの 開発が中止になったとはいえ、すべてが無駄だったとは言いきれません。デザインや技術的なところで学べる
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
