Hiromi Shibai Portfolio Site
Concept
ヘッドスパにこだわっているヘアサロンという設定で制作した架空サイトです。
MetaSliderを使って上部には大きなスライド写真でどんな施術をしているかわかる写真を使用し、下部は小さな写真でヘアカタログのギャラリーを作りお客様の参考になる写真をスライドしています。
中央にはこだわりの製品等のページへ飛ぶリンクをつけて詳細を見れるようにしています。
【サイト名】
Hair Salon ～Lutella～
【ページ内容】
HOME
CONCEPT
MENUーORDER MADE
HEAD SPA
ORGANIC
HAIR CATALOG
STAFF
SHOP INFOーRECRUIT
COUPON
【使用ツール】
Adobe Photoshop CS6
Adobe Illustrator CS6
WordPress
【テーマ】
STINGER PLUS2
【プラグイン】
MetaSlider
【制作期間】
１ヶ月
【URL】
Concept
テンプレートからHTML・CSSを使い作成しました。
奈良にある12匹のかわいいネコちゃんがいる猫カフェという設定で制作した架空サイトです。
CAT CAFE-LUNA-は家でくつろいでいるかのように過ごせる猫カフェなので全体を温かみのある黄色の系統でまとめました。
ページトップのスライド写真はお店の内装が分かるような写真を使っており、下には特によく読んでほしいページへと飛ぶリンクをつけています。
【サイト名】
CAT CAFE -LUNA-
【ページ内容】
HOME
お店からのお願い
メニュー・料金
ネコスタッフ
店舗情報
お問い合わせ
【使用ツール】
Dreamweaver
Adobe Photoshop CS6
Adobe Illustrator CS6
【制作期間】
１ヶ月
【URL】
【使用ツール】Adobe Photoshop CS6
【制作期間】３０分
【大きさ】４００×１００
Concept
猫カフェのサイトへ誘導するためのバナーです。
さわやかなイメージがでるように白でまとめ、文字が見やすいようにシャドウをかけました。
森のコンセプトの猫カフェで全体の色味が緑なので１色だけにし、まとまった印象にしています。
【使用ツール】Adobe Photoshop CS6
【制作期間】３０分
【大きさ】４００×１００
Concept
キャットフードを取り扱っているサイトへ誘導するためのバナーです。
食材にこだわったキャットフードのため高級感がでるように書体にこだわり、色も１色に抑えシンプルにまとめました。
【使用ツール】Adobe Photoshop CS6
【制作期間】３０分
【大きさ】４００×１００
Concept
保護猫活動をしているカフェへ誘導するためのバナーです。
一目で譲渡会をしていることがわかるように白文字で目立たせています。
店名をポップでかわいらしい書体にすることで柔らかい印象にし、
サイトやお店に訪問したくなるようにしています。
【使用ツール】Adobe Photoshop CS6
【制作期間】３０分
【大きさ】３００×２５０
Concept
旅行会社のサイトへ誘導するためのバナーです。
誰でもクイズに答えるだけで応募出来るキャンペーンなので興味を持ってもらいやすく、
サイトに訪問したくなるようにしています。
【使用ツール】Adobe Photoshop CS6
【制作期間】３０分
【大きさ】３２０×１４５
Concept
焼き菓子を中心に販売しているお店のサイトへ誘導するためのバナーです。
普段なかなか買うことのない方でもちょっとした贈り物に購入しやすいようにシンプルなイメージにしました。
送料無料を目立たせることで購買意欲が出るようにしています。
１.ロゴ画像をテンプレートで配置し、
aの外側の形に合わせて楕円形ツールで
正円を描く
２.aの内側の形に合わせて楕円形ツールで
正円を描く
３.１と２で作った正円をパスファインダーの
「前面オブジェクトで型抜き」で切り抜く
４.aの縦線の形に合わせて長方形ツールで
長方形を描く
５.３で型抜きした正円と４で作った長方形を
パスファインダーの「合体」で結合する