－ 概要 －

医療事務での勤務経験を活かしながら、架空メンタルクリニックのホームページを制作しました。デザインスクール卒業制作。

－ ターゲット －

通院を検討している20～50代の男女 ( 特に近辺在住のOL・サラリーマン、主婦層・中年層など )

－ 目的 －

潜在 ( 初診 ) 患者の獲得 | 心療内科のイメージ刷新 | 快適に通えるポイント訴求

－ 情報設計 －

初回・再来の方が安心して頼れるクリニックであることを示すために、充実した情報量と寄り添うメッセージ性を意識したサイト構成としています。

知りたい情報へすぐアクセス可能なドロップダウンメニューを設置。クリニックの特徴を6つに絞り訴求したり、slickを活用して院内写真をオートで切り替え掲載したり、初診当日の流れやお願い事をSwiper機能のスクロールでまとめたりと、事前イメージが掴みやすい設計を複数取り入れました。

また、お問い合わせページのプライバシーポリシーは、アコーディオンで織り込んだ中にスクロールエリアを設け、下部の送信ボタン操作時にストレスがないよう工夫しました。

－ デザイン －

想定立地はアクセス良好な中目黒を選定し、目黒川の桜をモチーフとして柔らかで包み込む暖色系に揃えました。

ファーストビューにクリニック名を印象付ける動画 ( 個人撮影 ) を埋め込み、ページ全体を通してかっちりしすぎず優しげなフォントを使用。医師紹介ページでは資格や所属学会が一目で分かるようにアイコン風に並べたり、先生の雰囲気を事前に感じてもらえるよう写真を大きく配置したりと、実際の患者様の声を参考に仕上げました。

－ 概要 －

架空オーガニック野菜宅配サービス「スグ食べ」のランディングページを制作しました。デザインスクール課題制作。

－ ターゲット －

成長期の子どもがいる20～30代の主婦層、食にこだわり丁寧な暮らしを好むファミリー層

－ 目的 －

リスティング広告運用にあたり、サービス概要が十分に理解でき訴求力のあるページとしてお試し購入へ導く

－ 情報設計 －

「スグ食べ」を簡潔に伝えるため、導入部分に短文で記述したサービス内容を掲載し、競合他社との差別化を謳う名目で3つの理由を上部にまとめました。

本サイト最大の目的はお試しセット注文への遷移であったので、注文ボタンを合計4箇所に設置。オーガニック野菜の実態はどのようなものか？どんな農家で栽培されたのか？実際にサービスを利用した方の感想は？といった、検討の際に気になる情報を順番に紹介し、納得感を醸成できるような構成となるよう心がけながら設計しました。

－ デザイン －

新鮮さやナチュラル感、清潔で健やかなイメージを持ってもらえるよう、グリーンとクリーム色の背景をベースにデザイン。

主役は商品であるオーガニック野菜となるため、KVとお試しセット箇所には彩度が高く瑞々しさを感じられる画像を配置し、農家の方々の写真も柔和な人となりが分かるよう大きめにレイアウトしました。ある程度のリッチさを演出するためにフォントは上品な明朝体を使用。随所のディティールにも凝り、訪れた方に「注文してみたい！」と思ってもらえるよう意識しました。

－ 概要 －

生い立ちやスキル、趣味などをまとめた己紹介用プロフィールサイトを制作しました。デザインスクール課題制作。

－ ターゲット －

初見で私自身についてまだ周知していない方々、スクール講師と生徒の皆さん

－ 目的 －

私について気軽に知ってもらう | ビジネスではないプライベートな側面の訴求

－ 情報設計 －

一目見て私のサイトだと認識できるよう、ファーストビューのすぐ後に自己紹介文を掲載。各スキルレベルをアイコン風に取り入れることで「何が出来る人なのか」を判断しやすくしました。また、趣味はその人自身を象徴する重要な要素であると感じたため、代表的な5つに集約し、写真と一言コメントで印象付けを狙いました。

※SNSシェアボタンや送信ボタン、Works部分はダミーとなっております。

－ デザイン －

自分自身の雰囲気を感じてもらえるように好みな系統の水色×白ベースで仕上げました。

文章を少なめにすることで閲覧のハードルを下げ、繊細さや洗練さを視覚的に表現するため、ページ全体に花や蝶、大理石を要素として取り入れました。趣味部分の写真は撮影時期・環境が異なりごちゃついて見えたので、Photoshopにて色調調整を施しテイストがマッチするよう意識。

遷移先のContactページはダミーですが、文字が見切れないよう大判の入力エリアを採用しました。

－ 概要 －

これまでの制作物を集約させたポートフォリオサイトを制作しました。自主制作。

－ ターゲット －

各企業の採用担当者様 ( 特にWeb制作会社の採用担当者様や現場社員さん )

－ 目的 －

就職活動を行うにあたり、自身の経歴や強み、制作物やデザインへの想いを伝えるため

－ 情報設計 －

ターゲットが求めている情報の掲載と、独自性のある印象深さをテーマに設計しました。

現状できることや強みの可視化に加え、何故Webデザイナーを目指し始めたか追えるように横スクロールの略歴を取り入れました。ポートフォリオサイトの主役である制作物は2カラムの一覧で表示。クリック後のアクションはページ遷移ではなくモーダルウィンドウを採用し、戻る際のハードルを下げて離脱とストレス軽減に努めました。

－ デザイン －

ページ内コンセプトを自身のデザインビジョンである「船」としたため、海を連想するディープブルーを主カラーとし、また今後のキャリアへの希望を託す想いを込めたイエローを使用しました。

数多の履歴書や応募者サイトを閲覧されている採用担当者の方へ楽しさを届けたいと思い、波のエフェクトや船関連のイラストを挿入したりと、遊び心を取り入れました。自身の性格である真面目さ・真摯さとの二面性という意味合いも込めています。