WEBサイトについて 子供が喜ぶイベント用品特集＋@

半袖でも普通に過ごせる季節になっていましたが、皆様はいかがお過ごしでしょうか？私はサブサイトの名古屋イベント会社にて、日々コンテンツを拡充させていっておりました。

それと同時に「＋＠でもしかして出来るんじゃないかな」と思ったことがあり、それの実装を部分的にWEBサイト上に実装していました。それが何なのかは後述するとして、まずは本題である「子供が喜ぶイベント用品特集」をお送りします。

子供が喜ぶイベント用品一覧

商品カテゴリーは大きく分けて「祭り用品」「エアー遊具」「着ぐるみ」の3種類を絞り込めるようにしました。

何があると子供が喜ぶか？

子どもたちが喜ぶアイテム達には、幾つか共通点があります。例えば、上記アイテム達には以下の特徴があります。

• 将来の夢が垣間見える
• 目一杯身体を動かして遊べる
• カラフルで目を引くものがある
• かっこいい/かわいいものと触れ合える
• 小さいうちは乗れない乗り物に触れ合える
• いろいろと触ってみたくなる仕掛けがある
• 世の中にある様々なものを知る機会がある・学習に繋がる

プラスαで実装した機能

今回は2つのプルダウンボックスで、カテゴリーとタグを絞り込んで出力結果が得られるようにしました。実はこれ、沢山読み込んだ上で絞り込みを行うととんでもないエネルギー量がかかってしまうんです。

ちなみに、普段はこんなタブ切り替えを使っています。

これは看板・イーゼル・サインスタンドという3コンテンツを予め読み込んだ上で視覚的な絞り込みを行っています。例えば上記画像の例だと、看板タブがONになっている間はイーゼルとサインスタンド一覧は読み込まれてはいるものの非表示になる仕組みです。

※これくらいの数に絞られていれば、そこまで負担は多くありません。

今回は、絞り込みを行うと出力する仕掛けになっている

今回は、プルダウンによりかなり沢山の項目を絞り込めるようにしてあります。たとえば[どうぶつ着ぐるみ][うさぎ]を選ぶと写真のようにうさぎの着ぐるみが表示されるわけですが、プルダウンで決定した瞬間、10件だけ決まった箇所に条件に合うデータを吐き出しなさいという命令が実行されているんです。

つまり予め大量のデータを読み込んでスタンバイさせているのではなく、必要な時に必要な分だけ取り出すようにしました。また、画面遷移はありません。視覚的なリフレッシュを入れなくても、その場で出力できます。

こんなところに実装しています！

弊社WEBサイトのトップページには、絞り込みボックスがありました。このボックスで絞り込みを行うと、これまでは別ページにジャンプしていましたが、現在では同じページ内で絞り込むことが可能になっています。

デザインにエネルギー効率を

ユーザーのストレスを減らしたい。これはWEBサイトリニューアル当初から目指していたことです。ではストレスってなんだろう？

読み込みの待ち時間や、視覚的な混乱、目的地にたどり着くまでのプロセスの多さ・・・色々ありますが、私たちはこれらを先回りして情報を設置する事に努めています。

本日は「子供が喜ぶイベント用品」としてお見せしましたが、全然違う使い方もできそうなので新しい技術が見つかったことに感謝しつつ、本日はここで筆を置かせていただきます。