57
5分でわかる! 本書の見どころ・ 読みどころ

「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

Embed Size (px)

DESCRIPTION

「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころを面白おかしくまとめたスライド・プレゼンテーションです

Citation preview

Page 1: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

5分でわかる!本書の見どころ・読みどころ

Page 2: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

一言でいうと:

レスポンシブWebデザインの基礎が正しく学べる本Image by Vectorportal (flickr)

Page 3: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

たくさんある「見どころ・読みどころ」の中から

つをご紹介します!3Image by Anderson Mancini (flickr)

Page 4: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

#1考え方、方法論、実践ノウハウの

3つを網羅

Image by Sunfox (flickr)

Page 5: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

レスポンシブWebデザインはごく一般的な、普通の制作方法になる

Image by jdhancock (flickr)

CSSでのレイアウトが一般化したように、

Page 6: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

その第1歩を正しい方向に進めるために

Image by divya_ (flickr)

Page 7: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

Image by Sufox (flickr)

「考え方」「方法論」

「実践ノウハウ」の3つの基礎を

Page 8: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

Image by Sunfox (flickr)

できるだけ中立な視点から、解説した本です。

Page 9: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

考え方> なぜ、いまRWDが必要なのか> 名称に込められた意味とは?> どんなメリット・デメリットがあるのか> など

Page 10: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

方法論1. 技術的な手法についての解説

Page 11: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

方法論1. 技術的な手法についての解説 > メディアクエリ > フレキシブル・グリッド > フレキシブル・イメージ > パフォーマンスの最適化

Page 12: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

方法論1. 技術的な手法についての解説2. 制作ワークフロー

Page 13: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

方法論1. 技術的な手法についての解説2. 制作ワークフロー > アジャイルな制作 > プロトタイプ中心の制作 > パターンライブラリ > など

Page 14: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

実践ノウハウ

Page 15: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

実践ノウハウ> 約半年かけて調査・検証

Page 16: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

実践ノウハウ> 約半年かけて調査・検証> リアルのプロジェクトで採用

Page 17: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

実践ノウハウ> 約半年かけて調査> リアルのプロジェクトで採用> 1年以上運営してきた実績

Page 18: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

実体験を伴う、「実践ノウハウ」を紹介

Page 19: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

この一冊で

Page 21: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

#2「なぜ」の部分に重きを置いている

Image by Ian Mutto (flickr)

Page 22: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

細かいテクニックはウェブで探せる時代

Page 23: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

なぜ、いまレスポンシブWebデザインが必要なのか

Image by fboyd (flickr)

Page 24: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

昨今のウェブの時流をひも解きつつ説明しています

Page 25: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

iPhoneから始まったスマホの波

Image by originalgoast (flickr)

Page 26: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

モバイル・メインの日も近い

Image by adactio (flickr)

Page 27: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

フューチャー・フレンドリー

Page 28: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

フューチャー・フレンドリーモバイル・ファースト

Page 29: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

コンテンツ・ファーストフューチャー・フレンドリーモバイル・ファースト

Page 30: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

コンテキスト

コンテンツ・ファーストフューチャー・フレンドリーモバイル・ファースト

Page 31: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

シームレスな体験

コンテキスト

コンテンツ・ファーストフューチャー・フレンドリーモバイル・ファースト

Page 32: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

などといった、カタカナでよくわからないことも

Page 33: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

噛み砕いて、わかりやすく解説しています

Page 34: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

Image by fboyd (flickr)

この本には、「なぜ」の部分をしっかり考えるきっかけが用意されています。

Page 35: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

#3ウェブ制作の

未来について語っています

Image by jdhancock (flickr)

Page 36: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

未来と言っても...

Page 37: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

アジャイルで行きましょう

Page 38: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

Designing in the Browserを活用しましょう

Page 39: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

プロトタイプを活用しましょう

Page 40: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

Webデザインとはなにか?見直してみましょう

Page 41: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

パフォーマンスの最適化を心がけましょう

Page 42: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

そんなことです

Page 43: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

が!

Page 44: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

おおげさに言うと...

Page 45: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

この本は、筆者からの変化のためのメッセージです

Image by littlebiglens (flickr)

Page 46: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

Image by littlebiglens (flickr)

モバイルが主流になった「ウェブ」では、

「制作」が変わる必要がある

Page 47: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

そんな変化の必要性を、感じていただける内容になっています。

Image by joecrimmings (flickr)

Page 48: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

そして、

Page 49: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

ウェブを本来の柔軟な形に

Image by dollen (flickr)

Page 50: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

ウェブ制作をもっと楽しくする

Image by tostie14 (flickr)

Page 51: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

レスポンシブWebデザインという

「哲学」の基礎を学べる内容になっています

Image by goulao (flickr)

Page 52: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

この本の

つの「見どころ・読みどころ」3Image by Anderson Mancini (flickr)

Page 53: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

#1考え方、方法論、実践ノウハウの

3つを網羅

Image by Sunfox (flickr)

Page 54: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

#2「なぜ」の部分に重きを置いている

Image by Ian Mutto (flickr)

Page 55: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

#3ウェブ制作の

未来について語っています

Image by jdhancock (flickr)

Page 56: 「レスポンシブWebデザイン 制作の実践的ワークフローとテクニック」の見どころ・読みどころ

そんな本です