| サイト概要

ポートフォリオサイト

| 使用したツール

Illustrator / Photoshop / Figma / VS Code

| 制作期間

企画・デザイン 2週間
html / CSS / jQuery/ JavaScript 2週間

| ターゲット

企業の採用担当の方々

| 情報設計

採用担当の方々は日々たくさんの方のポートフォリオサイトを拝見する機会があるということで、情報を詰め込み過ぎず、必要な情報を分かりやすくをモットーにワンページのHPに。一番見てほしい作品を「WORKS」として一番最上層に設置。作品はカード型に並べ、写真をクリックすると詳細ページへリンクする動き。次に自身のプロフィールと経歴を「ABOUT」に、最下層に「SKILL」としてスキルに流れるように設置。

| デザイン

メインカラーは私の好きな深めのブルーを(#0A1E54)、背景はホワイトでクリーンでシンプルをベースに。雑然としないように余白も多めに取ることを常に意識。フォントには和文には柔らかなイメージのZen Kaku Gothic New、英文にはMontserratを使用。カードベースのリンクにはクリックで凹む動きをつけ、カーソルはサークルにし、リンクにカーソルを合わせたらサークルが膨らみ色も変わる動きをつけ、シンブルながらもJavaScriptで多彩な動きをつけました。

| 作成を終えて

ベースが出来てきたところで元々のデザインがシンプルだったため、後からJavaScriptで動きをプラスしていきました。お気に入りはスクロールボタン。ゆらゆら揺れるデザインが特徴です。情報収集のため、様々なポートフォリオサイトを拝見しレベルの高さに落ち込むこともありますが、今の自分の作品だと自信を持っていこうと思います。