面白い・クリエイティブなEコマースサイト

投稿者:chikunai 投稿日時:2008-02-12(火) 20:00

design walkerっていうブログに、面白いEコマースサイトが乗ってます。

http://www.designwalker.com/2008/02/creative-ecommerce.html

相当ボリュームがあるので、一部抜粋してコメント。

●GUCCI
http://www.gucci.com/jp/

GUCCIはFlashを使わず、JavaScriptで作られています。
prototype.jsを使っています。

アクセサリーのカタログは、
インターネットユーザーに横スクロール恐怖症が多いにもかかわらず、
とても横長なページ構成になっています。

http://www.gucci.com/jp/catalog/fine-jewelry-exclusive/

ページの一番左側にあるサムネイルをクリックすると、拡大画像のところへ移動します。
以前、↓JavaScriptで遊びで作ったコレに近いテクニックです。

エティック キャリバーでくるくる
http://www.chikunai.net/goods/20070906/index.html

他にも春夏コレクションは、さらに改良されていて面白い動きをします。

http://www.gucci.com/jp/japanese/jp/spring-summer-08/handbags/

JavaScriptはブラウザーによって挙動が異なります。
そのため、多くのブラウザーに対応させるのに苦労するため、
込み入った開発は嫌われています。

春夏コレクションは動きが遅い!
せっかちな私には、ちょっと待てないです。

●Soia Kyo
http://www.soiakyo.com/

ファッションのショップです。
モデルのズームがおそっ!もっと素早いと面白いのですが。

●Under
http://www.underunder.com/store/

靴のショップです。
3次元で商品を見せていますが、目がチカチカします。

●Neovision
http://neovision.jp/

商品が下から上へゆっくり流れる画像素材を販売するショップです。
タグクラウドのように、商品の売り数やPV数によって画像の大きさを変える。
ような見せ方として使うと面白いかもしれません。

●KOBALT SHOP
https://www.kobaltshop.com/

商品をクリックするとメニューの文字がマトリックス風に動きます。
Flashがやや重いです。

●PYLONES
http://www.happypylones.com/

可愛いアニメーションがGOOD!
でも作るのは大変そうです。推奨したい商品を切り替えるのに苦労しそうです。

●Abercrombie & Fitch
http://www.abercrombie.com/anf/index.html

アバクロのショップ。
デザインがとてもまとまっていて世界観をかもし出している。
商品が綺麗にアイロンがけされておらず、くしゅくしゅ感が新しい。
また商品一覧の横スクロールがとても使いやすい。
日本にも配送できるみたいです。

●Free People
http://www.freepeople.com/index.cfm

ファッションのショップです。
面白い挙動をするわけではありませんが、
細部まで生地を部品に使っていて、かわいらしいサイトです。

こういったサイトは、ブランディングとしてカッコいい事、世界観を醸し出している事は良いかもしれない。

しかし、売れるとは限らない。

インターネットの場合は特に使い勝手(ユーザービリティ)が重要。視認性や操作性を満たして顧客の買い物体験を上げつつ、デザインにこだわるのが正しい順番です。

他にも、たくさん乗っていますので、お時間がありましたら見てください。

http://www.designwalker.com/2008/02/creative-ecommerce.html



新しいコメントの投稿

  • ウェブページアドレスとメールアドレスは、自動的にハイパーリンクに変換されます。
  • 使用できるHTMLタグ: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd>
  • 行と段落は自動的に折り返されます。
  • You can use BBCode tags in the text. URLs will automatically be converted to links.
  • 次のタグを使用してソースコード構文をハイライトすることができます。: <code>, <blockcode> The supported tag styles are: <foo>, [foo].
  • You may insert videos with [video:URL]

書式オプションに関するより詳しい情報...

CAPTCHA
この問題はユーザが人間であるかどうかをテストし、スパムによる自動投稿を防ぐためのものです。
Image CAPTCHA
Enter the characters shown in the image.