Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Haruki_Konaka_Portforio.pdf
Search
小中春貴
September 18, 2024
Design
0
770
Haruki_Konaka_Portforio.pdf
小中春貴
September 18, 2024
Tweet
Share
Other Decks in Design
See All in Design
PMとデザイナーはニコイチ! メリットと具体的なアクション10選
mosmos_noki
2
1.2k
デザイナー視点の体験設計とデザインレビューを事業部全員で体験するワークショップをしたお話
masayofff
3
220
2024/11/25 ReDesigner Online Meetup 会社紹介
cybozuinsideout
PRO
0
260
生成AIを受け入れ共創できるデザイナーマインドへープロセス改革を想定したデザイナーの準備ー
takumasaito
1
240
東急URBAN HACKSのデザイナーって何やってるの? 〜Designer Night #1〜 移動・不動産領域の取り組み
tmtgtkhs
0
150
Figma Code Connect を使ってエンジニアの新しい体験をデリバリする
junkifurukawa
0
440
急成長中のWINTICKETにおける ちいさくはじめるライティング改善 / winticket-writing
cyberagentdevelopers
PRO
1
210
トップデザインチームが描く、 2030年に活躍するデザイナー
hiranotomoki
2
2.6k
202409_会社概要資料_Englishver.pdf
zakkerooni
0
210
20241019-CUD友の会「困った!を解決するデザイン改訂版」交流会
majimasachi
0
280
portfolio
amitnk
1
160
ZOZO CDO Office Design
zozodevelopers
PRO
1
590
Featured
See All Featured
How to Ace a Technical Interview
jacobian
276
23k
YesSQL, Process and Tooling at Scale
rocio
169
14k
Site-Speed That Sticks
csswizardry
1
180
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
28
2.1k
No one is an island. Learnings from fostering a developers community.
thoeni
19
3k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
48k
Building Better People: How to give real-time feedback that sticks.
wjessup
365
19k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
8
1.2k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
26
1.8k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
665
120k
Agile that works and the tools we love
rasmusluckow
328
21k
Transcript
Web Designer PORTFOLIO By Haruki Konaka
Profile ・・・・・・・・・・・・・・・・・・・・ 03 自己紹介 / 経歴 サービス内容 / 特徴 HP
/ LP / バナー 出来ること / 私の強み ご提案の流れ Service ・・・・・・・・・・・・・・・・・・・ 06 Works ・・・・・・・・・・・・・・・・・・・・ 14 Skills ・・・・・・・・・・・・・・・・・・・・・ 40 Flow ・・・・・・・・・・・・・・・・・・・・・・ 43 目次 Portfolio Profile Service Works Skills Flow 02
Profile 自己紹介
自己紹介 小中 春貴 1996年 2月11日 奈良県香芝市 ・運動すること ・サウナにいくこと ・旅行にいくこと 名前
生年月日 出身地 趣味 こなか はるき Profile 自己紹介 経歴 04
Profile 自己紹介 経歴 経歴 株式会社ネクサスエージェント 大学卒業後、 不動産ベンチャー会社に入社。 1年営業経験後に 契約の責任者として従事。 東京に上京後、
不動産ベンチャー会社に入社。 賃貸管理部として、 カスタマーサポートとして従事。 副業にて動画編集を経験後、 オンラインスクール運営会社に入社。 スクール運営と顧客管理に従事。 半年間デザインスクールで受講後、 フリーランスとして独立。 株式会社GA technologies入社 株式会社SOL入社 フリーランスとして活動 05
Service サービス
迅速な対応 ご連絡をいただいてから2時間以内 にご返信させていただきます。 またお急ぎの場合は柔軟に対応させ ていただきます。 01 高品質保証 作品に満足していただいた上で 発注いただけるように、 初稿無料で提案いたします。
02 課題解決をする提案 営業経験を活かして、お客様が 課題と感じている部分を ヒアリングし、デザインを 通じてカタチにします。 03 サービスの特徴 Service サービス内容 特徴 13
Works 制作実績
SNOWペットシッター 制作範囲 制作期間 使用ツール 種類 安心してお預けできる ペットシッター デザイン・コーディング 1.5ヶ月 Figma
SNOWペットシッター株式会社
None
ターゲット 実家の帰省中にペットを預けたい方 旅行や長時間の外出でペットを預けたい方 ご要望 HPのリニューアルということで、ガラッと印象を変えたい 安心感を与えるようなデザインにしてほしい
目的 大事なペットを安心して預けていただきたい。 HPを通じてなぜ安心できるのか特徴を強調したい。 Works HP LP バナー 17 要件整理
レイアウト 飽きさせないレイアウト 写真やあしらいをつけて見やす く、飽きないレイアウトにし た。 また、よくある悩みを冒頭に出 して親近感が湧くようにした。 レイアウト 飽きさせないレイアウト 写真やあしらいをつけて見やす
く、飽きないレイアウトにし た。 また、よくある悩みを冒頭に出 して親近感が湧くようにした。 デザイン 安心感のあるデザインを FVのデザインを家の中でペット 達が寝ている写真を選定。 安心感を訴求できるようにした。 また丸みのあるフォントで柔ら かい印象にした。 制作方針 Works HP LP バナー 18
レイアウト https://pet-taxikarubi.com/ https://tokyo-petsitter.com/ https://www.pet-ss.com/ レイアウトや機能面の参考サイト ベンチマーク Works HP LP バナー
19 引用元:株式会社 KARUBI様 引用元:日本ペットシッターサービス様 引用元:Tokyoペットシッター様
https://pet-jfamily.com/ https://pet-rplus.com/ https://www.oniah.jp/ デザイン デザインのトンマナの参考サイト ベンチマーク Works HP LP バナー
20 引用元:ペットシッター J・ファミリー様 引用元:ねこ松様 引用元:おに動物病院様
読みやすさかつ親しみやすさを与えるために YuGothicを選定。 落ち着いたイメージを与えるために、ベースカラーは オフホワイトでメインカラーをブラックに選定。 カラー 安心感を与えられる丸みがありフォントを選定。 YuGothic フォント Heisei Maru
Gothic Std フォント&カラー #139114 #FFFDF3 #FDDA9B #000000 #4CCC1C デザインの意図 Works HP LP バナー 21
①会社概要 ②よくあるお悩み ③サービス内容 ④対応エリア ⑤選ばれる理由 ⑥お客様の声 ・肉球のイラストを入れて親近感があるデザインにした ・ユーザー目線でよくあるお悩みを入れた。 ・ペットの写真を入れて安心感を訴求した。 ・エリアごとに分けて見やすくした。
・デザインの反復を使って、見やすく楽しめるデザインにした。 ・実際にお客様が記載していただいた声を添付し、安心感を訴求した。 ① ② ③ ④ ⑤ ⑥ デザインの意図 Works HP LP バナー 22
⑦ご利用画像 ⑧代表の想い ⑨よくある質問 ⑩ペットコラム お問い合わせ フッター ・実際にご利用いただいた写真を入れてユーザーの方にイメージを湧くようにした。 ・代表がどういった想いで運営をしているのかを記載した。 ・シンプルで読みやすいデザインにした。 ・コラムを記載して、新しい情報が見れるようにした。
・CTAボタンを緑色にして、目立つようにした。 ・ヘッダーと背景画像を同じにして、統一感を出した。 ⑦ ⑧ ⑨ ⑩ 11 11 12 12 デザインの意図 Works HP LP バナー 23
Before After ・家を連想されるデザインにして、安心感を訴求した。 ・様々な方がご利用できるようにポップで親しみがあるデザインにした。 ビフォーアフター Works HP LP バナー 24
musubiya 制作範囲 制作期間 使用ツール 種類 手軽に美味しく食べられる おにぎり専門店LP デザイン・ライティング 10日間 Figma・Photoshop
自主制作
None
ターゲット % 仕事をハードワークに働かれているビジネスマン。 % 手軽に美味しく食事を済ませたい人。 ご要望 % オープン記念で10%割引の旨を強調してほしい。 % 和、素材のこだわり、体の優しい、通いたくなる、伝統などを思わせるデザインにしてほしい
目的 % 朝の忙しい時間やランチタイムに食べてもらいたい。 % オープン記念で割引をしていることを伝えたい。 要件整理 Works HP LP バナー 27
レイアウト 強弱をつけた 今回オープン記念で10%オフ を1番印象づけたいので、文 字サイズの強弱をつけた。 繊細なイメージを与える為に フォントは明朝体にして、落 ち着きがある雰囲気を出した。 デザイン 優しく和のテイストを
背景画像を和紙にして、和の テイスト印象づけた。 繊細なイメージを与える為に フォントは明朝体にして、落 ち着きがある雰囲気を出した。 制作方針 Works HP LP バナー 28
レイアウト https://yamadamura.jp/ https://andon.shop/ レイアウトや機能面の参考サイト ベンチマーク Works HP LP バナー 29
引用元:ANDON様 引用元:有限会社平成食糧様
https://sumai-koubou.com/ https://fcn-gohan.com/ デザイン デザインのトンマナの参考サイト ベンチマーク Works HP LP バナー 30
引用元:株式会社住幸房様 引用元:FCN株式会社様
シンプ ルかつ高級感のある印象を与える為に Noto Serif JPを選定。 落ち着いたイメージを与えるために、ベースカラーは オフホワイトでメインカラーをブラックに選定。 カラー 繊細なイメージを与えるために明朝体を選定。 Noto
Serif JP フォント Hiragino Mincho Pro フォント&カラー #139114 #FCFDF8 #333333 #B9333E #FFFFFF デザインの意図 Works HP LP バナー 31
①商品説明 ②詳細 ③メニュー ④地図 ⑤フッター ・背景に丸を入れて、おにぎりを連想されるようにした。 ・見出しのタイトル文にアクセントカラーを入れてメリハリをつけた。 ・優しいイメージを与えるように商品の背景は丸くデザインした。 ・メリハリをつけるため商品を縦書きにした。 ・SNSのアインコンを追加して、リンク先に飛べるようにした。
・カテゴリーをタップすると見たいページが表示されるようにした。 ① ② ③ ④ ⑤ デザインの意図 Works HP LP バナー 32
Before After ・1番目立たせたいところに強弱をつけて、インパクトのある印象にした。 ・美味しく感じさせられるために、写真を明るくした。 ビフォーアフター Works HP LP バナー 33
スワイプ型サイト Tokify 制作範囲 制作期間 使用ツール 種類 挑戦したいと思える デザイナー募集バナー デザイン 2日間
Figma スワイプ型サイト
ターゲット ( 実案件をこなしているがスキルアップを目指しているWebデザイナー ( 作品を作ってみたいと考えているデザイン学習者 ご要望 ( LPにトンマナを合わせて一貫性があるように ( 賞金イメージが持てるように、イラストを使ってデザインしてほしい
目的 ( スワイプ型サイトのデザインを作成してくれるデザイナーを募集すること 要件整理 Works HP LP バナー 35
レイアウト 数字にインパクトを 賞金が出るということで、背景 に紙吹雪を入れて賑やかなイメ ージにした。 またベースカラーはトンマナを 崩さないようにするために紫色 にした。 デザイン ポップでにぎやかに
賞金が出るということで、背景 に紙吹雪を入れて賑やかなイメ ージにした。 またベースカラーはトンマナを 崩さないようにするために紫色 にした。 制作方針 Works HP LP バナー 36
LPのトンマナを崩さないように、ベースカラーは 紫色に選定。 太めのゴシック体にしてインパクトがあるようにした。 また多方面の方に受け入れられるように、ゴシック体 にした。 読みやすさを意識してゴシック体にした。 またタイトルと類似したフォントにして、太さを変え てメリハリを出した。 フォント Hiragino
Kaku Gothic StdN Hiragino Kaku Gothic ProN カラー フォント&カラー #D1CDE6 #FBFBFB #FF7E6B #333333 #D1CDE6 #FBFBFB #FF7E6B #333333 デザインの意図 Works HP LP バナー 38
Before After ・あしらいを入れてタイトルが目立つようにした。 ・お金のイラストを入れて、賞金に臨場感があるようにした。 ビフォーアフター Works HP LP バナー 39
Skills スキル
出来ること Photoshop ・・写真加工、写真補正、合成画像作成 ・・名刺、チラシ、バナー ・・Webサイト、LP、バナーの作成 ・・Webサイトの実装、公開 Illustrator Figma STUDIO Skills
Skills 出来ること 私の強み 41 現状スキル
好奇心旺盛 コミュニケーション コミュニケーションにおいて、相手のこ とを正しく理解し、良好な関係づくりが できます。前職ではお客様の会話の中で 「本当に求めていること」を理解し、そ れを解決できるようなご提案に取り組ん できました。 また相手の立場に立って考え行動するこ とで、クライアント間とのコミュニケー
ションの摩擦を減らします。 一度決めたことは必ず最後までやり抜き ます。新卒で不動産会社に就職し、毎日 勉強することで、3ヶ月間で国家資格に 合格しました。 デザインに関しても日々インプットを能 動的に行い、自身のアウトプットに反映 できるよう努力できます。 好奇心旺盛で、自分の「好き」を追究す ることに努力を惜しみません。好きな分 野の知識を伸ばすために海外への異文化 交流や動画編集など、自身の知識を広げ るために挑戦してきました。デザインに 関しても常に幅広い表現を挑戦すること で、良いクリエイティブを作ることに貪 欲に取り組むことができます。 継続力 01 02 03 私の強み Skills 出来ること 私の強み 42
Flow 流れ
ヒアリング 事前にヒアリングシートをお送り します。内容をご記入いただいた 上で、課題やご要望を30分程度 お伺いさせてください。 01 ご提案 7営業日以内にLPまたは対象と なるデザインの初稿を無料でご 提案させていただきます。
02 ご契約 ご提案内容に価値を感じていただ けた場合のみ、ご購入またはご契 約させていただきます。 03 ご提案の流れ Flow ご提案の流れ 44
Lasty 最後に
貴重なお時間をいただき、ありがとうございました。 ぜひ、お気軽にご相談くださいませ。