クライアントワーク（写真撮影、写真加工）、ナビゲーションの作成

４月１５日金曜日にクライアント様の方へ行き商品の写真撮影をしてきました。
・機材
一丸レフカメラ（RAWデータでの撮影）
三脚
デスクライト（白いビニル袋を被せて直接光が当たらないようにした）
デジカメ（商品情報撮影用）

・気をつけた点
ケーキをなるべく引き立たせるために、逆光で撮影した。

・用意の段階で迷ったこと
お店の食器類がアンティークで柄のあるものなのでケーキを引き立たせてとれるかどうかが不安だった。
前日にケーキを持参した白皿とお店のお皿の両方で撮影したところ、お店の皿でも十分綺麗に撮影できたので撮影はお店のお皿でした。

撮影した写真例

ケーキのページのレイアウトは幅９６０pxの中央寄せのコンテイナーの中に画像サイズ300pxでマージン１０pxのfloat:left;にしようと思います。
なので、商品画像は幅高さ300pxでライトボックス表示時にはケーキとクッキーは幅高さ500px、ホールケーキは幅700px,高さ５００pxの大きさに加工しました。

写真の数が多いのでall,ケーキ、焼き菓子、ホールケーキのカテゴリーに分けてframeworkで表示できるようにしました。

＊ナビゲーションの作成
クライアント様の要望が可愛いサイトなので今日はナビゲーションを柔らかい感じでサンプルとして作ってみました。

・ナビゲーションの背景も丸くぼやけた感じにしたいので角丸四角ツールで角の丸い四角系を書き、効果→スタライズ→ぼかしで以下の手順で加工しました。

・文字を丸くするために、文字を選択した状態で効果→パス→パスのオフセットで１度目は-0.5px,２度目は0.8pxでラウンドをかけました。
ちなみに元の文字は24pxのArialです。
詳しくは下記参照
blog.nest-online.jp

途中経過