Slide 1

Slide 1 text

Web Designer PORTFOLIO By Haruki Konaka

Slide 2

Slide 2 text

Profile ・・・・・・・・・・・・・・・・・・・・ 03 自己紹介 / 経歴 サービス内容 / 特徴 HP / LP / バナー 出来ること / 私の強み ご提案の流れ Service ・・・・・・・・・・・・・・・・・・・ 06 Works ・・・・・・・・・・・・・・・・・・・・ 14 Skills ・・・・・・・・・・・・・・・・・・・・・ 40 Flow ・・・・・・・・・・・・・・・・・・・・・・ 43 目次 Portfolio Profile Service Works Skills Flow 02

Slide 3

Slide 3 text

Profile 自己紹介

Slide 4

Slide 4 text

自己紹介 小中 春貴 1996年 2月11日 奈良県香芝市 ・運動すること ・サウナにいくこと ・旅行にいくこと 名前 生年月日 出身地 趣味 こなか はるき Profile 自己紹介 経歴 04

Slide 5

Slide 5 text

Profile 自己紹介 経歴 経歴 株式会社ネクサスエージェント 大学卒業後、 不動産ベンチャー会社に入社。 1年営業経験後に 契約の責任者として従事。 東京に上京後、 不動産ベンチャー会社に入社。 賃貸管理部として、 カスタマーサポートとして従事。 副業にて動画編集を経験後、 オンラインスクール運営会社に入社。 スクール運営と顧客管理に従事。 半年間デザインスクールで受講後、 フリーランスとして独立。 株式会社GA technologies入社 株式会社SOL入社 フリーランスとして活動 05

Slide 6

Slide 6 text

Service サービス

Slide 7

Slide 7 text

迅速な対応 ご連絡をいただいてから2時間以内
 にご返信させていただきます。
 またお急ぎの場合は柔軟に対応させ ていただきます。 01 高品質保証 作品に満足していただいた上で 発注いただけるように、 初稿無料で提案いたします。 02 課題解決をする提案 営業経験を活かして、お客様が 課題と感じている部分を
 ヒアリングし、デザインを
 通じてカタチにします。 03 サービスの特徴 Service サービス内容 特徴 13

Slide 8

Slide 8 text

Works 制作実績

Slide 9

Slide 9 text

SNOWペットシッター 制作範囲 制作期間 使用ツール 種類 安心してお預けできる ペットシッター デザイン・コーディング 1.5ヶ月 Figma SNOWペットシッター株式会社

Slide 10

Slide 10 text

No content

Slide 11

Slide 11 text

ターゲット 実家の帰省中にペットを預けたい方 旅行や長時間の外出でペットを預けたい方 ご要望 HPのリニューアルということで、ガラッと印象を変えたい 安心感を与えるようなデザインにしてほしい 目的 大事なペットを安心して預けていただきたい。 HPを通じてなぜ安心できるのか特徴を強調したい。 Works HP LP バナー 17 要件整理

Slide 12

Slide 12 text

レイアウト 飽きさせないレイアウト 写真やあしらいをつけて見やす く、飽きないレイアウトにし た。 また、よくある悩みを冒頭に出 して親近感が湧くようにした。 レイアウト 飽きさせないレイアウト 写真やあしらいをつけて見やす く、飽きないレイアウトにし た。 また、よくある悩みを冒頭に出 して親近感が湧くようにした。 デザイン 安心感のあるデザインを FVのデザインを家の中でペット 達が寝ている写真を選定。 安心感を訴求できるようにした。 また丸みのあるフォントで柔ら かい印象にした。 制作方針 Works HP LP バナー 18

Slide 13

Slide 13 text

レイアウト https://pet-taxikarubi.com/ https://tokyo-petsitter.com/ https://www.pet-ss.com/ レイアウトや機能面の参考サイト ベンチマーク Works HP LP バナー 19 引用元:株式会社 KARUBI様 引用元:日本ペットシッターサービス様 引用元:Tokyoペットシッター様

Slide 14

Slide 14 text

https://pet-jfamily.com/ https://pet-rplus.com/ https://www.oniah.jp/ デザイン デザインのトンマナの参考サイト ベンチマーク Works HP LP バナー 20 引用元:ペットシッター J・ファミリー様 引用元:ねこ松様 引用元:おに動物病院様

Slide 15

Slide 15 text

読みやすさかつ親しみやすさを与えるために YuGothicを選定。 落ち着いたイメージを与えるために、ベースカラーは オフホワイトでメインカラーをブラックに選定。 カラー 安心感を与えられる丸みがありフォントを選定。 YuGothic フォント Heisei Maru Gothic Std フォント&カラー #139114 #FFFDF3 #FDDA9B #000000 #4CCC1C デザインの意図 Works HP LP バナー 21

Slide 16

Slide 16 text

①会社概要 ②よくあるお悩み ③サービス内容 ④対応エリア ⑤選ばれる理由 ⑥お客様の声 ・肉球のイラストを入れて親近感があるデザインにした ・ユーザー目線でよくあるお悩みを入れた。 ・ペットの写真を入れて安心感を訴求した。 ・エリアごとに分けて見やすくした。 ・デザインの反復を使って、見やすく楽しめるデザインにした。 ・実際にお客様が記載していただいた声を添付し、安心感を訴求した。 ① ② ③ ④ ⑤ ⑥ デザインの意図 Works HP LP バナー 22

Slide 17

Slide 17 text

⑦ご利用画像 ⑧代表の想い ⑨よくある質問 ⑩ペットコラム  お問い合わせ  フッター ・実際にご利用いただいた写真を入れてユーザーの方にイメージを湧くようにした。 ・代表がどういった想いで運営をしているのかを記載した。 ・シンプルで読みやすいデザインにした。 ・コラムを記載して、新しい情報が見れるようにした。 ・CTAボタンを緑色にして、目立つようにした。 ・ヘッダーと背景画像を同じにして、統一感を出した。 ⑦ ⑧ ⑨ ⑩ 11 11 12 12 デザインの意図 Works HP LP バナー 23

Slide 18

Slide 18 text

Before After ・家を連想されるデザインにして、安心感を訴求した。 ・様々な方がご利用できるようにポップで親しみがあるデザインにした。 ビフォーアフター Works HP LP バナー 24

Slide 19

Slide 19 text

musubiya 制作範囲 制作期間 使用ツール 種類 手軽に美味しく食べられる おにぎり専門店LP デザイン・ライティング 10日間 Figma・Photoshop 自主制作

Slide 20

Slide 20 text

No content

Slide 21

Slide 21 text

ターゲット % 仕事をハードワークに働かれているビジネスマン。 % 手軽に美味しく食事を済ませたい人。 ご要望 % オープン記念で10%割引の旨を強調してほしい。 % 和、素材のこだわり、体の優しい、通いたくなる、伝統などを思わせるデザインにしてほしい 目的 % 朝の忙しい時間やランチタイムに食べてもらいたい。 % オープン記念で割引をしていることを伝えたい。 要件整理 Works HP LP バナー 27

Slide 22

Slide 22 text

レイアウト 強弱をつけた 今回オープン記念で10%オフ を1番印象づけたいので、文 字サイズの強弱をつけた。 繊細なイメージを与える為に フォントは明朝体にして、落 ち着きがある雰囲気を出した。 デザイン 優しく和のテイストを 背景画像を和紙にして、和の テイスト印象づけた。 繊細なイメージを与える為に フォントは明朝体にして、落 ち着きがある雰囲気を出した。 制作方針 Works HP LP バナー 28

Slide 23

Slide 23 text

レイアウト https://yamadamura.jp/ https://andon.shop/ レイアウトや機能面の参考サイト ベンチマーク Works HP LP バナー 29 引用元:ANDON様 引用元:有限会社平成食糧様

Slide 24

Slide 24 text

https://sumai-koubou.com/ https://fcn-gohan.com/ デザイン デザインのトンマナの参考サイト ベンチマーク Works HP LP バナー 30 引用元:株式会社住幸房様 引用元:FCN株式会社様

Slide 25

Slide 25 text

シンプ ルかつ高級感のある印象を与える為に Noto Serif JPを選定。 落ち着いたイメージを与えるために、ベースカラーは オフホワイトでメインカラーをブラックに選定。 カラー 繊細なイメージを与えるために明朝体を選定。 Noto Serif JP フォント Hiragino Mincho Pro フォント&カラー #139114 #FCFDF8 #333333 #B9333E #FFFFFF デザインの意図 Works HP LP バナー 31

Slide 26

Slide 26 text

①商品説明 ②詳細 ③メニュー ④地図 ⑤フッター ・背景に丸を入れて、おにぎりを連想されるようにした。 ・見出しのタイトル文にアクセントカラーを入れてメリハリをつけた。 ・優しいイメージを与えるように商品の背景は丸くデザインした。 ・メリハリをつけるため商品を縦書きにした。 ・SNSのアインコンを追加して、リンク先に飛べるようにした。 ・カテゴリーをタップすると見たいページが表示されるようにした。 ① ② ③ ④ ⑤ デザインの意図 Works HP LP バナー 32

Slide 27

Slide 27 text

Before After ・1番目立たせたいところに強弱をつけて、インパクトのある印象にした。 ・美味しく感じさせられるために、写真を明るくした。 ビフォーアフター Works HP LP バナー 33

Slide 28

Slide 28 text

スワイプ型サイト Tokify 制作範囲 制作期間 使用ツール 種類 挑戦したいと思える デザイナー募集バナー デザイン 2日間 Figma スワイプ型サイト

Slide 29

Slide 29 text

ターゲット ( 実案件をこなしているがスキルアップを目指しているWebデザイナー ( 作品を作ってみたいと考えているデザイン学習者 ご要望 ( LPにトンマナを合わせて一貫性があるように ( 賞金イメージが持てるように、イラストを使ってデザインしてほしい 目的 ( スワイプ型サイトのデザインを作成してくれるデザイナーを募集すること 要件整理 Works HP LP バナー 35

Slide 30

Slide 30 text

レイアウト 数字にインパクトを 賞金が出るということで、背景 に紙吹雪を入れて賑やかなイメ ージにした。 またベースカラーはトンマナを 崩さないようにするために紫色 にした。 デザイン ポップでにぎやかに 賞金が出るということで、背景 に紙吹雪を入れて賑やかなイメ ージにした。 またベースカラーはトンマナを 崩さないようにするために紫色 にした。 制作方針 Works HP LP バナー 36

Slide 31

Slide 31 text

LPのトンマナを崩さないように、ベースカラーは 紫色に選定。 太めのゴシック体にしてインパクトがあるようにした。 また多方面の方に受け入れられるように、ゴシック体 にした。 読みやすさを意識してゴシック体にした。 またタイトルと類似したフォントにして、太さを変え てメリハリを出した。 フォント Hiragino Kaku Gothic StdN Hiragino Kaku Gothic ProN カラー フォント&カラー #D1CDE6 #FBFBFB #FF7E6B #333333 #D1CDE6 #FBFBFB #FF7E6B #333333 デザインの意図 Works HP LP バナー 38

Slide 32

Slide 32 text

Before After ・あしらいを入れてタイトルが目立つようにした。 ・お金のイラストを入れて、賞金に臨場感があるようにした。 ビフォーアフター Works HP LP バナー 39

Slide 33

Slide 33 text

Skills スキル

Slide 34

Slide 34 text

出来ること Photoshop ・・写真加工、写真補正、合成画像作成 ・・名刺、チラシ、バナー ・・Webサイト、LP、バナーの作成 ・・Webサイトの実装、公開 Illustrator Figma STUDIO Skills Skills 出来ること 私の強み 41 現状スキル

Slide 35

Slide 35 text

好奇心旺盛 コミュニケーション コミュニケーションにおいて、相手のこ
 とを正しく理解し、良好な関係づくりが
 できます。前職ではお客様の会話の中で
 「本当に求めていること」を理解し、そ
 れを解決できるようなご提案に取り組ん
 できました。
 また相手の立場に立って考え行動するこ
 とで、クライアント間とのコミュニケー
 ションの摩擦を減らします。 一度決めたことは必ず最後までやり抜き
 ます。新卒で不動産会社に就職し、毎日
 勉強することで、3ヶ月間で国家資格に
 合格しました。
 デザインに関しても日々インプットを能
 動的に行い、自身のアウトプットに反映
 できるよう努力できます。 好奇心旺盛で、自分の「好き」を追究す
 ることに努力を惜しみません。好きな分
 野の知識を伸ばすために海外への異文化
 交流や動画編集など、自身の知識を広げ
 るために挑戦してきました。デザインに
 関しても常に幅広い表現を挑戦すること
 で、良いクリエイティブを作ることに貪
 欲に取り組むことができます。 継続力 01 02 03 私の強み Skills 出来ること 私の強み 42

Slide 36

Slide 36 text

Flow 流れ

Slide 37

Slide 37 text

ヒアリング 事前にヒアリングシートをお送り
 します。内容をご記入いただいた
 上で、課題やご要望を30分程度
 お伺いさせてください。 01 ご提案 7営業日以内にLPまたは対象と
 なるデザインの初稿を無料でご
 提案させていただきます。 02 ご契約 ご提案内容に価値を感じていただ
 けた場合のみ、ご購入またはご契
 約させていただきます。 03 ご提案の流れ Flow ご提案の流れ 44

Slide 38

Slide 38 text

Lasty 最後に

Slide 39

Slide 39 text

貴重なお時間をいただき、ありがとうございました。 ぜひ、お気軽にご相談くださいませ。