photoshop バナートレース #14『ファミマカフェ・ロイヤルミルクティー』

Design

こんにちは!

ななふ@na2factoryです。

【バナートレース14回目】になります!

今回は、BANNER LIBRARYさんで見つけた

ファミマカフェ・ロイヤルミルクティー』のバナートレースをします!

ロイヤルミルクティーなんですが、カフェラテにも見えます(;´∀`)

ラテアートができそうな写真ですね(^^♪

スポンサーリンク

#14 オリジナルとトレース画像

トレース画像のお皿の柄がカジュアルな為、見本の高級感から遠のいてしまいました。

食器の柄って重要ですね。

そして、さりげなくミルクティーの湯気が描かれているのを忘れそうでした(・・;)

さりげない部分のこだわりがプロですね。

#14 制作の振り返り

参考バナータイトル:ファミマカフェ・ロイヤルミルクティー
参考バナーのサイズ (幅 x 高さ)(px):800 x 450

制作にかかった時間:4時間

使用したフォント

  • Royal Milk Tea:Rosarivo
  • ふわふわミルクの紅茶の味わい。:DNP 秀英角ゴシック金 Std (※見本の”ふ”のフォント、無かった!)
  • ロイヤルミルクティー:DNP 秀英横太明朝 Std
  • 数量 限定:HGS明朝E
  • ※一部の地域~イメージです。:”※”はメイリオ、他はDNP 秀英角ゴシック金 Std

素材情報

  • ファミマカフェの紙カップと紫色のテーパック?は見本の切り抜きです。
  • ミルクティー、お皿、茶葉:写真ACさんよりDLして加工

考察

デザインについて気付いたこと

ターゲットは女子?

ロイヤルミルクティーについて、私の中では凄く甘いイメージがあるのですが、、、

自動販売機で売っている紅茶花伝の味の印象がそうだからか、、、凄く甘いので、あまり男性受けしなそうな印象です。

このファミマカフェの商品はどうだったんでしょう?

バナーの写真を見る限り、ふわふわミルクは甘そうなイメージです(#^^#)

この商品のターゲットはやっぱり女子ですかね?

高級感

バナーの色合いが紺色中心で、お皿の柄が高級食器メーカーっぽい。

”数量限定”のシールで、すぐ無くなってしまいそうな気になる!

フォントも崩した感じはなく、落ち着いた雰囲気にまとまったバナーですね。

私もこのバナー見たら買ったかも!

苦労した点

ラテの加工

真上から見たラテの写真の素材を探しました。↓こちらが素材そのまま。(切り抜きが下手すぎる!)

見つけた写真の元の色味がだいぶ濃くて見本と異なっているので、レイヤー効果で調整。

カラーオーバーレイ、光彩(内側)、サテンを色々いじって見本に近づけました。

そして、見本と同じようにお皿に影を付けるドロップシャドウも追加。

カップについているちょっとした汚れ?とびはね?はブラシで修正しました。

↓加工後です。だいぶ色がミルクティーぽくなりました(⌒∇⌒)

見本と同じような柄のお皿探し

見本のお皿の柄って、ロイヤルコペンハーゲンとかウェッジウッドとか連想する柄ですね。

写真ACさんで検索していて、どうもその部類のいい感じの写真に巡り合えなくて。

白のみのシンプルな食器か、今回使用した柄有りかで迷いました。

柄がちょっとカジュアルだけど、白のみより雰囲気が似るかな?と、柄有りを選択。

素材そのままだと色が違うので、レイヤー効果(カラーオーバーレイ)で加工しました。

結果、やはり完成して見本と比べるとカジュアルさが気になってしまいますね。(・・;)

Royal Milk Teaの周りのリーフの絵柄

Royal Milk Teaのテキストを囲んでいる白色のリーフと線。

ペンツールで見本をなぞって描いています。ちょっといびつです。

Teaの隣のリーフの絵は、シェイプツールで描きました。

シェイプツールの方が描きやすかったので全部シェイプツールで書けば良かった…

今後はイラストを描く方ももっと練習していかねばです。

背景の加工

上の紺色と黒のグラデーション部分と、下の白にうっすらまだらな青の2か所ですが、

フォトショのデフォルトで入っているパターンを使って作りました。

簡単にできそうでできない感じでちょっと時間かかってしまいました。

特に下の白い方、、、、うっすら過ぎて良く見えないんですもの。

でもこのうっすらとした感じが高級感を醸し出す要素だろうと思うので、のっぺりとした白色だけで済ますわけにはいかないですよね!

結果、白い背景の方はちょっとやり過ぎな感じになってしまいました(-_-;)

上手くできた点

数量限定の丸シール

シェイプツールで作ってます。

土台の紺色の円を描き、その上に線のみの白色の円、点線の白色の円を重ねています。

点線の白色の円は、パスで描いた円をブラシで境界線を描いています。

ブラシの設定を適当に点線になるように合わせただけで描けました!

今後の課題

正直、もう少し速くできるのではないかと思ってました。

終わってみれば4時間…。まだまだです。

デザインについて、もう少し自分だったらどう作るんだろうという視点で考えながら制作しようと思います。

今回はなんだか、高級感というイメージをうまく出せなかったので…。

 


では、以上になります。ありがとうございました!

Design
スポンサーリンク
この記事をシェア!
na2factoryをフォロー
Webデザイン勉強中

このサイト、
Na2 factory(なな ふぁくとりー)を運営している
"ななふ"と申します。

40代からのWEBデザイナーへの道!
少しづつステップアップしていきたいです。

このサイトでは、自分が覚えた事、
テクニック等を詳細に紹介していきたいと思います。
これからWEBデザイナーを目指す方々と
情報共有できたら嬉しいです!

約2.5か月かけて(^^;photoshopでのバナトレ30本達成できました!
さらにその倍ぐらいの時間をかけて、
illustratorでもバナトレ30本達成~!!
現在はXDとコーディング勉強中!

詳しいプロフィールはこちら

na2factoryをフォロー
Na2 factory

コメント

タイトルとURLをコピーしました