M's Portfolio Website No.07

トップページのデザインをPhotoshopで行い、Terapadでコーディングを行いました。
今回初めてjQuery(ジェイクエリー)を使用して、メインビジュアルのスライドショーを作成しましたが、内容が複雑なため作業が難航しました。
自分の思い描いた完成形にすることができなかったので、今後独学で勉強していこうと思います。

→コーディングしたサイトはこちら

課題名 ECサイト
サイトの概要・目的
  • 主に一般消費者を対象にしたネットショッピングサイト。
  • プレゼントやギフトから日常で気軽に使える雑貨まで取り揃えている。
  • サイトを通じて商品が売れること、サイト自体の認知度アップが目的である。
デザインの要望
  • 整理されて見やすいレイアウトにする。(グリッドデザイン)
  • 特集やキャンペーンは、バナーを配置して目立つようにすること。
  • カテゴリ一覧は、文字ばかりにならないように工夫する。
  • 商品の豊富さを印象付けられるような、情報量の多いトップページにする。
必須要素 サイトロゴ(Macky)、特集の告知(メインエリアとサイドバーの両方)、各種バナー(特集以外のキャンペーン、サービスなど)、人気商品(3位まで)、スタッフのおすすめ(3点程度)、新着アイテム、ショップからのお知らせ、ショッピングガイド、カテゴリ一覧、ヘッダー、グローバルナビ、フッター、メインビジュアル
サイト仕様
  • 横幅:960px(高さは任意)
  • キーカラー:明るい雰囲気のサイトになるような色を提案
  • ターゲット:商品写真から想定できる主要購買層(個々に考える)
制作意図 北欧家具やナチュラルな雑貨を販売している店舗をイメージしました。商品画像やバナーがカラフルな為、コンテンツのカラーはベージュ、ネイビー、ホワイトなど色数を抑え、落ち着いた雰囲気で全体を統一しました。
制作期間(時間) 約30時間(デザイン+コーディング)
制作環境 Illustrator CS4&5、PhotoshopCS4&5、TeraPad

▲ PageTop

copyright © 2014 Webマーケティングデザイナー養成科 第3期生 生徒作品.All rights reserved.