サイト概要

コーヒーのサブスクリプションサービスを行っている、コーヒーに特化したカフェ。 「新しいコーヒーライフ」をコンセプトにしており、3種類の月額制プランで、様々なコーヒーの楽しみ方を提供している。

ターゲット層・ペルソナ

20代〜30代のコーヒー好き、カフェでまったりしたり作業をしたりするのが好きな男女。 コーヒーに対してこだわりがあり、家でドリップすることが趣味で、挽きたてのコーヒーが好き。 カフェで本を読んだりPCで作業することが多く、コーヒーが美味しくて居心地の良いカフェを探している。

サイト作成の目的

お店の外観だけでは分からない店内の雰囲気や情報、「コーヒーのサブスクリプションサービス」というあまり馴染みのないサービスを知ってもらうため。

制作ポイント

• TOPに店内の画像やコーヒー豆を焙煎している写真を載せ、店内の雰囲気やコーヒーへのこだわりを一目で感じてもらえるようにしました。
• サブスクリプションサービスのプラン紹介の欄は、月額と簡単なプラン内容に留め、初見でも各プランが比較しやすいようにしました。
• 配色は落ち着いたカフェの雰囲気を伝えるために茶色をベースにし、アクセントカラーに水色を使用することで、おしゃれな印象を持ってもらえるようにしました。

制作範囲

クライアント設定考案・デザインカンプ作成・コーディング

制作期間

2021年12月1日〜2022年1月5日

制作過程

プログラミングスクールを受講していた際の課題として制作しました。 ワイヤーフレームは決められており、デザインカンプをPhotoshopで作成し、その後コーディングまで行っています。

サイト概要

「心とカラダのリラックス体験」をコンセプトにしたエステサロン。 ボディエステからフェイシャルエステまで身体全体のトータルケアを提供している。少人数のスタッフで対応しており、繁華街から少し離れた場所で営業している。

ターゲット層・ペルソナ

20代後半〜40代の女性。 マッサージや毛穴洗浄に興味があるが実際に行ったことはなく、「エステサロンは入会金などが高そう」「効果があるのか不安」「緊張する」など不安感を持っている。 座り仕事で肩や首のこりに悩んでいる。仕事や家事の疲れが取れるような癒しを求めている。

サイト作成の目的

お店の雰囲気を知ってもらい、エステに対する不安感の払拭し、予約につなげる。

制作ポイント

• 余白を多めに取ることで、ゆったりとしたお店の雰囲気を感じてもらえるようにしました。
• 背景は落ち着いた色を使い、柔らかさや温もりのある施術・店内をイメージしました。
• アクセントカラーで彩度低めの赤とゴールドを使い、高級感・特別感を出せるようにしました。
• 「当店の安心ポイント」の欄を設けることで、エステサロンに対するマイナスイメージを払拭できるようにしました。
• キャンペーン内容をページの上部に持ってくることで、初見の人に興味を持ってもらえるよう工夫しました。
• ページが長いためバーガーメニュー内やヘッダー・フッター3箇所に予約ボタンを配置し、予約ボタンを探さなくていいようにしました。

制作範囲

クライアント設定考案・デザインカンプ作成・コーディング

制作期間

2022年1月15日〜2022年2月20日

制作過程

初めて自分で一からデザインを行った作品になります。 様々なエステサロンのWebサイトを拝見し、自分なりにコンセプトや雰囲気に合ったレイアウトや各パーツの配置を考えました。

サイト概要

「誰でも簡単に作れる美味しい料理」をコンセプトにした、料理レシピ検索サイト。

ターゲット層・ペルソナ

10代〜30代の一人暮らしや共働きの男女。仕事や勉強が忙しく時間がないため、 簡単に作れて美味しい料理のレシピを探している。

制作ポイント

料理の写真はフリーサイトでダウンロードしましたが、更に美味しく見えるよう、 明るさを少し上げたり、彩度を上げて色合いを魅力的に見えるよう加工しました。

制作範囲

ロゴ作成、画像加工、コーディング

制作期間

2021年10月1日〜2021年10月23日

制作過程

プログラミングスクールを受講していた際の課題として制作しました。 Bootstrapを使用しています。デザインは決められており、コーディングを行いました。 後に画像を自分で加工したものに編集し、オリジナルのサイト名でロゴを作成しました。

バナー概要

オンラインヨガ教室の自社サイトに設置するバナー。
スクール受講の際、講師の方のバナーお題として作成したものになります。

制作時間

3時間

ターゲット層・ペルソナ

20代後半〜40代の女性。 健康のためヨガ教室に通いたいと思っているが、仕事や育児・コロナ禍の影響で、 自宅でヨガをしたいと考えている人。手の出しやすい価格でヨガ教室を探しているヨガ初心者。

バナー作成の目的

新規顧客獲得のためのお得なキャンペーンをアピールするためのバナー

制作ポイント

・「今だけお得」や定価の価格の後に割引価格を載せることでお得感を出しました。
・写真の人物の目線の先にタイトルを置くことで視線誘導するなど、視線の流れを意識しました。

バナー概要

求人サイトに掲載するコールセンター求人のバナー。
スクール受講の際、講師の方のバナーお題として作成したものになります。

制作時間

3時間

ターゲット層・ペルソナ

30代後半〜40代の女性。 特に資格等は持っていないが、高収入で経験者でなくてもできる仕事を探している。

バナー作成の目的

コールセンターのアルバイト求人募集

制作ポイント

• 図形を使い上から下に流れるように情報を整理し、最後に応募ボタンを敷くことでクリック率を上げれるよう意識しました。
• 全体的にグリーン系の配色にすることで、未経験で好条件の仕事ができる「安心感」を感じてもらえるようにしました。

バナー概要

女性の通勤用シューズのキャンペーンバナー。
スクール受講の際、講師の方のバナーお題として作成したものになります。

制作時間

2.5時間

ターゲット層・ペルソナ

20代前半〜30代の女性。 仕事用で長く履いても疲れない、お洒落なパンプス・ヒールを探している。

バナー作成の目的

女性用通勤シューズキャンペーンの販売促進

制作ポイント

• ビジネス感を出すために明朝系のフォントを使い、可読性を上げるために太さのあるフォントを選びました。
• 背景を白系にしシンプルにまとめ、赤をアクセントとして使用することで引き締まるデザインになるようにしました。

バナー概要

腕時計専門店のお正月の福袋販売用バナー。
スクール受講の際、講師の方のバナーお題として作成したものになります。

制作時間

5時間

ターゲット層・ペルソナ

10代後半〜20代前半の男女。 学生や若手社会人で、お正月のお得な福袋を探している。

バナー作成の目的

お得な福袋の告知

制作ポイント

• お正月感を出すため、赤・金を使って華やかさを出し、2022年の干支である虎のモチーフを配置しました。
• 虎のモチーフを少し大きめにし、コピーのある左向きに配置することで、コピーに自然に目がいくようにしました。

ロゴ概要

エステサロンの架空サイトを作成するにあたり、同時に作成したロゴになります。

制作時間

2時間

制作ポイント

エステサロンの特徴が「ハンドマッサージ」と「アロマ」なので、5本の滑らかな曲線でマッサージしている手を表現しました。 また、葉っぱのモチーフでアロマの「自然」「穏やかさ」を表現しました。

サイト概要

自身のポートフォリオサイト

ターゲット層・ペルソナ

見てくださる担当者の方

サイト作成の目的

転職活動のため、自身の作成した作品を公開するため。

制作ポイント

• 自身が目指している「誰かと誰かの想いを結ぶデザイナー」をサイトのデザインコンセプトにし、 トップページの背景のリングとサイトロゴで「想いを結ぶ」を表現しました。
• 各コンテンツのページを分け、トップページをシンプルに短くまとめました。
• ホバーアクションやトップページスクロール時のグラデーションなど、 シンプルながらも見ていただいた方に楽しんでいただけるよう工夫しました。
• WORKの一覧はページ移動の手間を減らせるよう、ポップアップ表示にしました。

制作範囲

デザイン・コーディング

制作期間

2021年3月23日〜2022年5月25日