hiroko masuda’s portfoliobstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... ·...

14
HIROKO MASUDA’s PORTFOLIO

Upload: others

Post on 28-Jun-2020

2 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

H I R O K O M A S U D A’s P O R T F O L I O

Page 2: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

0 2 自己紹介

0 3 デジタルハリウッド 卒業制作作品「世田谷・表参道のアロマ & リフレクソロジーサロン Hopp l a !(ホップラ)」

0 7 デジタルハリウッド 中間課題作品「RYOZAN PARK PRESCHOOL」

0 9 デジタルハリウッド バナー作品

1 0 名刺

1 1 過去の作品(20 17 年以前~)

0 1

Page 3: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

P R O F I L E

増田 寛子ま す だ   ひ ろ こ

1 9 8 3 年 1 月 6 日生まれ / 神奈川県川崎市中原区在住 / 家族は夫と 2 歳の息子

シンプルで洗練されていて誰が見ても分かりやすいを基本とし、

クライアント様とは身近で親しみやすく、共にサイトをよりよくしていくようなデザイナーを目指しています。

主に女性向け、かわいい系デザインが得意ですが、それ以外のジャンルも OK です。

ロゴや紙媒体のデザイン、ブランディングデザイン、進行管理の経験もあります。

日本大学芸術学部卒。在学中、デジタルハリウッドで Web デザインを学ぶ。

グラフィックデザイン会社で 5 年間デザイナーなどを経験後、フリーランスのWeb デザイナーとしてちまちま活動。

その後、出産・育児でできたスキルのブランクを埋めるため、2 回目のデジタハリウッド入学、2 0 1 8 年 7 月卒業。

Illustrator Photoshop Dreamweaver Responsive design HTML CSS javascript jQuery Wordpress Word Excel Powerpoint

使用可能ソフト・技術等

0 2

Page 4: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

G R A D U A T I O N W O R K

WEB

世田谷・表参道のアロマ & リフレクソロジーサロン Ho p p l a !(ホップラ)世田谷・表参道でアロマテラピーやリフレクソロジーのサービスを展開している個人経営サロン「Hopp l a !(ホップラ!)」様の情報

サイト。2 0 0 8 年に制作したものをリニューアル。デジタルハリウッド卒業制作。

運営者の Hop p l a ! 活動復帰に伴い、古い情報を更新、更に分かりやすく整理して見やすくすることを第一の目的

とした。またスマホ対応のためにレスポンシブデザインを採用。予約の導線が口コミなので、サイトアクセス時の

予約の受け皿としてサイトが機能できるようにデザインし直した。

制作目的

主に 2 0~ 4 0 代の女性ターゲット

h t t p : / / w w w . h o p p l a . i n f o /

2 0 1 8 年 6 月

3 ヶ月

デザイン、コーディング

UR L

公開日

制作期間

担当箇所

使用ソフト

技術仕様

0 3

Page 5: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

WEB

工夫したところ

シンプルで分かりやすく、レスポンシブでも迷わないレイアウト

「癒し」「女性向け」「リラクサロン」と一見して分かるようなカラーやフォントを採用したデザイン

ページ上部固定のグローバルナビや、ページ下部の予約リンクで導線を分かりやすく

B E F O R E

グロナビを上部固定に予約サイトや他ページにアクセスしやすいように

ページ下部に予約リンクを設置して導線を確保(トップページのみここ)

リニューアル前には少なかったサロン写真を自分で撮影して多めに採用

おすすめメニューは「どんな人に良いか」「どの部位に効くのか」を分かりやすく可視化

Tw i t t e r や f a cebook を活用してクライアントが更新しやすくした

トップのファーストビューにサロン画像をトランジションで表示し、イメージを訴求

トップページ

ロゴ も 以 前 の サイト

立ち上げ 時に自分が

作ったもので、ロゴの

色に合わせてカラーを

選定しました!

0 4

Page 6: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

当店について

メニュー・料金 お客様の声

セラピーについて

WEB

お客様の声

0 5

Page 7: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

WEB

スマホ用ページ

ハンバーガーメニューを採用電話と予約サイトがいつもでできるように

0 6

Page 8: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

I N T E R M E D I A T E W O R K

WEB

RYOZ AN PARK PR E S CHOOLシェアハウス、シェアオフィスを運営する RYOZAN PA R K(リョウザンパーク)様が主宰する、大塚にある完全託児のイングリッシュ

プリスクールの LP サイト。デジタルハリウッド中間課題。

R PP は日本には珍しいシェアオフィス付きの保育施設で、新たに開園するプリスクールの発信窓口の増加、園の

周知のために制作することになった。特に訴求したい事項はプリスクールへの問い合わせもしくは見学予約で、最

終的に園児とシェアオフィス利用者を見込む。

制作目的

2 0 代後半~4 0 代前半の保活中の男女(夫婦)ターゲット

2 0 1 8 年 1~2 月

2 ヶ月

デザイン、コーディング

制作日

制作期間

担当箇所

使用ソフト

技術仕様

0 7

Page 9: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

ヒアリング段階で、クライアントも何を推すべきか

迷っていらっしゃるような 感じでしたので、この

ちょっと変わった形態の保育園をどのようにアピール

したら良いか、同じ主婦ママクラスの皆で取り組み、

企画に不慣れな自分は大変勉強になりました。

WEB

工夫したところ

日本ではあまり他に例がない

「シェアオフィス付き保育施設 +

10 0 % 英語のプリスクール」を

施設の雰囲気も合わせて分かり

やすく構成

ターゲットのパパママ層に向けて、

おしゃれだがかわいくカラフルな

デザインを採用

スクールでの保育イメージをトランジションで表示

分かりにくいターゲット条件をアイコン付きでオススメする

1 日の過ごし方や年間行事を画像でイメージしやすく

ファーストビュー下の導入部に「シェアオフィス」「プリスクール」「英語によって育まれるコミュニティ」などを説明

よくある質問はカテゴリーごとに分けアコーディオン開閉

園の見学予約とお問い合わせフォームをタブで切り替え可能

You t ube 動画で具体的な英語教育風景を見てもらう

0 8

Page 10: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

B A N N E R W O R K

BANN

ER

ゴールドコースト満喫ツアーバナーデジタルハリウッドバナー課題。パターン A はターゲット層を 20~4 0 代の男女で旅行でのリフレッシュ目的、パターン B はファミリー

向けで動物や自然に触れ合えるようなイメージで制作。

十勝の宝石ルビートマトバナーデジタルハリウッドバナープレ特講課題。ターゲット層は共通で 20~5 0 代の女性。パターン A はトマトのフレッシュ感と産地を強調

したイメージ、パターン B はトマトとしてのブランドの高級感、パターン C は緑との組み合わせでみずみずしい爽やかさを表現した。

パターン A パターン B

パターン A

パターンC

パターンB

0 9

Page 11: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン
Page 12: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

M i l l i o n O n i o n H o t e lゲーム制作会社「Onion Games」様の iPhone /And r o id

用ゲームアプリ「M i l l i o n O n i o n H o t e l」公式サイト。

2 0 17 年 10 月公開。コーディング担当。

勇者ヤマダくんゲーム制作会社「Onion Games」様の iPhone /And r o id

用ゲームアプリ「勇者ヤマダくん」公式サイト。

2 0 1 5 年 9 月公開。デザイン、コーディング担当。

仮面の勇者ゲーム制作会社「コアゲームス」様の i P h on e /A n d r o i d

用ゲームアプリ「仮面の勇者」事前予約サイト。(公開終了)

2 0 1 5 年 5 月公開。デザイン、コーディング担当。

ワールドネバーランド エルネア王国の日々ゲーム制作会 社「コアゲームス」様の i P h o n e /A n d r o i d

用ゲームアプリ「ワールネバーランド エルネア王国の日々」

事前予約サイト。(公開終了)

2 0 1 5 年 3 月公開。デザイン、コーディング担当。

O L D W O R K

WEB

1 1

Page 13: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

伝説のレギオンゲーム制作会社「コアゲームス」様の iPhone /A nd r o i d 用

ゲームアプリ「伝説のレギオン」事前予約サイト。(公開終了)

2015 年 2 月公開。デザイン、コーディング担当。

街コロゲーム制作会社「コアゲームス」様の iPhone 用ゲームアプリ

「街コロ」公式サイト。(公開終了)

2 0 14 年 3 月公開。デザイン、コーディング担当。

ソニプロニンテンドー 3D S ソフト「ソニプロ」のランディングサイト。

PC 版のみ。(公開終了)

2 0 14 年 5 月公開。デザイン、コーディング担当。

dango Inc .オンラ インモ バイル、ア プリ開 発 等 を 行 う 会 社「d a n g o

I n c .」様の公式サイト。(公開終了)

2 0 1 3 年 1 月公開。デザイン、コーディング担当。

WEB

知り合いのゲーム業界でお仕事している方のご依頼

で、スマホゲームなどのサイトを多く手がけました。

ビジュアルや画面などの素材をどう生かすかという、

テイストや世界観を合わせる作業に慣れています。

1 2

Page 14: HIROKO MASUDA’s PORTFOLIObstylegroup.co.jp.s3.amazonaws.com/list/digitalhollywood/... · 2018-08-27 · 02 自己紹介 03 デジタルハリウッド 卒業制作作品 「世田谷・表参道のアロマ&リフレクソロジーサロン

最 後まで

ご 覧 いただきまして

どうもありがとう

ござ いました

THA

NK YO U V E RY M

UCH

!