Web関連

HTML5の最新技術を知ろう!~その2~

html5の技術を使ったトレンドを紹介させてもらいます。

今回紹介するのは、前回紹介したhtml5を使ったゲームの続報です。
前回の記事をまだ読んでないよ!という方は気が向いたら、
こちらから読んでいただければと思います

カギはジャイロセンサー

前回紹介させていただいたゲームもびっくりするぐらいきれいでしたが
さらなる驚きが用意されていました。

そのカギとなるのは、「ジャイロセンサー」でした。

ジャイロセンサーって何?と思う方もいるかもしれませんが
実は、今やほとんどの人が触れる機会があるものなのです。

例えば、スマホの向きを変えると自動でスマホの向きを判断して
画面が縦や横に切り替わる機能がありますよね、
あれを判断するのに使われているのがジャイロセンサーです。

ジャイロセンサーとは、「角速度」の計測、つまり回転の動きやその速さを検知することができるセンサーです。
身の回りでは、先ほど紹介したスマホやデジタルカメラの手ぶれセンサー、カーナビなどに使われています。

ジャイロセンサーで回転を計測する機能を使うということは
すでに、お気づきの方もいるかもしれません

そうハンドルになるのです!!

kato_2015-10-12_01.jpg

スマホがハンドル

先日、W3Cの方と打ち合わせをした時に
デモの一つとして見せていただき存在を知りました。

パソコンの画面にQRコードが表示され
それをジャイロセンサーをオンにしたスマホで読み込むと
前回紹介したゲームが起動します。

前回紹介したものでは、操作方法はキーボードを使ったものでしたが、
スマホをハンドルとして使用する方法に操作方法が変わっていました。

まず、パソコンでゲームのページにアクセスし
そこに表示されたQRコードを読み込まれたURLにアクセスすると
パソコンとスマホの画面が切り替わりそれぞれ読み込み中の画面が表示されます。

そして、読み込みが完了するとパソコンの画面がゲーム画面に
スマホの画面が操作方法を表示したものに切り替わります。

そして、ゲームがスタートしスマホをハンドルのように右や左に切ると
パソコンの画面内でマシンが同じ動きをするのです。

すごいですよね!

kato_2015-10-12_02.jpg

もう一つすごいこと

ジャイロセンサーでゲームができることもすごいのですが
実は、もう一つすごいことがあります。

それは、ゲームを行っている2台の端末がインターネットで同期していることです。
bluetoothなどを使った近距離で端末をぺアリングするものは以前よりありました。
ですが、htmlだけでリアルタイムでの同期通信を行っているのはすごいと思います。

まとめ

2回にわたり、html5の機能をゲームというアプローチで紹介しましたが、
いかがでしたでしょうか?html5には可能性があると思います。
他にもまだまだ、面白いものや、すごいと思うものがたくさんあります。
機会があれば、随時紹介していこうと思います。

ホームページ制作でお困りの方はホームページ制作会社ティファナにご相談ください!

お問い合わせはこちらから

関連するサービス

ホームページ制作

関連コラム

HTML5の最新技術を知ろう!

マーケ担当必見!国内ECマーケティングオートメーション(MA)事例前のページ

Web制作会社が教えるDDos攻撃からのWEBサイトを守る方法次のページ

ピックアップ記事

  1. AIに求められているものは、実は意外な物だった
  2. 新しい販売形態であるDtoCについて考えてみる
  3. 大手企業も注目するMaaS(Mobility as a Service)とは何か…
  4. 新型コロナウイルスで日本の働き方改革が起こる

関連記事

  1. Web関連

    Web制作会社でなくとも知っておきたい。ECサイト構築の前に考えておくべきこと

    一言でWeb制作と言っても、作るサイトによって手順もノウハウも変わって…

  2. Web関連

    日本の暦ってステキ ~3月3日について考えてみる編~

    こんにちは。ティファナコラム編集部 担当の遠藤です。みなさん、今日は何…

  3. Web関連

    【Web最新技術】クラウドが現実世界を変え始めた 駐車場編

    どこもかしこもデジタル化、IT化、そしてクラウド化。どんどん便利に…

  4. Web関連

    システム開発で大事なテストプロセス改善のポイント

     以前、他のコラムで「テストプロセス」について紹介されていましたが、今…

  5. Web関連

    コピーライトに込められた思い。尾形真理子から学ぶ言葉の作り方

    こんにちは!デザインよりプログラムの方が得意なデザイナー新人の山本です…

  6. Web関連

    最新の情報に敏感…!美容室のIT活用とは?

    最新の情報に敏感な方は結構多いですよね。そんな方は、デザイナー系の方に…

おすすめ記事

最近の記事

  1. デジタル化が旅行・観光業を救う!?ウィズコロナ・アフターコロ…
  2. 人が対応するのが正しいの?DX(デジタルトランスフォーメーシ…
  3. 人間拡張って聞いたことがありますか?デジタル化が背中を押して…
  4. テレワークだけでは足りない?デジタルシフトなど、アフターコロ…
  5. 【初心者向け】ここに注目!スマートフォン用バナーを作成しよう…

アーカイブ

  1. Web関連

    データセンターってなに?~初めて行ってみた!
  2. Web関連

    ストーリー仕立てでパララックスデザインを活用しよう
  3. Web関連

    iPhone5の両端から光が漏れてきた話
  4. AI関連

    健康の基本は睡眠から|AIで良質な睡眠を
  5. Web関連

    海外のハイクオリティな写真まとめサイト3選
PAGE TOP