web制作課題 ECサイト
ECサイトをデザインからコーディングまで行いました。
※画像をクリックすると大きなサイズで見ることができます。
この課題では、コーディングよりもデザインのほうに悩みました。
なかなかレイアウトやデザインが決まらず、
いろいろなECサイトを見ながら研究したのですが、
参考にしたサイトが多すぎて逆に迷ってしまう始末…
デザインを
仕上げ、コーディングに入る時に｢ホントに組めるのか…？｣とすごく不安になりました。
webサイト 制作概要
| 課題名 |
ECサイト製作（雑貨サイト Macky） |
| 制作内容 |
素材として配布された商品写真を見て、自分なりにターゲットを想定し、それに見合ったデザインを考え、商品が売れるサイトを制作。 |
サイト仕様 |
- 横幅：980px カラー：RGB
- ターゲット：若い女性（20代～30代をターゲット）
- キーカラー：白
|
| コンセプト |
女性に好まれる,綺麗で見やすいデザイン |
| 制作時間 |
|
| 制作月 |
２０１５年８月 |
| 制作環境 |
IllustratorCS5,PhotoshopCS5 |
| サイトの概要・目的 |
- 主に一般消費者を対象としたネットショッピングサイト
- アンティークやインテリア、贈答品から気軽に使える雑貨まで取り揃えているサイト。（幅広い商品のラインナップ）
- サイトを通じて商品が売れること。サイト自体の認知度アップ。
|
| デザイン（クライアント）要望 |
- 整理されて見やすいレイアウト。
- 特集やキャンペーンにお客様を誘導できるよう、目立たせる。
- カテゴリ一覧は、文字ばかりにならないように工夫する。
- 商品の豊富さを印象つけられるようなトップページに。
|
| 必須要素 |
- サイトロゴ（ショップ名｢Macky｣）
- 特集の告知（季節柄や、サイトの性格を想定して特集を４つ考える）
- 各種バナー（訪問者別の誘導バナー、サービス紹介など）
- 人気商品の紹介
- スタッフのお勧め（３点ほど）
- 新着アイテム
- ショップからのお知らせ
- ショッピングガイド
- 商品カテゴリ一覧
- ヘッダー、グローバルナビ、フッター
|
| 製作意図 |
- ターゲットを20代～30代の若い女性と想定して、その年齢層に指示されるサイト作りを考えた。
サイト全体の印象としては女性に好まれる綺麗な印象のサイトに。
その為、清潔感のある白をキーカラーとし、メインビジュアルのスライドでインパクトを与えて目を引き、その下から特集バナーや、商品の豊富さをアピールする為、画像をカテゴリー毎に配置。下部への導線途中に｢お知らせ｣欄を設け、アクセントを加えた。
- 豊富な商品の画像でサイト自体が窮屈な印象にならないように余白の間隔を十分に空け、見易いように心がけた。細部に飾りをさり気なく装飾し女性に好まれるデザインに。ロゴもセリフ体で作成しサイトに合う様に仕上げた。
|
コーディングしたECサイトはこちらから
