KIKUCHI KAZUHIRO

Skill

できること

HTML5＆CSS3

Webサイトを一から制作できるコーディングが可能です。使用しているエディタはAtomです。レスポンシブ対応のデザイン、コーティングも可能です。
jQuery

スライドショーやハンバーガーメニューなど、部分的に動かす基本的なコードを書くことが可能です。
Illustrator

簡単なロゴやアイコン作成、文字の装飾が可能です。ポスターやバナーも作成できます。
Photoshop

簡単な写真の加工、切り抜きの作業が可能です。

Works

製作したもの

website

自分で1からデザイン・コーティングした架空のWEBサイト

Portfolio

(このサイト)

担当	企画 / デザイン / コーティング
製作期間	約3週間
概要・ポイント	就職活動が利用目的のサイトです。シンプルで見やすさを大事にし、今の段階でできること、私のことを知ってもらえるように製作しました。自身の紹介サイトのため、名前に関連してキク科の花であるデイジーをトップ画像にしました。またページ移動はせず1ページのみの作品になっており、作品紹介部分をモーダルウィンドウにすることで、閲覧しやすくしました。

HAIR SALON Thymus

(架空のヘアサロンサイト)

担当	企画 / デザイン / コーティング
製作期間	約4週間
ターゲット	20代～30代あたりの美容室に慣れていない男女の人。通いやすい雰囲気の美容室を探している人。
概要・ポイント	一般的な美容室のサイトです。美容室が苦手な人でも興味を持ってもらえるように、おしゃれ過ぎない清潔感を意識し、シンプルなモノクロカラーを中心としました。また、お店の雰囲気や働いているスタッフ、メニュー表など、初めての人でもわかりやすく伝わるように意識しました。
コメント	1から自分で作る初のサイト制作ということもあり、基本的なコードの書き方を学びながら制作しました。シンプルなレイアウトですが、配置の場所や余白の取り方、レシポンシブに対応した際のズレなどを直すことに苦労しました。 jQueryはすべてが初挑戦で時間はかかりましたが、実装できた際の楽しさがありました。

まるの養鶏場

(架空の養鶏場サイト)

担当	企画 / デザイン / コーティング
製作期間	約2週間
ターゲット	卵が好きでこだわりがあり、お取り寄せで購入したいと考える主婦の人。飲食店など材料を求めている人。
概要・ポイント	生産した卵を紹介、販売している養鶏場のサイトです。ファーストビューに全画面を使用した生卵の画像を使用し、ヘッダーの背景は最初は透明、スクロールするとヘッダーに色がつく仕様にすることで最初のインパクトを大事にしました。柔らかく親しみやすい印象を与えられるように、明るい黄色を基調にし、ワンポイントのアイコンを使用したりと、やりすぎない可愛らしさを意識しました。
コメント	トップページのみの制作になります。ページの並び順に悩みましたが、製品（卵）を知って買ってもらうことが一番の目的であるため、最初に説明と商品一覧を、そのあとにお知らせなどを配置しました。また素材を使うだけでなく、Illustratorを使用してアイコンやバナーを作成し、取り入れました。

ときの耳鼻咽頭科クリニック

(架空のクリニックサイト)

担当	企画 / デザイン / コーティング
製作期間	約2週間
ターゲット	男性や女性、子どもからご高齢の人までの幅広い年齢層の人。自宅や職場、学校などから近くに位置する耳鼻科を探している人。
概要・ポイント	一般的な街の耳鼻咽頭科の病院サイトです。安心感と清潔感を与える青系のカラーを使用し、全体的に落ち着きのある雰囲気にしました。ひと目で耳鼻科とわかるようなトップ画面、アイコンを使用した診療案内、診療時間や診療カレンダーなど必要な情報をわかりやすく配置しました。。
コメント	トップページのみの制作になります。ファーストビューではすっきりした印象を、その上でナビゲーションメニューが追従する際には見やすさを大事にしたいと考えたものの、色など複数の変化をjQueryで実装するのに苦労しました。試行錯誤して実装できた結果、今まで調べてみてそのまま使用していたjQueryのコードの理解が少しだけ深まりました。

pop display design

実際に店頭で掲示した商品POPなど

セブンイレブンフェアの店頭ポスター

使用ツール

Illustrator

ポイント

店頭立て看板にて掲示したポスターです。
売上が大きく変わるキャンペーンであるため、多くの人の目に留めてもらえるよう、ブランドカラーを中心に派手で賑やかな雰囲気に仕上げました。
対象金額や内容を大きく配置し、景品内容の写真と実際のくじのイラストを添えることにより、このキャンペーンをすでに知っているお客様に気付いて参加してもらえるようにとデザインしました。

おにぎりセールの店頭ポスター

使用ツール	Illustrator / Photoshop
ポイント	店頭立て看板にて掲示したポスターです。おにぎりの海苔をイメージした背景を使用し、文字に光彩をつけてより目立つように仕上げました。開催期間とクーポン情報も背景色を変えて認識してもらえるように、またイラストを加えて親しみやすさを出しました。

夏ギフト紹介コーナーのメインPOP

使用ツール	Illustrator / Photoshop
ポイント	店内の夏ギフト紹介コーナーにて掲示したPOPです。浜辺で夏を、リボンでギフトをイメージできるよう意識しました。水に沈んでいるようなロゴマークがこだわりポイントです。

冬ギフト紹介コーナーのPOP

使用ツール	Illustrator / Photoshop
ポイント	店内の冬ギフト紹介コーナーにて掲示したPOPです。ミニカタログ風にするこで、おすすめの品を見てもらい購入してもらえるように製作しました。水色と白カラーで冬らしく仕上げました。

からあげ棒リニューアルPOP

使用ツール

Illustrator / Photoshop

ポイント

人気商品のリニューアル化というこで、目立つ色合いを意識して気付いてもらえるように、変更点やおいしくなったことをしっかり伝わるようにしました。什器の他に店内の別箇所でも使えるように、サイズ違いのものを用意しました。振り返ると、レスポンシブデザインを考える際のような苦労がありました。

カップヌードルみそ再販POP

使用ツール	Illustrator / Photoshop
ポイント	人気のあまり即製造中止してしまった商品の再販を大きくアピールしました。上下の枠をパッケージを真似て作成し、カップヌードルらしさが出るようにしました。

じゃがバター新商品POP

使用ツール	Illustrator / Photoshop
ポイント	商品の強みである「レンジで簡単に食べられる」という点をアピールできるように、軽やかさが出るように意識しました。商品名にはじゃがいもにバターが塗られている感じを表現しました。

UCC缶コーヒーの新商品POP

使用ツール	Illustrator / Photoshop
ポイント	無料引換券対象商品であることをわかりやすく伝えた上で、上品さ、贅沢さが出るように意識して製作しました。2つの豆=キレ＋コクという点が伝わるように、部分的に統一した変化をつけている箇所がこだわりです。

蒙古タンメン中本リニューアルPOP

使用ツール	Illustrator / Photoshop
ポイント	人気商品のため売上が期待できていたので、とにかく見てもらえるようにインパクトを与えられるようなデザインにしました。画像を真ん中に大きく配置して目立たせ、左上からの視線誘導を意識して情報を配置しました。

カップラーメンの新商品ワンタン麺POP

使用ツール	Illustrator
ポイント	商品画像が準備できなかった理由から、シンプルなイラストテイストにしました。立体的な文字やアイコンなどを使用し、シンプルながら少しでも印象を強く与えられるようにしました。

スーパードライ生ジョッキ缶新商品POP

使用ツール	Illustrator / Photoshop
ポイント	主に男性のお客さまがターゲットであるため、斜めに画像を差し込むことでスタイリッシュな印象を与えられるように、また伝えたい単語の文字のみ色を変えることでひと目で情報が伝わるようにしました。

タピオカほうじ茶ラテ新商品POP

使用ツール	Illustrator / Photoshop
ポイント	タピオカが流行していた時期だったため、インスタグラム・写真映えをイメージして製作しました。投稿の1ページのような手に持った商品がポイントです。

Profile

わたしのこと

KIKUCHI KAZUHIRO菊地一宏

１９８９年９月２７日に誕生。神奈川生まれの東京育ち、血液型はO型。
コンビニのセブンイレブンで12年勤務　→　現在Webデザイナーを目指して就職活動中。
店内商品POPなどをIllustratorやPhotoshopで製作していたのがきっかけです。そこからデザインに興味を持ち、Web製作について勉強を始めました。完全独学でまだまだ勉強中ですが、見た人に情報が伝わりやすいように、見た目と操作性を考えながら製作することを大切にしています。

Contact

お問い合わせ

ポートフォリオサイトをご覧いただきありがとうございます。

現時点でこのサイトは就職活動用のみで利用しています。

top

KIKUCHI KAZUHIRO

portfolio