web屋という仕事のこれから web動向からweb屋に必要な技術を考えてみる
TRANSCRIPT
Web屋という仕事のこれから
2015.5.16 FutureSync Vol. 5
Bathtimefish 村岡 正和
～Web動向からWeb屋に必要な技術を考えてみる～
HTML5-WEST.jp代表 / html5j マークアップ部 部長 / HTML5 Experts.jp メンバーGDG京都 / CSS Nite in OSAKA / 神戸ITフェスティバル実行委員など
むらおか まさかず
村岡正和
HTML5-WEST.jp
Webアプリケーション開発 IT業務システム設計/開発Webサービス導入/事業戦略コンサルティング
@bathtimefish
Firefox OSの 薄い本書きました。
http://goo.gl/mA8ebW
好評発売中！
開発に、「もえあがる」のはつきものだ
第一話 がいあハックス （Gaia開発環境の構築とデバッグ）
著
また書きました。
C86
第一話 WebIDEを使いこなす （WebIDEを使ったアプリ開発法） 著
http://goo.gl/IzkT5m
FirefoxOSアプリ開発のやり方書きましたhttp://codezine.jp/article/detail/8476
監修しました。
実例ごとの実装例がたくさん書いてあります。ウェブサイト制作やCMSの運用時に便利です。
好評販売中！！
HTMLマークアップの勉強会を主催https://html5experts.jp/bathtimefish/6644/
日本ウェアラブルデバイスユーザー会
w-ug.jp
w-ug.jpいますぐ登録！
ウェアラブルデバイスを着けるとカッコイイ！！
素材次第！？
WEB of Things
WoT
JSでクラウドセンサー作ったら取材されたhttp://special.nikkeibp.co.jp/ts/article/ad0h/172223/
日経エレクトロニクスにも載った。
日経エレクトロニクス 2014.6.23 号
Arduino
Espruino
Tessel
http://cylonjs.com/
https://github.com/rwaldron/johnny-five
http://www.espruino.com/
https://tessel.io/
BeagleBone Blackhttp://beagleboard.org/Products/BeagleBone+Black
http://au-fx.kddi.com/
Open Web BoardSperk corehttps://www.spark.io/
http://www.we-io.net/
WEIO
勉強会やってます。
記事書きました。http://html5experts.jp/bathtimefish/13109/
まとめ
画面の中だけの仕事は安くなる一方。
ハードウェアとか画面の外の技術を 身につけて、Web技術と組み合わせて 新しい仕事をつくっていこう！
ありがとうございました！
所要時間: 10分
。。。時間があまったので、
Web技術で開発できる デバイスを紹介します。 （コレクション自慢）
現在、Web技術で開発できる ハードウェアなんて少ねんじゃね？
JS Board
Arduino
Espruino
Tessel
http://cylonjs.com/
https://github.com/rwaldron/johnny-five
http://www.espruino.com/
https://tessel.io/
BeagleBone Blackhttp://beagleboard.org/Products/BeagleBone+Black
http://au-fx.kddi.com/
Open Web BoardSperk corehttps://www.spark.io/
http://www.we-io.net/
WEIO
https://www.kickstarter.com/projects/gfw/espruino-javascript-for-things
http://www.espruino.com/
https://gist.github.com/bathtimefish/d29319dc87c6d046480c
電子工作できなくてもできる解説書きましたhttp://bathtimefish.hatenablog.com/entry/2014/12/14/161305
秋月とかで買える センサーがふつうに 付けられる
Arduinoでよく使われるセンサーを意識してる感じ
ビルトインライブラリが豊富でプログラミングが手軽にできる
http://www.espruino.com/Tutorials
日本語のチュートリアルも豊富http://qiita.com/advent-calendar/2014/espruino
https://html5experts.jp/rockymanobi/13648/
ウチの猫トイレで稼働中
先日、さらに すごいのが来た！
http://www.espruino.com/Pico
USBメモリ基盤サイズで
超小型組み込みデバイス
がJSで開発可能に
Tesselhttps://tessel.io/
別売りのモジュールをつけるだけ 配線の知識不要
現時点で唯一国内販売されているJS Boardhttps://www.switch-science.com/catalog/list/563/
https://gist.github.com/bathtimefish/55cc8ef0998d44cc0fb3
node.js互換のAPI モジュールライブラリは npm でインストールできる
さらにすごいのが プレオーダー中！
https://tessel.io/Tessel2
小型化 + Ethernet + USBx2
https://www.spark.io/
Spark Core
http://docs.spark.io/api/
デバイス側はArduinoライクな言語で開発クラウドでコンパイル、Wifiでファーム書き換え&実行Rest APIでデバイスのI/Oを制御する
https://github.com/spark/sparkjs
https://github.com/spark/spark-server/
https://github.com/spark/spark-protocol
http://blog.particle.io/2015/05/13/spark-is-now-particle/
猫トイレセンサー2号機を開発中。
https://store.spark.io/
廉価版のPhoton, SIM版のElectronがプレオーダー中
http://www.we-io.net/
http://www.we-io.net/doc/examples.html
HTML, JS, CSSで開発したプログラムを実行できるIoTデバイス
OpenWRT(Linux) ベース
さすがにやりすぎ じゃないかと思った ｗ
https://www.indiegogo.com/projects/pocketduino-innovation-from-your-pocket
Androidに装着するためのArduino miniAndroidデバイスを様々なセンサー等で拡張可能Android SDKで開発。つまりJavaなのが気に入らなかった
https://github.com/bathtimefish/cordova-plugin-pocketduino
Cordova Plugin書きました。
Cordovaでアルコールセンサーのデータを受信 CSS Transitionでビールのメーターを制御してる
https://www.mozilla.org/ja/firefox/os/devices/tv/
https://www.kickstarter.com/projects/matchstick/matchstick-the-streaming-stick-built-on-firefox-os
https://github.com/fxosorg/firefoxos-stb-appjam
https://github.com/fxosorg/firefoxos-stb-appjam/blob/master/sample/stb-hands-on-sample/js/tv_api.js
WebIDEから起動してみた
まだ足りない？
Wearable Device
Android WearでHTML5
http://blog.ludei.com/cocoonjs-enables-android-wear-html5-app-development/
http://bathtimefish.hatenablog.com/entry/2015/02/10/151129やりかた書きました。
http://www.reconinstruments.com/products/jet/
先週 Recon Jetが届いたので、
Mobile Chrome App (Cordova + Crosswalk) をつくってインストールしてみたら動いた。
https://gist.github.com/bathtimefish/c32f94c09a062f3d7c05
スマートグラスもHTML5でいける。
https://www.thalmic.com/en/myo/
3軸 加速度センサー
3軸 ジャイロセンサー
3軸 磁気センサー
筋電位センサー
腕の動きと筋電位による指の動きを検知することができる
BluetoothでPC、モバイルなどのデバイスと連携できる
https://github.com/logotype/MyoJS
https://github.com/logotype/myodaemon
WebSocketでリアルタイム通信が可能。
https://www.kickstarter.com/projects/597507018/pebble-time-awesome-smartwatch-no-compromises
http://developer.getpebble.com/guides/js-apps/pebblekit-js/
ウェアラブルデバイスの普及はアプリ開発の加速がカギ。
開発者が容易&開発者の多いJavaScriptを採用する デバイスが今後も増加する可能性は高いと思う。
ウェアラブルでHTML5 いつやるの？
次はコイツをどうにかしたい
日本ウェアラブルデバイスユーザー会
w-ug.jp
w-ug.jpいますぐ登録！
まとめ
FlashをHTML5に書きなおす仕事は価格競争
ソシャゲは賞味期限短くてデスマループ
RWDも当たり前になって価格競争
SEO(笑)
ReactとかAngular言うけどまじみんな 仕事でつかってんの？
そろそろWeb屋は、
いま、Webの専門技術を渇望しているのは画面の外の業界。 組み込み系、デバイスメーカー等と組んでWebを中心とした サービスの企画・開発が将来の仕事につながると思うから。
画面の外に出るべき。
HTMLやJavaScriptがWeb屋の本質 ではありません。
日常的にWebに携わっている中での経験や知見、 そこから独自の発想ができることがWeb屋の強み。
これからは、Web屋の強みを他の業界で発揮することが新しいビジネスチャンス、スキルアップにつながると思います。
マジで新しくて 面白いこと やりましょう！
Thanks !