Works
制作時間
全体 1か月/デザイン 2.5週間/コーディング 1.5週間
担当
デザイン/コーディング
- 制作目的
-
- 就職活動で、自分のスキルや人柄を分かりやすく伝えるため
- 制作実績やコーディング力をアピールするため
- 使用ツール
-
- Figma
- Visual Studio Code
- ターゲット
-
- 企業の採用担当者
- コンセプト
-
- 自分らしさを表現しながら、情報が見やすく伝わるデザイン
- 工夫した点
-
- 強みやできることを一目で理解できる構成にした
- 作品ごとに制作内容や使用技術を掲載し、スキルが伝わるようにした
- 配色や余白を意識し、読みやすさを重視した
- 苦労した点
-
- 強みやできることを一目で理解できる構成にした
- 作品ごとに制作内容や使用技術を掲載し、スキルが伝わるようにした
- 配色や余白を意識し、読みやすさを重視した
- 初めてデザインからコーディングまで一人で制作したため、デザインの基礎を学びながら制作を進めた
制作時間
全体 1か月/デザイン 2週間/コーディング 2週間
担当
デザイン/コーディング
- 制作目的
-
- 来場者数の増加につなげるためを図るためのサイトリニューアル
- 使用ツール
-
- Figma
- Canva
- Visual Studio Code
- ターゲット
-
- 子ども連れのファミリー層
- 若いカップル
- コンセプト
-
- 海の世界を感じられる、ワクワク感のあるサイト
- 工夫した点
-
- 水族館らしい青を基調とした配色にした
- アニメーションを取り入れ、楽しさを演出した
- 写真を大きく配置し、館内の雰囲気が伝わるようにした
- 回遊しやすいシンプルな導線を意識した
- 苦労した点
-
- 初めてモーダルウィンドウを調べながら自力で実装したこと
- JavaScriptの動作確認を繰り返しながら完成させた
制作時間
1日
担当
デザイン
- 制作目的
-
- ジムの新規会員獲得
- 使用ツール
-
- Illustrator
- Photoshop
- ターゲット
-
- 10～40代の男性
- コンセプト
-
- 高級感と力強さを感じられるデザイン
- 工夫した点
-
- 影やコントラストを活用し、高級感を演出した
- 重要な情報が目立つよう文字サイズや配色を工夫した
- トレーニングの力強さが伝わる写真を使用した
- 苦労した点
-
- 写真の上でも文字が読みやすくなるよう、背景や影を調整した
制作時間
2日
担当
デザイン
- 制作目的
-
- 夏休み旅行の予約促進
- 使用ツール
-
- Illustrator
- Photoshop
- ターゲット
-
- 夏休みに旅行を計画している大学生
- コンセプト
-
- 夏らしい開放感と旅行へ行きたくなるデザイン
- 工夫した点
-
- 青空や海をイメージした爽やかな配色にした
- 価格やキャンペーン情報を目立つ位置に配置した
- 写真を大きく使用し、旅行先の魅力を伝えた
- 苦労した点
-
- 写真・文字・装飾のバランスを調整し、情報量が多くても見やすいレイアウトにした
制作時間
1日
担当
デザイン
- 制作目的
-
- 中古住宅のリノベーションサービスを訴求し、問い合わせや資料請求につなげるため
- 使用ツール
-
- Illustrator
- Photoshop
- ターゲット
-
- 30～50代の住宅購入を検討している夫婦・ファミリー層、コストを抑えながら理想の住まいを実現したい人
- コンセプト
-
- 高級感のある住空間の写真を使用し、リノベーションでも理想の暮らしが実現できることを印象付けるデザイン
- 工夫した点
-
- 白文字にシャドウを加えてキャッチコピーの視認性を高め、背景写真の上でも読みやすくなるよう工夫した
- オレンジ色の円形ボタンを配置し、CTA（詳しくはこちら）を目立たせたことで視線を集め、クリックや問い合わせにつながるようにした
- 背景の雰囲気を活かしながら文字が埋もれないよう、文字色や影、配置を何度も調整して視認性を確保した
- 苦労した点
-
- 写真・文字・装飾のバランスを調整し、情報量が多くても見やすいレイアウトにした
制作時間
2日
担当
デザイン
- 制作目的
-
- 写真展への来場者を増やすため
- 使用ツール
-
- Illustrator
- Photoshop
- ターゲット
-
- 写真や自然が好きな20～60代
- コンセプト
-
- 写真の魅力を引き立てるシンプルで落ち着いたデザイン
- 工夫した点
-
- 写真を主役にするため装飾を最小限にした
- 情報の優先順位を整理し、視線誘導を意識した
- 温かみのある配色で写真展の雰囲気を表現した
- 苦労した点
-
- 写真と文字のバランスを調整し、作品の魅力を損なわないレイアウトを考えた
制作時間
2日
担当
デザイン
- 制作目的
-
- 新店舗オープンの告知と来店促進
- 使用ツール
-
- Illustrator
- Photoshop
- ターゲット
-
- 10～40代のファストフード利用者
- ファミリー層
- コンセプト
-
- 食欲をそそる温かみのあるデザイン
- アメリカンダイナーをイメージしたデザイン
- 工夫した点
-
- 商品写真を大きく配置し、おいしさが伝わるようにした
- メニュー価格やセット内容を見やすく整理した
- オレンジやブラウンを使用し、温かみを演出した
- 苦労した点
-
- 写真・価格・説明文の情報量が多くならないよう、レイアウトを何度も調整した
制作時間
1日
担当
デザイン
- 使用ツール
-
- Illustrator
- Photoshop
- コンセプト
-
- 誠実さと上品さや落ち着いた印象を与えるデザイン
- 工夫した点
-
- 名前を大きく配置し、第一印象に残るレイアウトにした
- 文字サイズや余白を調整し、情報を見やすく整理した
- 裏面では提供できるサービスを箇条書きにし、一目で内容が伝わるようにした
- 苦労した点
-
- 背景画像と文字が重ならないよう、文字色や透明度を何度も調整した
制作時間
1日
担当
デザイン
- 使用ツール
-
- Illustrator
- Photoshop
- コンセプト
-
- 親しみやすさや柔らかさなどの人柄が伝わるデザイン
- 工夫した点
-
- 背景を斜めに分割し、視線が自然に情報へ流れるレイアウトにした
- 落ち着いた配色で統一し、親しみやすさと信頼感を両立させた
- イラストと写真を組み合わせることで、オリジナリティを表現した
- 苦労した点
-
- イラストと背景写真が違和感なく馴染むよう、色味を何度も調整した
制作時間
1日
担当
デザイン
- 使用ツール
-
- Illustrator
- Photoshop
- コンセプト
-
- 余計な装飾を省き、自分の作品を印象付けられるデザイン
- 工夫した点
-
- 表面いっぱいに作品写真を配置し、写真を最大限アピールした
- タイトルと名前は太めのフォントを使用し、写真に負けない存在感を持たせた
- 裏面には連絡先とInstagramのQRコードをまとめ、必要な情報へすぐアクセスできるようにした
- 苦労した点
-
- 写真と文字のバランスを崩さないよう、配置や余白を細かく調整した