6/2(Fri)
2014/10/30
【WEBデザイナー学部メルマガ】
今回のテーマは「WebデザインにまつわるよくあるQ&Aとオススメツール」
前回の授業、『書体や色のイメージで表現！「Webデザインアイデア」の膨らませ術』でよせられた質問にイシジマ先生が回答していくメルマガ企画です。
最後にはアシスタントのコソバさんがWebデザイナーを目指す人に、オススメの作業効率化ツールを紹介してくれます。
このツールをダウンロードして、次回のイシジマ先生の授業に備えましょう！
イシジマ先生とは？
WebデザインにまつわるよくあるQ&A
Q. イシジマ先生の好きな書籍はありますか？漫画とかでも良いのですが、書籍からデザインを貰おう！などはありますか？(M.S)
A. デザインに役立つ本はかなり多く、その中でもピエ・ブックスのデザインギャラリー書籍は本当にお世話になりました。インターネットで検索しようとしても、かなり詳しくないと見つけられない良いデザインを、広告・DM・名刺・Webサイトなどテーマを分けて出版しております。
駆け出しの頃は、この書籍を読んでたくさん真似しました。デザインのサンプルカタログでもあり、物言わぬ師匠であったので、いまだにチェックしている書籍たちです。
Q. ランディングページなど作る時に、先生のブログに書いてあったのですがPhotoshopでスライスして、そのままドリームウィーバーでコーディングすると書いてあったのですが、他にスライスする時に良い仕方などありますか？(T.Y)
A. Photoshop CCから実装された「画像アセット」は非常に便利です。
書き出したいレイヤーに「image.png」などと拡張子を付けて命名するだけで、PSD保存時に毎回画像を書き出してくれます。 書き出し場所を選べないのが少し勿体ないですが、かなり便利ですよ。
それ以前のバージョンではPhotoshop エクステンションのCut&Slice meがありますのでこちらを利用すると良いでしょう。
わたしはMacユーザーなので問答無用でSlicyを使っています。こちらも機能は同じなのですが、書き出し先をチョイスできるので重宝しています。
Q. WEBデザインする時に、ピクセル数を、どのように計算していますか？(T.Y)
A. PhotoshopやSketch場合は10px単位のグリッドを使っていますね。なるべくグリッドからはみ出すようなことがないようにビジュアルや配置を行うことで、グリッドのコラムを数えれば何pxで余白をとっているのかが分かります。
Illustratorの場合はさらに、移動ツールを選択しているときに[Enter]キーを押すと数値移動ができますので、そちらで任意の移動をさせます。
コソバの爆速ツール紹介
アシスタントのコソバです。
前回の授業『書体や色のイメージで表現！「Webデザインアイデア」の膨らませ術』はいかがでしたか？
私も初めてサイトをデザインしたとき、どぎつい色を使いすぎて90年代初期のサイトのようなデザインしか作れなく、泣いた夜がありました…。
なのでコメントにもあった「色を決めるのが怖い！！」という気持ち、痛いほどわかります。
しかし、今回の授業でもあったように「なぜ？どうして？」と、理論的に考えて色を決めていくことで色に対する恐怖めいたものは授業で克服できたのではないでしょうか？次の授業も楽しみにしていてくださいね。
理由を考えながら色を決めるのはわかったけど、まだまだ色が怖いよう！という方に、おすすめのツールをご紹介します。
・(un)clrd（cromeの拡張アドオンです）
https://chrome.google.com/webstore/detail/unclrd/pjahllgfmfgobhbkjiaohonjejpnkfkh
見ているWebサイトを白黒で表示してくれるアドオンです。
イシジマ先生のお話にもあったように、色を使うのがまだ怖い方はデザインを白黒で作成してみてもいいと思います。
元々はコントラストを見るためのツールですが、「このサイトをもし白黒で作った場合はどうなるのかな？」といった参考にもなるのでおすすめです。
フォント選びはまだまだ悩む…という方におすすめなのは、
・WhatFont（こちらもcromeの拡張アドオンです）
https://chrome.google.com/webstore/detail/whatfont/jabopobgcpjmedljpbcaablpmlmfcogm
こちらをchromeに追加し、ボタンを押すだけであら不思議。使用しているフォントがわかってしまいます（テキストのみですが）。
「このフォント好きだな」と感じたフォントをCSSを覗くより早く調べられます。
色にしてもフォントにしても、憎しみや恐れを感じるより愛することが重要かなと思ったコソバでした。
最後に、私宛の質問が一つあったので、答えたいと思います。
Q. こそば流のデザイン作成方法はありますか？(M.S)
A. こそば流、と言えないかもしれませんが今までデザインの方向性で苦労したことが多い分、ヒアリングは大切にしています。
イシジマ先生の授業でもあったように「なぜその色、そのデザインなのか？他のものではだめなのか？」を常に問いかけるようにしています。
相手の要望がぼんやりしたまま制作を始めてしまうと、無限修正地獄に陥ってしまい、お互いに納得いく仕事ができないと思っています。
あとは小さなことで悩んでしまう癖があるのでパーツの色や形で悩みすぎず、まずはできるだけ手を動かすことを心がけています。
木を見て森を見ず、になってしまうと時間が無駄にかかってしまうだけなので。
これから開講されるイシジマ先生の授業はこちら
イシジマミキのデザインレビュー！あなたのデザインをもっと良くする方法①【デザインアプローチ編】
考える順番や最新のテクニックを見たけれど、まだ足りない気がする…。
実際の作業ではやっぱり迷うこともたくさん。
と困っているアナタに向けて、実際に寄せられたデザインのデータと原稿をもとにイシジマ先生がレビューをする連続授業です。
作品を作ることはとても重要ですが、レビューをしてもらうことによって成長スピードが3倍増になります！
過去に作った作品などがありましたら
「kadai@schoo.jp」宛に下記を明記し送ってください。
* 過去に作ったもの
* お名前（ペンネーム、イニシャル可）
* 作品の原稿 (クライアントからの依頼内容だけでもOKです)
締切は 10月31日0:00まで！
