Output Study!
〜ちょっと変わった勉強会〜「#4 Photoshopレイヤー編」

 

こんにちは。ロジカルスタジオ新人デザイナーのドラゴンです。

当エントリーでは弊社が展開する一石二鳥な勉強会、
Output Study!4回目の様子をご紹介します!

Output Study!とは、業務で得た技術や、外部勉強会などで学んだ知識を発表するロジカルスタジオの勉強会のこと。知識のアウトプットを前提としていることもあり、知識の定着はもちろん、人前で話すスキルも磨けると社内で好評なこちらの勉強会。

今回取り上げるのは「Photoshopにおけるレイヤーの扱い方」についてです。

社内のディレクターで、デザイナー経験もあるゴウさんにご登壇いただき、
「良いデザインデータとはどういうものか」についてお話ししていただきました。

私自身はこれまでレイヤーをあまり意識せずに過ごしてきたので、この機会に、

「レイヤーの効果的な扱い方を身につけよう」

「より良いデザインデータが作れるようになろう」

そんな意気込みをもって、勉強会に参加してきました!

無限に積み重なるレイヤーには整理整頓が欠かせない

 

勉強会の冒頭では、本トピックの鍵となる「レイヤー」のイメージを簡単に共有しました。

「レイヤーとは、透明フィルムのようなもの」

「複数のレイヤーによる組み合わせでデザインは完成する」

Photoshopを使ったデザイン制作の現場では、膨大な枚数のレイヤーを扱うことになります。デザインデータをつくる時は、次に触る人のことも考えて、意識的にレイヤーを整理することが大切だとご指摘いただきました。 

データにふれるすべての方を想定したデータを作るべし

 

では実際にどのような意識のもとで、レイヤーを整理すればいいのでしょうか?
ゴウさんは「データに関与する人」に着目し、次のように話されていました。

「データをみるのはデザイナーだけではない」

「データに関わるすべての人への配慮・思いやりが必要になる」

つまりデザインカンプを作成する際には、デザイナーの目線だけではなく、その先で作業をするフロントエンドエンジニアの目線も取り入れたデータを作成すべきということです。

具体的にはHTMLの文書構造をデザインデータ上で再現することで、フロントエンドエンジニアの方にも理解しやすい、そして作業しやすいデータが作れるとのことでした。

整理されたデザインデータは皆をしあわせにする

 

勉強会が中盤にさしかかる頃には、実際にPhotoshopでデザインされたデータを用いて、レイヤーが整理されたデータと整理されていないデータの比較をおこないました。

同時にデータを作成する際のコツや注意点といった、作業部分の細かいポイントにも言及していただき、勉強になる部分がとても多かったです。

「レイヤーをグループ化する(とはいえ多用しすぎない)」

「作業をしないレイヤーにはロックをかける」

「作業者同士で、どんなデザインデータが好ましいか話し合う」

なかでも私がいちばん感銘を受けたのが、作業者同士のコミュニケーションについてでした。

もちろん「良いデザインデータ」の基準は人それぞれで異なるので、相互の共通理解を得ることは簡単ではないかもしれません。しかし、各々が共通の認識のもとで仕事することができれば、よりスムーズに、そして快適に仕事を進めていけるはずなので、日頃から大切にしたいポイントだと感じました!

遠慮は不要!ざっくばらんな質問タイム

 

そして終盤には、参加メンバーお待ちかねの質問タイム!
内容的に簡単なものから少し専門的なものまで、さまざまな質問が集まりました。

「レイヤー名の変更ってどうやるの?」
→名前を変更したいレイヤーをダブルクリックして直接編集する、もしくは[レイヤー]→[レイヤー名の変更]からできます。

「レイヤー構造はどれくらい細分化すべき?」
→作業者であるフロントエンドエンジニアとの相談にはなるが、目安としては2~3階層くらいまで。データを細分化しすぎるのも、作業に余計な手間を発生させてしまうので良くありません。

「便利なスマートオブジェクトの使い方を教えて!」
→画像などの元データをベクトルスマートオブジェクトとして扱うことで、いわゆる非破壊編集といった、元データに一切手を加えない形でのデータ加工ができるようになります。そうすることで修正などの手戻りに強いデータ作成ができるので、とても便利です。

私自身はPhotoshopの便利機能である「スマートオブジェクト」について質問させていただきました!講師であるゴウさんが、質問をしやすい空気を演出してくださったおかげで、こちらもリラックスして疑問を投げかけることができました!

またこちらの「スマートオブジェクト」については今後の勉強会でも取り扱われるようなので、そちらの開講も楽しみに待ちたいと思います!

おわりに

 

まずは今回ご登壇いただきましたゴウさん、ありがとうございました!

レイヤーを整理することの大切さを、身にしみて体感できる勉強会だったように思います。私自身、レイヤー整理にはかなりの苦手意識がありましたので、これまでのやり方を見つめなおす良いきっかけとなりました!

今後はフロントエンドエンジニアの方との連携も大切にしつつ、双方にとって「良い」デザインデータを作れるように日々精進していきます!

以上、Output Study! 」4回目は「Photoshopレイヤー編」をお届けしました。
今後も定期的に勉強会を開催し、その様子を発信していきますのでご期待ください。

またロジカルスタジオでは、共に働く仲間を募集しています。
興味を持っていただけましたら、採用サイトからのご応募をお待ちしております!

ロジカルスタジオ 採用サイトはこちら