ひとかわむけるブログ

デザインと日常に関して、意識を高めて行くためにブログを書いていきます。

【感想】書籍「アイデアのつくりかた」を読んでみた。

アイデアのつくり方読書感想


最近悩んでいることの一つに、「デザインの案出しが遅い」ことがあります。
その悩みについて、デザイナーの先輩に相談したところ「アイデアのつくり方」という本をオススメしてもらいました。
 

書籍「アイデアのつくり方」とは

「アイデアのつくり方(ジェームス・W・ヤング著、今井茂雄訳、竹内均解説)」は、日本では1988年の初版から私が購入した中古2010年版まで60刷ほど刷られています。現地では1965年から刊行されているので、とても息が長い本でした。
実はこの本、新人の頃に買って一度読んだはずなのですが、読みっぱなしにしたので内容の細かなところはほとんど思い出すことができませんでした。ページを数ページめくると、かろうじてアイデアは掛け合わせだということだけが思い出せました。
よく本屋で売っているアイデアの作り方系の本は、種類が多く本当に効果があるのかわからず手を出しづらかったのですが、こんなに薄い上に色々な人やお店からオススメされるので購入をしていました。
 
ハードカバーで少し厚みは増していますが、ページ数は全部で100ページ弱。解説を省いた、作者が書いた部分(翻訳部分)だけを数えると、60ページほどしかありません。
初めて手に持った時は薄さに驚きました。
帯には「60分で読めるけれど一生あなたを離さない本」と書かれていて、1ページ1分かけて読んでも60分で読み切れてしまいます。
新しい装丁の本も何冊か出ているようで、新デザインには帯の「60分で読めるけれど一生あなたを離さない本」が本自体に印刷されていました。
 
まえがきやあとがき・解説を省いた目次はこちら
  • 経験による公式
  • パレートの学説
  • 心を訓練すること
  • *既存の要素を組み合わせること
  • *アイデアは新しい組み合わせである
  • 心の消化器官
  • つねにそれを考えていること
  • 最後の段階
  • 二、三の追記
(引用:アイデアのつくり方(ジェームス・W・ヤング著、今井茂雄訳、竹内均解説)
この一覧の「*」がついているところは帯にも書かれている通りこの本の本質になります。といっても、無駄な部分がほぼないので、この目次全てが言いたいこと、大切なことなのだと思います。
 

イデアは既存のもの同士の掛け合わせ

イデアのつくり方の内容は、
イデアは既存のもの同士の掛け合わせで、そのアイデアを生み出すための方法やインプット・アウトプット方法がまとめられています。
新人時代に読んだ際は、ふ〜ん。へ〜。と知識として読んだ(つもりでいた)のですが、仕事やアイデアを出す経験が少なく、当時は定着はしませんでした。それに、こう言った本の読み方がよくわからず、読んだら読みっぱなしの状態でした。
 
何年かして、実際にアイデアを出したり、日頃の情報収集やインプットをする機会が増えると、本の言っていることがわかるようになってきました。
薄い本の中に必要なことだけが書かれているので、読んでとりあえず書かれていることを実践するだけで良いと思います。
 

イデアをつくるための5ステップ

  1. 一般的資料、特殊資料集め
  2. 咀嚼、資料に手を加える
  3. ちょっと離れる
  4. イデア発見
  5. イデアを具体化させる
(引用:アイデアのつくり方(ジェームス・W・ヤング著、今井茂雄訳、竹内均解説)
 
デザインに当てはめるとこうかな、と思った内容が…
  1. 特殊資料:アイデアを考えたいものに関しての情報収集。一般資料:日常的に書籍、サイト、デザイン情報、デザインと関係ない情報、街中、ニュースその他あらゆる外からの情報を収集。
  2. 資料を分類、手を動かしてみる、さらに調べる、手を加えるなど
  3. 別の作業、気分転換、日常生活、他のものを見てみる、街を出歩いてみる、人と話すなど
  4. 発見(レイアウト段階)
  5. デザインを詰めていく、クオリティアップ、ディレクター・依頼者との相談
こんな感じでしょうか。
 
 

イデアのつくり方まとめ

書かれている時代が時代だけに、アナログチックな情報収集・整理の方法がいくつかあるのですが、現代でも通用する方法ですしデジタルでもできる方法だとは思います。
カードを使った方法などは、学生時代民俗学の先生がやっていた方法だったということを思い出し、懐かしい気持ちになりました。
 
イデアのつくり方の本の中では、他にも具体的な情報整理の方法だとか、例を交えながらわかりやすくこの5ステップを説明しています。
1回読んで、へ〜そうなんだ〜で終わってしまったのですが、何回かこの本を片手に、実践をして自分のやり方を作り出していきたいと思える一冊でした。

Webデザイン参考サイトまとめ

サイト・ランディングページwebデザイン参考サイト

ウェブデザイン用の参考サイトまとめ

個人的によく使うウェブデザインギャラリー・参考サイト集をまとめて見ました。
探そうと思えばこれよりももっと大量にあるのですが、使い勝手や手軽に見て回れる数には限りがあるので、徐々に増やしていけたらと思っています。
どのサイトも、たくさんのウェブデザインを集めているサイトですが、集まっているwebデザインの内容が微妙に違います。毛色の違うサイトをいくつかブックマークしておくと良いのかもしれません。
 

参考サイト1:webデザイン全般参考

広告・商業色が強いランディングページというよりもコーポレートサイトや、少しおしゃれな商品ページ、ブランディングページ、一般的なサイトが多いウェブデザイン参考サイトをまとめました。

 

MUUUUU.ORG

https://muuuuu.org/

f:id:ickw3:20200719114837p:plain

ウェブデザインの検索方法

  • 取り扱いジャンル別
  • デザインイメージ・要素別
  • サイトカテゴリ別
  • 色別

縦長のクオリティの高いウェブサイトを集めたデザイン参考サイトです。

 

SANKOU!

https://sankoudesign.com/

SANKOU!

ウェブデザインの検索方法

  • Webサイト、LP(ランディングページ)、コンテンツページ
  • サイトカテゴリ別
  • 取り扱いジャンル別
  • デザインの雰囲気別
  • デザイン構造・要素別
  • 動き別
  • 色別

分類が多く、ステキな◯◯という要素をピックアップしたカテゴリや、ページや要素の動きのカテゴリで検索できます。

 

I/O 3000

https://io3000.com/

I/O 3000

ウェブデザインの検索方法

  • 取扱ジャンルのカテゴリ
  • タグ別(デザイン要素・構造別)
  • 色別
  • 年代別
  • シャッフル
それぞれに何件ウェブデザインが掲載されているかの数字と、グラフ付き
文字での検索も可能です。
 
Web Design Clip

https://www.webdesignclip.com/

Web Design Clip

ウェブデザインの検索方法
  • 現在の登録数表示
  • キーワード検索
  • メインカラー・サブカラー検索
  • レイアウト検索
  • 取扱ジャンル別
  • タグ別(レイアウトやいいね!デザイン等)
上のリンクはウェブデザイン用参考まとめサイトですが、ヘッダーに別カテゴリーへのリンクがあり、日本国内、世界、ランディングページ、スマートフォンサイトの参考サイトを見ることができます。
 
81-web.com

https://81-web.com/

81-web.com

ウェブデザインの検索方法
  • 取扱ジャンル別
  • 色別
  • タグ別
検索機能の種類は多くありませんが、サムネイルの下についているプラスマークをクリックすることでお気に入りができるブックマーク機能付きの参考サイトです。
 

参考サイト2:レスポンシブデザイン参考

パソコン版、スマートフォン版両方のウェブデザインが一目で確認できる参考サイトを集めました。最近では、パソコン画面よりもスマートフォン画面でサイトを見る人が増えているようなので、スマートフォンでの優れたデザインも確認できるのが利点ですね。
また、パソコン画面を見ているだけでは思いつかなかったデザインの参考にもなりそうです。
 
bookma!
ウェブデザインの検索方法
  • キーワード検索機能のみ
クマが可愛い参考サイト。キーワード検索機能のみのシンプルな機能。画面も、ブラウザでひらけば2つの画面に表示されたウェブデザインがずっと並ぶシンプルなデザインです。シンプルな分、わかりやすいです。
パソコン、スマートフォン両方のサイトデザインを一目で確認することができます。
 
RWDJP

https://responsive-jp.com/

RWDJP

ウェブデザインの検索方法
  • カテゴリ別
  • 色別
  • 使っている技術別
  • サイトタイプ別
日本国内、スマートフォンタブレット、パソコンの画面でみたサイトのデザインがまとめられているデザイン参考サイトです。スマートフォン、パソコンでの画面表示はよくありますが、タブレットサイズでもプレビューすることができます。
 

参考サイト3:ランディングページ参考

上の2つにあるおしゃれさ、スタイリッシュさよりも、広告バナーの飛び先や一枚ペラのランディングページなど、どちらかというと商業・広告色の強いランディングページが一覧で観れる参考サイトをまとめてみました。
 
LPアーカイブ
ウェブデザインの検索方法
  • カラー別
  • カテゴリ別
  • イメージ別
  • 更新日別
総掲載数表示。ウェブデザインをクリックすると、詳細ページに移りそこから関連ワードのタグを使って別デザインを見ることもできます。また、お気に入り機能で気に入ったデザインをブックマークできます。
 
ランディングページ集めました
ランディングページ集めました
ウェブデザインの検索方法
  • 新着ランディングページ
  • カラー別
  • カテゴリ別
  • 新月
一番上の色がついた四角がカラー別分類のアイコンです。新着サイト一覧には、文字通り新着のサイトが表示されますが、リターゲティングされたようなサイト表示もしているような気がします。
 
イケてるランディングページまとめ

イケてるランディングページまとめ

 
ウェブデザインの検索方法
  • カラー別
  • ジャンル別
  • イメージ別
ランディングページまとめサイトの中では、どちらかというとゴチャゴチャ感の少ないすっきりとしたウェブデザインをまとめているサイトです。上で紹介したウェブデザインの紹介とかぶる部分もあります。
 
 
 

まとめ

今までは必要な時に参考サイトを観て回っていたり、ピンタレストを活用していたのですが、ピンタレストでは最新の情報かどうかがわかりづらいためデザインサイトもチェックするようになりました。
各サイト1日に更新される数は数件のため、たくさんブックマークをして観て回ればいいと思うのですが、一人が短時間で観て回れる数は限られているので、一例としてあげてみました。

はじめまして

 

f:id:ickw3:20200614163124p:plain

 

はじめまして、みかんです。

デザイナーとしてのメモ、勉強、日常、素材、趣味などちょっとしたことをまとめておくメモを作りたいと思い、はてなブログを作成してみました。

初心者でも知っていることを今更知るということも少なくないため、記事作成の意識は低めに。とにかく忘れないためのWebメモとして活用していこうと思います。

ブログ名はもう少し考えて、いい案があれば変える予定です。

少しずつ意識の高いデザイナーっぽいことがかけるようにがんばります。