メディコム・トイのBE@RBRICKオフィシャルサイト

皆さんご存知のベアブリックのオフィシャルサイト。おもちゃ屋や雑貨屋で見かけると、ついつい見とれてしまいますよね。

サイトデザインは青色がメインカラーとして使われていて、清潔感のある爽やかな感じにデザインされています。トップページで使用されている大きめの画像は、flashではなくJavaScriptで動きが制御されていて、楽しい雰囲気が表現されています。こんな動きもJavaScriptで実現することができるんですね。

大きめの画像をクリックしたり、ページ中断にある背景が黒色の部分のサムネイルをクリックすると、こんな↑感じで大きめの画像が表示されます。小さくてコロコロしている感じも可愛いですが、大きい画像でベアブリックを見ても可愛いですね。ここでは簡単にそれぞれのベアブリックのコンセプトなどを見ることができます。

商品の案内は、こんな↑感じ。これだけ色々なベアブリックが並ぶと圧巻ですね~。トップページ以外は、こんな感じのレイアウトで統一されています。

それぞれのベアブリックをクリックすると、こんな↑感じで大きい画像が表示されます。実際に購入できるものに関しては、購入可能のサイトへのリンクが設置されていて、別サイトから購入することができます。

色々なデザインのベアブリックが並べられていても変に見えない青色の清潔感溢れるサイトデザイン。カッコいいですね。シンプルに見えるサイトデザインですが、色々と考えられて、細かい部分まで気を使って制作されているのがわかります。

このサイトで使用されているJavaScriptも参考にさせてもらいたい箇所ですね。勉強させていただきます!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です