おすすめデザイン入門書10選 : could
たまには本もいかがですか？ セミナーやワークショップのあとに質問を受けることがありますが、「おすすめの書籍はありますか？」と聞かれることがあります。 Web には膨大な情報がありますし、英語まで手を広げると研究者による文献にもアクセスすることができます。しかし、ある特定のトピックを要所を落とさず学びたいときは書籍が便利です。 目まぐるしく状況が変わるだけでなく、デザイナーとして知っておくべき領域も広い今日のデザイン。ソフトウェアの使い方を覚えることも重要ですが、作るための考え方や伝えた方を学ぶことに多くの時間を費やしたほうが良いでしょう。自分のデザインの意図が説明できて、ようやく同僚やクライアントにデザインを理解してもらえるからです。 今回は、デザイナーとして読んでおきたいオススメの入門書を紹介。Web やアプリに特化したものではなく、デジタルプロダクトに携わるデザイナーに向いている書籍を
問題解決のためのスタイルガイド入門
定義が広いスタイルガイド フロントエンド開発者からスタイルガイドという言葉を耳にするようになりました。効率的、かつ一貫性のある見た目とコードをつくるための共有ツールとして、スタイルガイドが使われることがあります。一見、目新しくみえるスタイルガイドですが、最近生まれた新しいアイデアではありません。ロゴやコーポレートカラーの使い方を記したスタイルガイドは昔からありますし、ライターにもスタイルガイドがあります。 このように、開発者も、デザイナーも、ライターも同じように「スタイルガイド」という言葉を使っています。人によって、その言葉から受ける印象も異なれば、必要としている要素も異なります。YUI 並の UI アセット をスタイルガイドに含めることを期待している人もいます。アプリや Web サイト開発におけるスタイルガイドを作る際に難しいのは、何で作って管理するかではなく、どの範囲をスタイルガイドと
Fireworks後のツールとワークフロー
Fireworks 以外の選択肢は？ Adobe Creative Suite が終了し、Cloud の一本化が発表されました。今回の新製品ラインナップでニュースになったのが、Fireworksの開発中止 のニュース。最新版の Fireworks CS6 の次期 OS へのサポートをすると宣言しているので、すぐに使えなくなるということはありませんが、視野を広げて別の選択肢を探さなければならなくなるでしょう。 Fireworks が数年後には使えなくなるかもしれないから、Photoshop に移行するべきなのかといえばそうでもありません。写真やグラフィックといったビットマップ画像編集であれば Photoshop は素晴らしいですし、ベクターシェイプやレイヤースタイルを使えばある程度柔軟性を保つことはできます。しかし、Webサイトデザインにふさわしいツールとはいえません。 Fireworks
カンプがなくなったときのデザイナーの役割
手段を再想像する 昨年末に開催された CSS Nite Shift 5 で「Reimagination（再想像する） 」の話をしました。人とコンピュータの関わり方が行動や価値観を再定義しているのと同じように、Webサイト制作にしても同様のことがいえます。今までの当たり前を疑い、未来に柔軟に対応できるワークフローが必要とされています。 例えば従来必須だと言われていたワイヤーフレームも考慮対象です。少し前に ASCII へ「柔軟性あるデザインプロセスへ移行するためのヒント」という記事を寄稿しました。ワイヤーフレームが果たそうとしているコミュニケーションの目的は間違っていませんが、つくるためのツールや手法に問題があるのではないかという疑問を投げかけた記事。絶対いると思い込んでいるものも、今の時代にマッチしなくなってきているものは少なくありません。 また、Photoshop や Fireworks
パフォーマンスは技術課題ではなくデザインの課題
人気デザインギャラリーサイトから幾つかモバイル向け Web サイトのパフォーマンスを検証してみました。以下が各サイトのリクエスト数とファイルサイズになります。 FELISSIMO 500色の色えんぴつ: 81リクエスト / 1.94MB 旅館 大村屋 55リクエスト / 1.52MB UR オンラインストア 90リクエスト / 705kb JiNS PC 78リクエスト / 1.39MB らでぃっしゅレシピ 69リクエスト / 987kb 明治北海道十勝カマンベールチーズ 54リクエスト / 1.12MB いずれもスクリーンショットでは素晴らしい見た目で使いやすそうに見えますが、中身はかなり重いことが分かります。1MB 以下に抑えているサイトもありますが、それでもかなりリクエスト数が多いのが分かります。リクエスト数が多いということは、回線が安定しない場合、すべての要素が読み込まれない可能性
触れる・動くによって変わるデザインプロセス
5月26日、青森にて今後のWebサイト制作との向き合い方というイベントが開催されました。今回は これから求められるWebコミュニケーションスキルと題してプロトタイピングの基礎を解説しました。 CSS Nite in TAKAMATSU のとき「静的なカンプは過去の手法」と話しましたが、ではどうしたら良いのかを考えるキッカケとして本セミナーは参考になったかと思います。 「とりあえず見せて」の解釈について 人は誰しもアイデアをもっていると思います。 自分の頭の中ではハッキリしていたとしても、人に伝えることが出来なければアイデアは活かされることはありません。アイデアはどうすれば伝えることが出来るのでしょうか。 「話せば分かる」という言葉がありますが、そう簡単にはいかないのが現実。同業者で同じような知識を持っていたとしても、同じ言葉が違ったふうに解釈される場合があります。 Webサイトデザインのア
UXとUIが混同されるワケ
最近 UX と UI を混同して表記されているのを見かけるようになりました。私もウケやすいということで、混同させたことがあります。しかし実際のところ UX と UI は同義語ではありません。良い UI デザインをすれば、UX が向上する可能性はありますが、必ずしもそうではありません。逆もしかりです。最近も UX と UIの違いを分かりやすく表現しようと、シリアルとボールの写真を使った例が登場しましたが、「そうでもない」という意見も多数ありました。 それでは、なぜ混同されやすいのかというと、今のスマートフォン向けのデザインを見るとヒントが隠されています。例えば Twitter クライアントの中で人気のある Tweetbot を見てみましょう。このアプリの中で装飾と呼べるデザインはどれだけあるでしょうか。ほぼ皆無だと思います。 スマートフォンという小さなスクリーンには、UI しか存在しません。
体験について考えるとは
UXでは見えてこない側面 ひとつの考え方として UX (User Experience) は今日のデザインでは無視をすることが出来ません。デザイナーだけでなく、今やビジネスシーンでも耳にする「体験」という言葉。しかし、この体験という言葉は非常に曖昧な表現です。体験というのは主観的かつ内面的に感じ取るものであることから、良い体験の定義の仕方も異なる場合があります。ところで「体験」ってなんですか？という記事で紹介したように、体験には「Experience Self」という今この瞬間を経験する自己と「Remembering Self」という記憶を辿る自己があり、どちらの体験を話しているかで話がズレてしまうことがあります。 体験について考える上で、「U（ユーザー）」が必要なのだろうかと疑問に思うことがあります。もちろん、ユーザーを無視してデザインしようと言いたいわけではありませんが、このユーザーと
スタートアップとデザインについて
Pinterest, Path, Instagram など、アプリのスタートアップでデザインが重要であると言われるようになってから久しいです。しかし、デザイナーという存在の理解はされているのかというと時々分からなくなります。 考えるきっかけを与えてくれたのが、Wells Riley 氏が公開した「Startups, This is How Design Works」というページ。デザインの全体像が分かる素晴らしいまとめではありますが、デザイナーへの期待値を不意に高めている部分があります。 アプリデザインに絞って考えたとしても、そこで必要とされるデザインは、インタラクション、グラフィック、アーキテクチャ、タイポグラフィ、コーディング、ユーザースタディなど多岐にわたります。これらを総括して「デザイン」と呼ぶわけですが、デザイナーも総括した存在ではありません。インタラクションデザイナーはグラフィ
ミニマリズムUIの課題と対策
実世界のオブジェクトのような質感を UI に加えることで、使いやすさを向上させるアプローチは 親しみやすさを生み出すことから、インターフェイスデザインによく採用されるようになりました。これとは別にアプリの UI デザインでよく見かけるのが、モダニズムを彷彿させたミニマムなデザイン。装飾を最小限に抑え、グリッドで整理された見せ方になります。 代表的なのが Flipboard や Pulse のようなニュースリーダーアプリ。Textdeux や Sparrow といった仕事に使えるアプリでもミニマムなアプローチをよく見かけます。Instapaper や Read it Later は、すべての Web サイトをミニマリズムに再現できるアプリで、これらも高い支持を得ています。 もちろん、アプリデザインだけではありません。Windows Phone 7、Windows 8 で採用されている Met
楽天から学べる日本的なWebアプローチ
学べるところが多い楽天ページWebデザインに関わる様々な情報やノウハウが世界中で共有されているとはいえ、お国柄は存在します。Yahoo!でも、世界共通にみえる UI コンポーネントがありますが、アメリカと日本と中国ではアプローチが異なります。情報にメリハリをきかせているアメリカ。今の話題を中央にたくさん詰め込めるように工夫してある日本。クリックをしなくても膨大な情報を消化することができる中国。ポータルサイトをひとことで言ってもやり方がいろいろあることが分かります。 各国の Yahoo! を見て「欧米はシンプルなのに、日本や中国はなんかごちゃごちゃしている」と感じた方はいるかもしれません。なぜそんな小さなところに情報を詰め込むのか、なぜページを整理しなのか、メッセージを絞ってメリハリをつけないのか、といった悩みを抱えるデザイナーもいるかもしれません。 日本らしい忙しいデザインの代表例としてよ
公共機関が必要なのはWebサイトではなく配信チャンネル
佐賀県武雄市が市のページをFacebookへ移行することで話題になっています。ニュースは「市長がはまっている 佐賀県武雄市、市のページをFacebookに完全移行へ」というキャッチーなタイトルが付いていますが、現在の Web サイトの情報は今後アーカイブとして残るみたいですし、会員登録をしなくても Facebook の情報は観覧出来るので、利用者・住民には大きな隔たりはないかもしれません。 公共機関が Facebook を中心とした活動をする、というのは武雄市が最初ではありません。インド デリー市の警察署は、住民から交通ルール違反をしている車・バイクの情報を募集しています。摘発した乗用車の登録番号を発表して、活動を随時知れるようになっています。 日本フェイスブック学会というグループを立ち上げるなど、武雄市は Facebook 熱が高いのでこうしたアプローチをとったという考え方も出来ますが、
デザイン、コード、マルチスキルの世界と私たち
比較は実はナンセンス デザイナーはコードが書けたほうが良いのか？ ハイブリッドなのか専門家なのか・・・長く議論されてきているトピックのひとつです。Webデザインの分野でもデザイナーは HTML / CSS / JavaScript くらい出来た方が良いのでは？という意見がありますし、最近では UI デザイナーが Object-C や Java を学んだほうが良いのでは？という意見もあります。 デザイナーがコードの領域に踏み込めるようになることで、インタラクションや画面遷移など、見た目だけでなく細かい動きの制御の設計に直に触れることが可能になります。コードから物事が見れるようになることで、初めて視覚化・具体化できるアイデアもあるでしょう。では、コードも書けるハイブリッドデザイナーのほうが優れているのかといえば、答えは「YES」であり「NO」でもあります。多くの技能をもつということは、何でも屋
WD101: Webは見た目のコントロールがきかない
このシリーズでは Web Design101（WD101）と名付けて、ウェブデザインをより深く理解するための最初の一歩になる知識やノウハウをコラム形式で紹介していきます。 DTPという名の足かせ Webデザインはよくも悪くも DTP のノウハウを受け継ぎながら徐々に成長してきた領域です。今でも根強く残っている「ページ」という概念。タイポグラフィ・グラフィック・レイアウトなど DTP が培ってきたノウハウは CSS と HTML （ときどき JavaScript）を使って再現されたりしています。DTPの概念とノウハウがなければ Dreamweaver のようなソフトは生まれなかったでしょうし、Dreamweaver のようにコードを手打ちしなくても DTP 感覚で Web デザインに入り込めるソフトがなければ、Web デザイナーを職業とする方もこれほど増えなかったかもしれません。 しかし、D
Webデザインにある駆け引きとコダワリ
Webは人とデータに開放された世界 電子書籍の登場で、再び DTP デザインと Web デザインが比較されることが増えてきた印象があります。もちろん以前から「DTP デザインの呪縛」のようなものが Web デザインの世界で長く受け継がれています。随分 Web に最適な手法が盛り込まれているものの Dreamweaver のような老舗アプリは「DTPデザイナーでも Web サイトが作れる」というコンセプトが今も残っています。Webデザイナーは表現の仕方の違いからフラストレーションをためている方もいると思いますし、発注者側も DTP と Web の違いを伝えてもらっていないことからコミュニケーションに困っている場合もあると思います。 紙には物理的な境界線があることから情報量に限界がありますが、完全に隔離された世界を作ることができます。その世界は紙という媒体によって完全に守られていて、デザイナー
デザインについて語れる批評をするコツ
批判ではなく批評 個人プロジェクトでない限り、公開前に誰かにデザインを見せる機会があると思います。相手はクライアントかもしれませんし、同僚・上司なのかもしれません。デザイナーの中には見せるのを躊躇している方もいるのではないでしょうか。知恵とスキルを出し切って作り上げた子供のような存在なので、万が一批判されたのであれば自分自身も批判されているように感じるのではないでしょうか。IDEOの Time Brown 氏が TED の講演で「デザインはデザイナーだけに任せるには重要過ぎる」という言葉を残しているとおり、デザインを皆で考える機会を作るべきです。デザイナーは早い段階から他の誰かとアイデアを共有するべきですが、会話が批判的なものになりすぎているのであればデザイナーも積極的に参加もしてくれませんし、デザインを前提とした会話にはならないでしょう。 「この色は違う」「使いにくそうだ」「分かっていな
直感を殺した効果測定崇拝は止めよう
宗教になった効果測定 昔、Webデザインは直感・経験・感性のみで作られていました。しかし、低価格・無料のデータ解析ツールが登場したことにより、より多くのサイトがデータ解析をサイトの成果測定に利用するようになりました。従来はページビューという大まかな数でしか価値を測定することが出来なかったわけですが、その場にいる利用者の姿も徐々に見えてくるようになりました。現在はページビューだけでなく滞在時間、訪問頻度、コンバージョンなど様々な要素を効果測定要素として取り上げるようになりましたし、それらを基に改善のプロセスが組まれるようになってきました。 ビジネスを考える上において、直感・経験・感性に行き過ぎていた従来の Web デザインは不十分な存在でした。そこで効果測定を積極的に取り入れようという動きが生まれたわけですが、今度は効果測定が『宗教化』してしまい本質を奪ってしまう場合も出て来ています。 効果
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
