BLOG2017.01.30WEBデザインをIllustratorからPhotoshopに切り替えた時、気になったポイント初めまして、10月からプラカンの一員になりました、デザイナーのKIKUCHIです!文章を書くのは苦手ですが精一杯頑張ります!世の中のWEBデザイナーさんの制作環境が気になる今日このごろ。Illustrator」で制作していました。Photoshop」となり(郷に入っては郷に従え、ですね...)初めは凄く戸惑いました。そこで、WEBデザインをPhotoshopで制作する上で気になった点や便利だなぁと思った点を備忘録として記事にしたいと思います。Illustratorのように直感的に操作したいまずPhotoshopを使用する上で一番使いにくいなぁと思っていた点が、レイヤーパネルから対象のオブジェクトを探してレイヤーを選択してからでないと、通常では移動が出来ないこと。Illustratorのようにクリックして移動して拡大して~といった操作が瞬時に出来ないことが耐えられない!どうすればいいんだ!解決法~~移動ツールを選択した状態でツールバーにある「自動選択」にチェックを入れ、選択したいオブジェクトをクリック!移動!キャー動いた!右側にあるプルダウンでは「レイヤー」か「グループ」を選択でき、レイヤーを選択した場合は、一つ一つのレイヤーを選択でき、グループを選択した場合は、グループ化されたフォルダを選択できます。左クリック」で対象のオブジェクトを選択することも出来ます。2015から使えるようになっていたのですね!アートボードとはアートボードは、さまざまなデバイスやスクリーン用にデザインをレイアウトできる無限のキャンバスが用意され、デザインプロセスを効率的に実行できます。出典:https://helpx.adobe.com/jp/photoshop/using/artboards.htmlパソコン用の画面、タブレット用の画面、スマホ用の画面...様々なデバイス向けのレイアウトをより効率的に制作するためにアートボードを活用しましょう!ということですね。あるレイヤーフォルダを一気に閉じたいIllustratorで制作していた時は気にならなかったことですが、Photoshopではレイヤーが増えていく過程でグループ化していると、グループ内のオブジェクトを選択した時にフォルダが開いた状態になります。フォルダが開いた状態でレイヤーパネルが見にくい!これを一つずつ閉じるの面倒くさい!なんてことが多々あると思います。Alt」を押しながらクリック!これだけで全てのフォルダを閉じることが出来ます(逆パターンで全てを開くことも出来る)。中のフォルダもあら不思議!閉じてます。デザインをPSDデータごと納品したり、コーディング担当の方にパスする時は、レイヤーが整理整頓されてる方が気分がいいと思うタイプなのでこれは凄く便利です。レスポンシブデザインを実機で確認したいIllustratorで作成していた時は、スマホ用のレイアウトを作成したら画像として書き出して、メールで画像を送って、スマホでメール(画像)を確認して、という流れで実機での見栄えを確認していました。2015から搭載されたデバイスプレビュー機能で解決出来ます!現時点でこれはIllustratorにない機能なのでとても感動しました。使い方については、下記参考ページがとても分かりやすく書いてあるのでそちらをご確認ください。2015では今開いているPSDがリアルタイムにiPhoneで確認できるぞ!最後にWEBデザインを作成する際にIllustratorから入った自分としては、Photoshopは使いにくいと思う存在でしたが、Adobe様が少しずつ便利機能を増やしてくださるおかげで使いやすいかも...!と思い始めています。ここはIllustratorの方が使いやすいわ~と思う部分もあるので、少しずつ慣れていくしかないようです。Illustratorこの記事は1年以上前の記事で内容が古くなっている場合があります。【CSS】今更ながら、フレックスボックスの使い方をまとめてみた。