Portfolio

• サイト全体の回遊導線を確保し、PV数を伸ばせるよう工夫しました。
  ページトップにパンくずリストを、フッターには次のコンテンツへ誘導できるよう、ナビゲーションとおすすめコンテンツを設置しました。
• ワンセクションごとに、視線の流れに配慮しました。
  具体的には、目線の止まりやすい左上と右下にアクセントカラーを使用した図形やボタンを設置。テキストは横に広がりすぎないよう可読性を意識しました。
• 大きな画層が多いため、サイトの読み込みが遅くならないよう、画像は「Tiny PNG」「iLoveIMG」を使用して画質を損なわないよう圧縮しています。
• ファーストビューはシンプルながらもコンセプトが伝わるよう工夫しました。
  勢いよく飛び出すタイトルと、直下に「デザインに対する想い」が伝わるよう簡潔に表現しました。
• Topページの「Works」のコンセプトは、本屋さんの整頓された棚です。
  様々なジャンルの本が綺麗に陳列され、ワクワクした気持ちで好みのものを探すように、厳選された情報が視覚的・直感的に伝わるよう配慮しました。
• Aboutページは履歴書ではわからない内面的な部分が自然に伝わるよう工夫。
  お忙しい中の限られた時間で見ることを想定し、「斜め読みしても伝わる」よう箇条書きで簡潔に記載しました。
• Worksページは情報量が多いため、理解しやすさ考えアニメーションの使用を控えました。また、ポイントが簡潔に伝わるよう、テキストの多いところはでラインマーカーをつけ視線を誘導しました。

• デザイン思考やスキルが正しく伝わる
• 情報整理や動線設計により、簡潔にポイントが伝わる
• シンプルなデザインの中にも個性を出し印象づける
• デザインが好きで、もっとスキルアップしたい気持ちが伝わる
• 履歴書よりもフランクな日常の私がイメージできる

明度の高いイエローグリーンで、コンセプトである「成長」と「推進力」を表現しました。メインカラーとすると使用面積が広く、インパクトが強すぎるため、アクセントカラーとしました。
メインとベースカラーはややグリーン寄りのグレーを採用しました。どちらもアクセントカラーに馴染み、引き立て役になり、テキストとしても背景色としても使用できるよう、「明度差5.2」を確保しました。

ターゲットが広いことから可読性を優先し、日本語は「Noto Sans JP」、英字は「Raleway」を採用しました。アクセントに「Mrs Saint Delafield」（見本はありません）を使用し、手書きの温もりをプラスしました。
ゴシック体やサンセリフ体の中でも、丸みがあり女性らしさを感じられるフォントを選び、フォントウェイトも太くなりすぎないよう工夫しました。