田村由美子ポートフォリオ【Webサイト】

課題

1. 1.コーディングスキルをメインにしたポートフォリオ作り
2. 2.柔らかく女性らしいデザインで設計する
3. 3.ポートフォリオデザイン自体はシンプルでわかりやすさを第一にする

目的

就職活動で使用できるポートフォリオを作成する。

ターゲット

企業担当者

• ・応募者の人となりや経歴を知りたい
• ・デザイン力、コーディングスキルなどのがどのくらいあるか判断したい
• ・応募者多数の為、いくつものポートフォリオを見る必要があるためわかりやすいものを求めている

情報設計

• ・作品以外の素材画像には生成AIやフリー素材を使用し、コーディングスキルを中心にアピールした（トップ画像の文字はPhotoshopで作成）。
• ・背景には background-image を用いてドットを配置し、リキッドデザインでも違和感のない可変レイアウトになるよう設計した。
• ・スキル紹介には一部アイコンを使用し、視覚的にもわかりやすくなるように配慮した。
• ・詳細な情報は作品ページにまとめ、トップページでは情報を絞って簡潔に伝わるよう設計した。
• ・詳細ページにはカラーコードと色見本を掲載し、Webサイトにはページ遷移用のリンクを設けてわかりやすく構成した。

デザイン

• ・フォントに『Zen Maru Gothic』を採用し、柔らかい雰囲気を出せるように配慮した。

制作範囲

企画、デザイン、コーディング

制作期間

• ・ワイヤーフレーム作成：

  1日

• ・デザイン作成：

  5日

• ・コーディング：

  2週間

使用ツール

• ・コーディング：

  HTML/CSS/JavaScript/jQuery

• ・デザイン：

  Adobe Photoshop

• ・素材画像生成：

  AI（ChatGPT）

使用色