友人のポートフォリオサイトのモックアップ画像

コーポレートサイト制作

OTHERS

①制作経緯
「コーディングが苦手だからその後自分で実装することを考えると自由にデザインできない」と言っていた職業訓練校の友人のポートフォリオサイトのコーディングを代わりに担当。
②作業範囲
コーディングのみ。
(TOP&下層1ページ、計2ページをコーディング)
③制作時間
約15時間
④使った言語
HTML / CSS / jQuery / JavaScript
Lightbox(jQueryプラグイン)
⑤概要/工夫した点/学んだこと
  • 経歴のタイムラインの実装。PC・タブレット・SPで細かく変わる各コンテンツの背景色や画像の配置に少し苦労した。

  • もともと前職でデザイン関連の仕事をしていて、その際illustratorを使うことが多かったそうでカンプも最初はAIデータでもらった。
    しかしレスポンシブ対応するのが物理的に難しいデザインだったので、途中でデザインを少し変更しタブレットカンプも追加となった。

  • そのタイミングでPSDデータも合わせてつくってくれたので、AIデータは慣れないこともありその後はPSDデータを参照することにしてしまった。

  • 実装に着手する前にレスポンシブを考慮したデザインについてこちらから提案ができれば、またAIデータだけでコーディングできればもっと工数を減らして短期間で完成させられたと反省した。

サイト全体を見る
Scroll