Facebook 【ホームページ制作】生涯学習・就職支援スクール まなクル
Logo

【ホームページ制作】生涯学習・就職支援スクール まなクル

クレジット
Avatar
ウェブデザイナー
制作ノート
ホームページ制作の詳細

通学していた職業訓練校自体のホームページをリニューアルするといった課題として、仮ではありますが以下のフローに沿って制作いたしました。

1,調査フロー

 ヒアリング調査→ペルソナ作成→キーワード調査→競合調査→ブリーフ作成

2,設計フロー

 サイトマップ作成→ワイヤーフレーム作成→デザインコンセプト作成

3,制作フロー

 カンプ作成→アセット生成

4,開発フロー

 マークアップ→スタイリング→インタラクティブ実装→ローンチ

☆意図・ポイント

クライアントからのヒアリングを踏まえた内容およびペルソナやデザインコンセプトを元に設計を進めた。

実際のサイトは、かなりコンテンツがバラけているので、シンプルなワンカラムを選び、分かりやすい配置を心がけた。

☆問題と解決策

カルーセル(slick)やハンバーガーメニュー(js)の実装で、かなり苦戦をしたが、先生やクラスメートに助言を求めたり、ネットで調べたりして、完成に漕ぎ着けることが出来た。

☆結果

練習題材であるため公開は出来ないが、初めてのコーディングによるウェブサイト制作としては悪くないかなと。

現在は、トップページを含めた4ページのみ完成している状況なので、日々、ページ数を増やして、アップデートをしていく。

シェア
渡辺 敏弘の他の作品
画像
作品を見る
メンバー募集用チラシ
画像
作品を見る
【WEB用画像】
画像
作品を見る
【WEB用画像】