Tagged

デザイン

A collection of 255 posts

デザイン

人の行為をデザインする時代

[http://www.yasuhisa.com/could/content/images/wordpress/2012/08/pasapas.jpg] LoopLoop今年初めて開催された IxDA (Interaction Design Association) 主催のイベント Interaction Awards 2012 [http://awards.ixda.org/]。既に来年のアワードに向けて作品を募集中ですが、今年の受賞者 [http://awards.ixda.org/interactionawards2012] も素晴らしいのばかりです。デバイスを隣り合わせにするだけで、様々な音を奏でることができる LoopLoop [http://stimulant.io/wp/index.php/blog/2012/01/looploop/] や、地元の食材を使いたい人たちが繋がることができる FoodHub [http:

イノベーション

インタラクションと形状の間にあるデザインの行方

7月26日に開催された PARC forum で、ドン・ノーマン [http://www.jnd.org/]と前田ジョン [http://www.maedastudio.com/]の対談がありました。そのときの模様が公開されていた [http://www.parc.com/event/1774/innovation.html]ので、早速見てみました。「デザインは複雑 [https://www.amazon.co.jp/dp/0262014866/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=

デザイン

Webにもある色あせない考え方

その昔、私も書籍を出していたことがありました。 2005年の春、まだ日本では「Web 2.0」という言葉がほとんど耳にされなかった時期に「Web Designer 2.0 進歩し続けるWebデザイナーの考え方 [https://www.amazon.co.jp/dp/4883374327/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=4883374327&adid=1JAWTDWQDZ87WYPYW4N2&] 」という名の書籍を出しました。扱ったトピックが広くて浅く、中級者向けだったということもあり、それほど多く売れたわけではありませんが、今の私の考え方の基礎が執筆を通して形成された書籍です。 今はもう使えない技術話もチラホラありますし、振り返ると非常に恥ずかしい文章を書いていたので、

デザイン

デザイナー育成のための3つのキーワード

Don NormanEngineering Design Education Engineers are trained in narrow specialties but do not get the broad systems thinking or the appreciation of human-centered design necessary for engineering design in the 21st century. 2008年なので、少し古い Don Norman 氏のインタビューですが、共感するところが多々あったので紹介。近年のエンジニアや徹底的に狭い分野で技術力を磨いていくものの、広い視野をもって思考できる者が少ないと指摘しています。彼の「エンジニア」という言葉は「デザイナー」と置き換えて考えることができます。複雑な課題に対して「何か」を作る際に、特殊化されたスキルは役に立ちますが、そもそもの課題の解決のプロセスには、

コンテンツ

設計のヒントを生み出すコンテンツ要素の視覚化

今後のコンテンツ配信、これからの Web と人との関係を考えると、ページというメタファが足かせになることがあります。Webサイト設計者はページという概念を捨ててデザインをしなければならないと、CSS Nite in TAKAMATSU vol.6 [http://www.yasuhisa.com/could/article/cssnite-takamatsu/] をはじめ、幾つかの講演を通して話してきました。 とは言うものの、現状 Webページという情報を束ねる単位は必要とされていますし、何か枠組みがなければデザインすることもできません。もちろん、ページを作るなと言っているわけではなく、ページを作る前に、まずはページから離れてコンテンツの設計を始めたほうが良いという意味です。ページという四角形の枠組みの中に、コンテンツやナビゲーションといった要素をパズルのように置いていく作業に入る前に、コンテンツの全体像を掴む必要があります。 コンテンツを細分化し、関連づけさせることで、実際のページ設計に役立つだけでなく、運営やシステム構築にも重要な役割を果たします。 ここで言う細分化とは、プレ

デザイン

妥協の先にあるデザイン視点

本当に妥協のない体験なのか Microsoft が自社製のタブレット Surface [http://www.microsoft.com/surface/en/us/default.aspx] を発表しました。着脱可能な超薄型キーボードを搭載。タブレットとしても、ノートパソコンとしても使うことができるのが最大の特徴です。 2012年4月、東京都内で開催された開発者向け会議「BUILD」で、あらゆる機器で「妥協のない」体験 [http://pc.nikkeibp.co.jp/article/news/20120424/1047264/"]を Windows 8 は提供できると話していましたが、それを形にしたのが Surface だと思います。ひとつの OS でタブレットもノートも関係なく操作ができるという、Windows 8 の強みを活かしたプロダクトといえるでしょう。 両方ともで使えるということに「妥協をしていない」Windows

デザイン

デザインの試行錯誤とラグをなくすプロセス

ワイヤーフレームやスケッチで、ある程度カタチになっているアイデアも、スクリーン上に実際に描いてみないと分からない場合があります。ラフでは良い感じに見えるものでも、いざ色を付けたりレイアウトを組み上げていくと「あれ?」と思うこともしばしば。ワイヤーフレームやスケッチとして出てきた設計図をそのまま型にすれば上手くいくというわけでもないのが、デザインの難しいところであると同時におもしろいところです。 Photoshop [https://www.amazon.co.jp/dp/B007STFL50/ref=as_li_ss_til?tag=could-22&camp=1027&creative=7407&linkCode=as4&creativeASIN=B007STFL50&adid=1SDQQZA8J767WJSDH9D2&] や、Fireworks [https://www.amazon.co.jp/dp/B007STFV9G/ref=

デザイン

触れる・動くによって変わるデザインプロセス

5月26日、青森にて今後のWebサイト制作との向き合い方 [http://www.aoit.jp/20120526/]というイベントが開催されました。今回は これから求められるWebコミュニケーションスキルと題してプロトタイピングの基礎を解説しました。 CSS Nite in TAKAMATSU [http://www.yasuhisa.com/could/article/cssnite-takamatsu/] のとき「静的なカンプは過去の手法」と話しましたが、ではどうしたら良いのかを考えるキッカケとして本セミナーは参考になったかと思います。 「とりあえず見せて」の解釈について 人は誰しもアイデアをもっていると思います。 自分の頭の中ではハッキリしていたとしても、人に伝えることが出来なければアイデアは活かされることはありません。アイデアはどうすれば伝えることが出来るのでしょうか。 「話せば分かる」という言葉がありますが、そう簡単にはいかないのが現実。同業者で同じような知識を持っていたとしても、同じ言葉が違ったふうに解釈される場合があります。 Webサイトデザインのアイ

デザイン

Paul Randとデザインと私

ポール・ランド [http://ja.wikipedia.org/wiki/%E3%83%9D%E3%83%BC%E3%83%AB%E3%83%BB%E3%83%A9%E3%83%B3%E3%83%89] の名前を知らなくても、彼のデザインは私たちの身の回りにたくさんあります。IBM, Apple, ABC など数多くのコーポレートアイデンティティを手がけたデザイナーです。1996年に他界した彼ですが、YouTubeに晩年のインタビューが配信されています。30分と長いインタビューですが一見の価値あり。彼のキャリアを振り返りながら、彼が辿り着いたデザインの捉え方を知ることができます。 いきなり「グラフィックデザイナーはそれほど重要な存在ではない」という言葉からインタビューがスタート。しかし、それは見た目を良くするためだけのグラフィックデザインを指しており、デザインには存在意義があるとしています。例えば、ビジネスを理解している良いデザイナーであれば、見た目を良くするだけでなく、記憶に残りやすいデザインがつくれる。人々の生活を良くするためにデザイナーは存在していると語っています。

アイデア

答えを見つけるプロセスを楽しむエージェンシーモデルの提案

情報過多だから人に頼る 先日 New York Times で「Are Travel Agents Back? [http://travel.nytimes.com/2012/04/22/travel/are-travel-agents-back.html] 」という記事が公開されました。旅行業界のマーケティング会社 PhoCusWright [http://www.phocuswright.com/] によると、2010年、2011年と 2年連続で旅行代理店/代理人が成長したそうです。欧米では Expedia [http://www.expedia.com] や、Travelocity [http://www.travelocity.com/] のような総合旅行サイトが 2000年前後から利用者の指示を得ていて、旅行をするなら代理店ではなく、サイトを訪れるのが一般的でした。しかし、PhoCusWright

デザイン

スタートアップとデザインについて

Pinterest [http://pinterest.com/yhassy/], Path [https://path.com/], Instagram [http://instagr.am/] など、アプリのスタートアップでデザインが重要であると言われるようになってから久しいです。しかし、デザイナーという存在の理解はされているのかというと時々分からなくなります。 [http://startupsthisishowdesignworks.com/]考えるきっかけを与えてくれたのが、Wells Riley 氏が公開した「Startups, This is How Design Works [http://startupsthisishowdesignworks.com/] 」というページ。デザインの全体像が分かる素晴らしいまとめではありますが、デザイナーへの期待値を不意に高めている部分があります。 アプリデザインに絞って考えたとしても、そこで必要とされるデザインは、インタラクション、グラフィック、アーキテクチャ、タイポグラフィ、コーディング、ユーザースタディなど多岐にわたります。

UI

ミニマリズムUIの課題と対策

実世界のオブジェクトのような質感を UI に加えることで、使いやすさを向上させるアプローチは 親しみやすさを生み出す [http://www.yasuhisa.com/could/article/habit-ui-ixd/] ことから、インターフェイスデザインによく採用されるようになりました。これとは別にアプリの UI デザインでよく見かけるのが、モダニズムを彷彿させたミニマムなデザイン。装飾を最小限に抑え、グリッドで整理された見せ方になります。 代表的なのが Flipboard [http://flipboard.com/] や Pulse [http://www.pulse.me/] のようなニュースリーダーアプリ。Textdeux [http://teuxdeux.com/iphone] や Sparrow [http://sparrowapp.com/] といった仕事に使えるアプリでもミニマムなアプローチをよく見かけます。Instapaper [http://www.instapaper.com/] や Read

デザイン

デザイン話にある三角構造

デザインの話で、ときどき噛み合ないことがあると思います。装飾について熱く語っている人もいれば、論理的にデザインの意図を解説する方もいます。どちらかが間違っているのではなく、デザインの前提が異なっていることから生まれるミスコミュニケーションです。デザイン話にも様々な目的と方法があることを教えてくれた論文があるので紹介します。 2010年に Daniel Fallman と Erik Stolterman が発表した「Establishing Criteria of Rigor and Relevance in Interaction Design Research [http://ewic.bcs.org/content/ConWebDoc/36491] (厳格で適切なインタラクションデザイン調査ための基準つくり)」という論文があります。サイトから論文の全文(PDF)を読むことができます。 この論文によると、デザイン調査は3つの異なる形式による三角構造になっているそうです。三角構造に含まれる 3つとは以下のとおり: Design Practice (実践としてのデザイン)実世界で何

ゲーム

ゲームから立ち返る利用者のためのデザイン

ゲーム要素がゲーミフィケーションではない 2012年3月24日に Android Bazaar Conference 2012 Spring [http://www.android-group.jp/conference/abc2012s/] が開催されました。今まで Android コミュニティとの接点がもてなかったので、今回のようなビックイベントで講演できるのは、またとないチャンスだと思いました。 今回は「人間中心遊戯設計」と題して人に注目したゲームデザインの取り入れ方について話をしました。ゲーム、特にオンラインゲームは私の得意分野。オンラインゲーム [http://www.yasuhisa.com/could/tag/%E3%82%B2%E3%83%BC%E3%83%A0/]とデザインに関する話題は 2006 年から取り上げていますし、講演でも [http://www.yasuhisa.com/could/diary/

テクノロジー

激変するテクノロジーとの正しい付き合い方

過渡期はない 「過渡期」という言葉は、今の世界には合わないのではないかと思います。 新しいテクノロジーが出る度に、人は「今は過渡期だから大変」「過渡期だから様子見」と口にします。Webの世界は毎年目まぐるしいスピードで新しいテクノロジーやトレンドが登場することから、毎年こうした言葉を耳にします。私が「過渡期」という言葉が好きになれないのは、私たちは常に変化の中にいるという事実を見ていない、消極的な表現に聞こえてしまうからです。 CSS Nite in FUKUI で、予測不可能な世界でデザインをする [http://www.yasuhisa.com/could/article/unknown-future/] ことの意味を話しました。上の図は、そのときに紹介した技術開発の進展と製品性能の成長を表した「Sカーブ」です。ひと昔は、Sカーブはゆるやかで、サイクルも10年〜20年くらいの長いものでした。しかし、今は複数のSカーブが重なり合っているだけでなく、サイクルも1年と短い場合もあります。 常に過渡期と感じてしまうのは、S字カーブの後期にあるはずだった安定期がなくなり、常に新しい

コンテンツ

Webのコンテンツ配信はマークアップから

異なるマークアップの意味 コンテンツを校正・編集・デザインするという意味合いが Web になると少し異なるのですが、この感覚が多くの方と共有されないまま 2012 年を迎えています。 従来の、つまり紙における校正・デザインは一種の独裁支配といえます。 紙によるコンテンツ配信は、発信する側が最適と考える見た目を、完全な形で読者に届けます。読者が扱い難いと思おうが関係ありません。紙におけるコンテンツ配信の質は、校正・編集そしてデザインにおいて作られた厳密な世界を届けれるかどうかにかかっています。 しかし Web は、配信者側による独裁支配ではありません。骨組みは設計されているものの、あとは読者が自由にコントロールできます。文字サイズが小さいと思えば、自由に大きさを調整できます。白色背景が目にキツいと思えば、色を反転させることもできます。とにかくじっくり読みたいと思えば、 Instapaper [http://www.instapaper.com/] のようなツールを使ってデザイン要素をすべて省いてコンテンツを消費することも出来ます。 従来の「支配する」校正・デザインの感覚をその

コンテンツ

文脈にある2つの分類と人間らしさのバランス

今後デザインしていく上で重要となる文脈 [http://www.yasuhisa.com/could/?s=%E6%96%87%E8%84%88] の理解。文脈と一言でいっても範囲が広過ぎて何処から何をすれば良いのか分かり難い言葉です。文脈によって活かされるコンテンツ配信 [http://www.yasuhisa.com/could/article/context-content/] で取り上げたような実例があると「あぁこういうことか」と分かるものの、実際自分でするとなると始めるための具体的な要素が知りたくなります。 文脈は、ヒューマンとテクニカルの2つに大きく分類することが出来ます。ヒューマン側のコンテキストは人間の態度・行動・思考への理解が必要になる分野です。社会学・心理学とったアカデミックな分野も取り込んで研究するのも手段ですし、ペルソナを用いたデザイン思考プロセスでも導き出すこともできます。 テクニカル側のコンテキストは今の技術をつかって取得することが出来ます。HTML5 の geolocation [http://html5demos.com/geo] はその典型的な例

UX

感情デザインの必要性と評価のためのヒント

あなたは上の写真を見て、ちょっと笑顔になりませんでしたか? 笑わなかったかもしれませんが、悲しくなったり怒ることはなかったと思います。 人は感情の生き物です。自分の想いを表情や仕草によって表現することが出来るだけでなく、他から影響を受けたり、影響を及ぼすことが出来ます。見知らぬ子供の写真を見て、自分の感情が変わったのも私たちが感情の生き物であることの表れでしょう。 ポジティブな感情をデザインを通して引き出すことが出来るのでしょうか。「Design for Emotion [http://www.abookapart.com/products/designing-for-emotion] 」のような書籍が昨年出たのも、感情とデザインの関連性が強いことを示していますし、利用者に注目したデザインプロセスや、文脈 [http://www.yasuhisa.com/could/?s=%E6%96%87%E8%84%88] を考慮したデザインが注目されるのは、人の感情をどうデザインするかを探求するための手段なのでしょう。 従来のコンピューターと人間の関係は比較的シンプルでした。大きな装置に向

アクセシビリティ

見えるアクセシビリティをデザインする

先週の金曜日、アクセシビリティキャンプ東京 キックオフミーティング [https://www.facebook.com/events/149976381777809/]に参加しました。既に世界各地で開催されている アクセシビリティキャンプ [http://www.accessibilitycamp.org/]の東京版を始めるそうで、その最初のミーティングになります。 私自身はアクセシビリティの専門家ではありませんが、今のアクセシビリティ周りの活動や課題、そしてアクセシビリティに関わるプロフェッショナル達が抱く想いを知りたくて今回参加してみました。 見え難いアクセシビリティ 以前から奇妙だと思っているのが、コンテンツ/デザイン/機能など様々な物事において付加価値が重要視されているのにも関わらず、アクセシビリティになると付加価値ではなく、ボランティアに近いサービスとして見られる点。その要因として、健常者は省かれてアクセシビリティが捉えられている、障害者のためにある配慮になっているからかもしれません。アクセシビリティはコンテンツ/デザイン/機能の付加価値になるのですが、そこがまだリンクし

コンテンツ

Year in Review 2011

#a01文脈を理解したWebコミュニケーションデザイン [http://www.yasuhisa.com/could/article/context-web-communication/] 今年の Web デザインを語るのにひとつの軸になった記事。モバイルにフォーカスした記事も書きましたが、来年も文脈をテーマに幾つか記事を執筆することになると思います。 記事を読む [http://www.yasuhisa.com/could/article/context-web-communication/]#a02 デザインのなかにある魔法と活用の仕方 [http://www.yasuhisa.com/could/article/design-magic/] 仕組みが分かっていると、どうしてもこうした感覚を失いがちになりますが、重要な視点だと思います。デザイナーは錬金術師であれ。 記事を読む [http://www.yasuhisa.com/could/article/design-magic/]#a03ソーシャルメディアがもつ光と闇 [http://www.yasuhisa.com/coul

UI

伝わるアニメーションのための第一歩

2011年 UI/UX トレンド [http://www.yasuhisa.com/could/article/ui-ux-2011-trends/] で、アニメーションが実装される機会が増えるだろうと予測しました。今はアプリだけなく、Webサイトでもよく見かけるようになりました。実装が簡単に行えることから、何気なく使われていることが多くなったわけですが、正しく実装するのが意外と難しかったりします。 アニメーション効果はコミュニケーション を円滑にするために使われるべきです。アニメーションが発生した瞬間に何かしらのコミュニケーションがインターフェイスと利用者の間に生まれます。つまりアニメーション効果を実装するということは、コミュニケーションの目的を明確にすることから始まります。コミュニケーションを確立しているかどうかで、アニメーション効果がギミックになるのか、意味のあるものになるのか決まります。 アニメーションと一言でいっても様々な形があります。例えば jQuery [http://jquery.com] には以下のようなアニメーションが実装可能です。 .animate()C

コンテンツ

文脈によって活かされるコンテンツ配信

今年の始めに執筆した「文脈を理解したWebコミュニケーションデザイン [http://www.yasuhisa.com/could/article/context-web-communication/]」で、利用者の文脈を理解して Web サイトを設計する必要性を解説しました。当時は Web サイトデザイン全般について供述していましたが、コンテンツ戦略にとっても文脈は大事です。 先日のWordCamp [http://www.yasuhisa.com/could/article/wordcamp-contentstrategy/] で紹介した NPRの映画レビューのページ [http://www.npr.org/2011/11/22/142652996/hugo-from-a-master-a-love-letter-to-his-medium] が好例です。PC版では大きなスクリーンサイズと高速回線を活用して、大きな写真や動画だけでなく本文に付随する様々な情報が用意されています。しかし、モバイル版では小さな画像と本文のみが提供されています。小さなスクリーンで移動中かもしれない利

デザイン

デザインする人の価値と誠実さ

誰でも価値観をもっていると思います。 デザイナーも何か自分なりの価値をもちながら仕事をしています。ここでいう『価値観』とはデザイナーがもつ独自の美的センスや技能力を示しているのではなく、彼(彼女)がどのような姿勢で仕事をしているかという意味を指しています。 しかし、自分の価値を仕事に反映させることは、簡単そうでとても難ことがあります。 お金のこと、同僚のこと、上司のこと、クライアントとのやりとりの結果、自分の価値とは合わない出来事があるかもしれません。自分の価値を曲げて仕事をしなければならないと感じることもあるでしょう。また、そこまですることが『仕事』と感じる方もいるかもしれません。 実のところ、自分の価値観をもちつづけることは、何よりも大事なことです。価値を失うということは、仕事においてあなたしか提供できない価値をつくりあげる能力を失うことに等しいことです。給料や報酬は、あなたが作ったモノという結果だけではなく、あなたの価値に対して支払われています。つまり、あなたが価値観を失うということは、モノを作る機械と競争しているのと変わらなくなるわけです。いずれあなたへわざわざ依頼する必要

デザイン

Q&A: 日本語サイトで英語を多用しているのはどう考えていますか?

> 社会にあるあらゆるデザインについて言えますが、日本語だけで表現できるものにあえて英語を使ったり、アクセントとして英語を使うことがあります。 英語を使うことがかっこいいという理由だけなのでしょうか? from: Naoyoshi Suzuki [https://www.facebook.com/naoyoshi] 留学1年して帰国した後、唖然としたのが英語表現がおかしい T シャツを着ている人が多かったこと。自分もおかしな英語が記載されたシャツやグッズをもっていたわけですが、少し英語が理解し始めると妙に思える場合がありますね。海外でもおかしな日本語のシャツを着たりタトゥーにしている人はいるので、日本だけの現象ということではありません。 Webサイトデザインでも英語をデザインの一部として利用しているケースが幾つかみられます。英語のラベルをヘッダーやメニューに入れるケースをよく見かけますが、英語をわざわざ使うのも幾つか理由があります。 装飾としての英語 文字が意味を伝達するための手法として扱われているというより、装飾の一部として捉えられてる場合があります。欧文ならではの曲線や形状が

テクノロジー

Siriから始まる未来のコミュニケーションデザイン

自然言語とセマンティックデータの間で Siri をフィーチャーした Apple の CMiPhone 4S に実装されている人工知能アシスタント「Siri [http://www.apple.com/iphone/features/siri.html] 」。まだ英語しか対応されていないものの、キーボード、マウス、ジェスチャーに続く第四のインプットとして大きな力を発揮するのではないかと考えています。 Siri を活用しはじめて以来、天気や目覚ましの設定など今までアプリや Web サイトから行わなければならなかった作業が、あっと言う間に完了するようになりました。今までキーボードやジェスチャーを必要とした作業が声によって入れ替わることを実体験すると、インプットの未来を感じざるおえません。もちろん、従来のインプット方法(特にジェスチャー)がなくなることはないものの、声に入れ替わることは少なくないはずです。 以下は予測される Siri と利用者によるおおまかなやりとり。 1. 自然言語で Siri にコマンドを送る。2. 自然言語からキーワードを拾い、Web やデバイスに蓄積されているデー