スタッフブログ BLOG

＞一覧へ戻る

	5月 2022
月	火	水	木	金	土	日
	1
2	3	4	5	6	7	8
9	10	11	12	13	14	15
16	17	18	19	20	21	22
23	24	25	26	27	28	29
30	31

最近の投稿New

カテゴリーCategory

アーカイブ Archive

・2022年1月(1記事)

人気記事ランキングRANKING

2020/02/27

そんな考え方があったのか…切り抜き写真の使い方

渡久地

こんにちは！デザイナーのバンクです☺

ブログの番が回ってくるたびにもうそんなに日にちが経ったのかとしみじみしております。早いですね。

日々先輩デザイナーズからいろんなアドバイスやご指摘をいただきながら成長している（はず）な私ですが、その中でも特に印象に残ってる切り抜きについてご紹介します！

—————————————————————————————————————-

まずは印象に残っているカリスマデザイナー鈴木さんのお言葉がこちら…

「切り抜き写真は飛び道具みたいなもん」

（どーん）

鈴木さんと会話をしていると何言ってるんだろうと思うことは日常茶飯事なのですが、この時も「はい？」ってなりましたね。

しかし説明を聞いてみたら「なるほどそういう考え方の元切り抜き写真を使ってるのか」と非常に勉強になりました。

まず私が切り抜きを使ってこんな感じにレイアウトしていたんです。

これを鈴木さんに確認していただいたところ、

切り抜き写真がもったいない！！と声を大にして言われまして。

以前ブログで写真の使い方3パターンをご紹介したのですが、

その中の一つである切り抜き写真は、デザインに簡単に立体感を作ることができる超素晴らしアイテムだったんです！

この私のデザインを参考に説明すると、

女性の切り抜きをちょっと上に出して調整してみるだけで…

これだけで平面ぺちゃんこデザインに奥行きを出すことができました！非常に便利！

こうやって切り抜きを飛び出すような使い方をしてリズムを作ったり、目線が引っかかるところを意図的に作れるようになるともっとユーザーさんが見やすいデザインができるようになりそうです！

確かになんとなく無意識にこういった表現をしている時がありますが、わかっててやるのとじゃ全く違うので、何事にも意味をもったデザインをするべきですね。

特にレイアウトに引っかかる部分がなくてさら～っと流し読みされてしまいそうなときにこの飛び道具作戦は有効そうです。多様注意ですが！

といいつつ覚えてから私は結構多用してます。

画像にかぶせてみたりとか

バナーから飛び出してみたりとか

ただここで注意点が一つ！！

特にバナー系で飛び道具を使っていて、隣に普通のバナーが並んでいるとき

飛び出している部分を含めてmargin paddingやらの装飾ががかっかってしまうことをお忘れなく！私はよく忘れます！コーディングのことも視野に入れてデザインしなくちゃですね。

私はコーディングのことはまだまだ疎いので詳しいことは言えませんが、「左のバナーだけ数ピクセル高さが合わないなんで！！」と悩んでたらこういう飛び道具シリーズが原因だったことがたまにありますm(__)m

それと似たような要素だとアルファベットにも要注意！

g・y・j・pなどの下にはみ出る系のアルファベットは、上記のバナー同様はみ出している部分も含めて装飾がかかるでちゃんと把握しておくことが大事ですね～気を付けましょう※※

話がそれましたが、

飛び道具系切り抜き写真シリーズはうまく使いこなすと立体感が出で飽きないデザインになる！

使いこなして奥行きのあるデザインができるようになりたいです◎

それではまた次回！

Bye Bye 🙂
カテゴリ: