ポートフォリオサイト
(このページ)
(このページ)

WEB
デザイン
コーディング
担当部分:デザイン・コーディング
制作期間:約15日
使用ツール:
Photoshop / Illustrator / AdobeXD
Clip Studio Paint(一部)
HTML/CSS Visual Studio Code
制作期間:約15日
使用ツール:
Photoshop / Illustrator / AdobeXD
Clip Studio Paint(一部)
HTML/CSS Visual Studio Code
概要
就職活動のため、今までの活動をまとめたポートフォリオサイトを作成。
デザインカンプからコーディングまで、全て一人で行いました。
デザインカンプからコーディングまで、全て一人で行いました。
デザインカンプ
WORKS
つくったもの
- ALL
- WEB
- DTP

WEB
デザイン
コーディング
ナイトカフェ「ハリネズミの夜」(架空カフェ)

WEB
デザイン
コーディング
ポートフォリオサイト(このサイト)

WEB
コーディング
トレース
ENGBODY(架空ジム)

WEB
コーディング
トレース
Wed Design Conference (架空セミナー)

WEB
コーディング
トレース
START(架空企業)

WEB
課題
コーディング
トレース
Kissa(架空カフェ)

WEB
課題
コーディング
トレース
Codera(架空プログラミング塾)

WEB
課題
コーディング
トレース
Healthem(架空企業)

WEB
課題
コーディング
トレース
Bloom(架空フラワーアレンジメント教室)

WEB
課題
コーディング
トレース
Marine Coffee(架空カフェ)

DTP
課題
はがき
Illustrator
観葉植物専門店(架空)
広告はがき
広告はがき

DTP
課題
チラシ
Illustrator
食器イベント(架空)
来場促進用配布チラシ
来場促進用配布チラシ

DTP
課題
チラシ
Illustrator
ふれあい動物園(架空)
来場促進用チラシ
来場促進用チラシ

DTP
課題
はがき
Illustrator
眼鏡店(架空)
新規開店宣伝用ポストカード
新規開店宣伝用ポストカード

DTP
課題
はがき
Photoshop
結婚式の招待状(架空)

DTP
課題
フライヤー
Photoshop
Kunii Chihiro写真展(架空)
フライヤー
フライヤー

DTP
課題
チラシ
Photoshop
椅子の展覧会(架空)
来場促進用配布チラシ
来場促進用配布チラシ

DTP
課題
はがき
Photoshop
レストラン(架空)
新規開店宣伝用ポストカード
新規開店宣伝用ポストカード

WEB
デザイン
コーディング
ナイトカフェ「ハリネズミの夜」(架空カフェ)

WEB
デザイン
コーディング
ポートフォリオサイト(このサイト)

コーディング
トレース
ENGBODY(架空ジム)

コーディング
トレース
Wed Design Conference (架空セミナー)

コーディング
トレース
START(架空企業)

課題
コーディング
トレース
Kissa(架空カフェ)

課題
コーディング
トレース
Codera(架空プログラミング塾)

課題
コーディング
トレース
Healthem(架空企業)

課題
コーディング
トレース
Bloom(架空フラワーアレンジメント教室)

課題
コーディング
トレース
Marine Coffee(架空カフェ)

DTP
課題
はがき
Illustrator
観葉植物専門店(架空)
広告はがき
広告はがき

DTP
課題
チラシ
Illustrator
食器イベント(架空)
来場促進用配布チラシ
来場促進用配布チラシ

DTP
課題
チラシ
Illustrator
ふれあい動物園(架空)
来場促進用チラシ
来場促進用チラシ

DTP
課題
はがき
Illustrator
眼鏡店(架空)
新規開店宣伝用ポストカード
新規開店宣伝用ポストカード

DTP
課題
はがき
Photoshop
結婚式の招待状(架空)

DTP
課題
フライヤー
Photoshop
Kunii Chihiro写真展(架空)
フライヤー
フライヤー

DTP
課題
チラシ
Photoshop
椅子の展覧会(架空)
来場促進用配布チラシ
来場促進用配布チラシ

DTP
課題
はがき
Photoshop
レストラン(架空)
新規開店宣伝用ポストカード
新規開店宣伝用ポストカード
自分自身よりもまず作品を見ていただくために、すぐに創作物が目につくように配置。また、自分の好きなもの(空とハリネズミ)をサイトに盛り込み、自分自身のこともさりげなくアピールしました。
ハリネズミのイラストはIllustratorで、似顔絵はClip Studio Paintで作成しました。ドラッグしていくと、左下のハリネズミの画像が変わっていくところがポイントです。
トップページのデザインカンプはIllustratorで、創作物のページのデザインカンプはAdobe XDで作成しました。