OTONATIC (おとなちっく)

子どもは背伸びして大人になる

logo.png

http://bmkids.kayac.com/kids-present/
※iPhoneをお持ちの方は是非iPhoneでご覧下さい。
同じHTML5を使っておりますが、iPhone用にカスタマイズしております。


【OTONATIC】(おとなちっく)とは一言で言うと
子どもが背伸びするプレゼント
まとめサイトです。

しかし!!
ただの商品一覧ページの
サイトではございません!!

その説明は後ほど。
-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
子どもが大人に憧れて背伸びしたくなる気持ち...
背伸びをすることで少しずつ子どもは大人の階段を上ります。
それを叶えてくれるアイテムを集めたサイトが
「OTONATIC(おとなちっく)」です。
-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+

ポイントは以下です!

<技術的な見所
技術的なチャレンジとして最新のHTML5で本サイトは作成しております。
そのためPCとiPhoneとでは同じデータで見せ方を変えています。

同じアドレス
PCで見た場合は「大人用」の商品一覧サイト。
シンプルでスムーズにサイトが閲覧出来るように整理されています。
スクリーンショット(2010-12-21 14.14.55).png


一方、iPhoneで見た場合は
「子ども用」運試しサイトになります。
商品をいきなり見せずに、お絵描きした絵や図柄によって「ゲット」ボタンを押すとプレゼントが登場します。
その時にちょっとした仕掛けがあり。おもちゃが出る場合、お手伝いの指示が出る場合があります。
是非、親子で見て「ごほうび」「お手伝い」かドキドキ運試ししてみてください。



このお絵描き機能も驚きのHTML5で作成しております。HTML5って色々できちゃうんですね!
img_iphone_01.jpg

その他の見所)
・iPhoneを振ると鉛筆の色が変わります。
・iPhoneを傾けるとサイトが居眠りしちゃいます。



運試しiPhone使い方
1)iPhoneでサイトのURLを開きます

2)サイトが立ち上がったら、画面に子どもに絵を描かせます

img_iphone_01.jpg


3)絵を描いたらGETボタンを押します
ポヨン!って画像が飛び出してきます!
たまにお手伝いカードも入っているので、それが出たら子どもにお手伝いしてもらいます。

img_iphone_02.jpg

4)"プレゼント"もしくは"お手伝い指令"が結果としてGET出来ます

5)絵を描いた結果を見て、お子さんと楽しみましょう

6)GETしたプレゼントは一覧フォルダに蓄積されます
img_iphone_03.jpg
※iPhone上にデータを保存しているため、見る端末を変えるとデータは引き継がれません。

7)プレゼントを買ってあげる場合はそのままリンク先のamazonで購入する事が可能です

 

CSS Nite LP, Disk 13

bnr_cssnite110122.gif

この件は監督(別名:えど)がCSS niteで詳しく語ってくれるよ!

ページの先頭へ戻る