画像:プロジェクト Portfolio 2025ver のデザイン

Portfolio 2025ver

2025年に作成したポートフォリオサイト。

  • Ajax
  • CSS
  • Docker
  • Figma
  • HTML
  • Illustrater
  • Javascript
  • Photoshop
担当範囲
デザイン・コーディング
制作期間
3か月

概要

ただ作って終わりにするのではなく、今後の私の制作活動を記録しつづけ、育てていくことができるサイトにしたかったため、更新性を意識し、先々まで使用できるような設計を心掛けました。
また、見てくださる方にとっても、普段使用する私にとっても使いやすいサイト作りにこだわりました。

目的

私の人となり、クリエイターとしての考え方を的確に、かつ魅力的に伝える。

課題

見てくださる方にとって必要な情報が探しやすく、実績が魅力的に映るサイトづくりを目指す。
集中して作って終わりではなく、日常的に更新しやすい、使いやすいサイトである必要がある。

デザイン

ポートフォリオそのものには色をつけずにモノトーンで作成することで実績の色を際立たせています。なるべく余計な要素を排し、必要最低限の情報しか載せないようにすることで、シンプルで飽きの来ない、主張は強くないが痒いところに手が届く、長く愛されるデザインを目指しました。
実績の詳細ページでは、わたしが課題をどのように設定し、それを解決したか、思考のプロセスを見ていただけるように設計しています。
Profileページの好きなことセクションの画像は、生成AIで作成しました。常に形を変え、変化し続ける私自身を表すために、白い粘土のような質感の画像を使用した意図があります。

技術

Ajaxで無限スクロールを実装しています。これにより更新ボタンや検索ボタンを使用する必要がなくなり、1つの結果を得るためのアクションを減らすことができ、ユーザーのストレスをなくし、直感的な使用感につながると考えています。
またCMSは、まずは業務で日常的に使用しているWordpressを導入しましたが、今後はよりサイトスピードを上げてユーザー体験を向上させるため、ヘッドレスCMSへの移行を検討しています。
開発環境に関しては、どんな環境でもスムーズに、誰が見てもわかりやすく開発できるようにDockerとViteを使用しました。gitはgit actionを使用して自動デプロイできるように設定したため、日々の更新性がアップし、改善しやすくなりました。