Web屋という仕事のこれから

1. Web屋という仕事のこれから 2015.5.16  FutureSyncVol. 5 Bathtimeﬁsh 村岡正和 ∼Web動向からWeb屋に必要な技術を考えてみる∼

2. HTML5-WEST.jp代表 / html5j マークアップ部部長 / HTML5 Experts.jp メンバー GDG京都 / CSS Nite in OSAKA / 神戸ITフェスティバル実行委員などむらおかまさかず村岡正和 HTML5-WEST.jp Webアプリケーション開発 IT業務システム設計/開発 Webサービス導入/事業戦略コンサルティング @bathtimeﬁsh

3. Firefox OSの薄い本書きました。 http://goo.gl/mA8ebW 好評発売中！開発に、「もえあがる」のはつきものだ第一話がいあハックス（Gaia開発環境の構築とデバッグ）著

4. また書きました。 C86 第一話 WebIDEを使いこなす（WebIDEを使ったアプリ開発法）著 http://goo.gl/IzkT5m

5. FirefoxOSアプリ開発のやり方書きました http://codezine.jp/article/detail/8476

6. 監修しました。実例ごとの実装例がたくさん書いてあります。ウェブサイト制作やCMSの運用時に便利です。好評販売中！！

7. HTMLマークアップの勉強会を主催 https://html5experts.jp/bathtimeﬁsh/6644/

8. http://kobekokaku.jp/ #kobekokaku 神戸市公安9課、起動。

9. 日本ウェアラブルデバイスユーザー会 w-ug.jp w-ug.jp いますぐ登録！

10. ウェアラブルデバイスを着けるとカッコイイ！！素材次第！？

11. WEB of Things WoT

12. JSでクラウドセンサー作ったら取材された http://special.nikkeibp.co.jp/ts/article/ad0h/172223/

13. 日経エレクトロニクスにも載った。日経エレクトロニクス 2014.6.23 号

14. Arduino Espruino Tessel http://cylonjs.com/ https://github.com/rwaldron/johnny-ﬁve http://www.espruino.com/ https://tessel.io/ BeagleBone Black http://beagleboard.org/Products/ BeagleBone+Black http://au-fx.kddi.com/ Open Web Board Sperk core https://www.spark.io/ http://www.we-io.net/ WEIO

15. 勉強会やってます。

16. 記事書きました。 http://html5experts.jp/bathtimeﬁsh/13109/

17. まとめ

18. 画面の中だけの仕事は安くなる一方。ハードウェアとか画面の外の技術を身につけて、Web技術と組み合わせて新しい仕事をつくっていこう！

19. ありがとうございました！所要時間: 10分

20. 。。。時間があまったので、

21. Web技術で開発できるデバイスを紹介します。（コレクション自慢）

22. 現在、Web技術で開発できるハードウェアなんて少ねんじゃね？

23. JS Board

24. Arduino Espruino Tessel http://cylonjs.com/ https://github.com/rwaldron/johnny-ﬁve http://www.espruino.com/ https://tessel.io/ BeagleBone Black http://beagleboard.org/Products/ BeagleBone+Black http://au-fx.kddi.com/ Open Web Board Sperk core https://www.spark.io/ http://www.we-io.net/ WEIO

25. https://www.kickstarter.com/projects/gfw/espruino-javascript-for-things http://www.espruino.com/

26. https://gist.github.com/bathtimeﬁsh/d29319dc87c6d046480c

27. 電子工作できなくてもできる解説書きました http://bathtimeﬁsh.hatenablog.com/entry/2014/12/14/161305

28. 秋月とかで買えるセンサーがふつうに付けられる Arduinoでよく使われるセンサーを意識してる感じビルトインライブラリが豊富でプログラミングが手軽にできる http://www.espruino.com/Tutorials

29. 日本語のチュートリアルも豊富 http://qiita.com/advent-calendar/2014/espruino

30. https://html5experts.jp/rockymanobi/13648/

31. ウチの猫トイレで稼働中

32. 先日、さらにすごいのが来た！

33. http://www.espruino.com/Pico

34. USBメモリ基盤サイズで超小型組み込みデバイスがJSで開発可能に

35. Tessel https://tessel.io/

36. 別売りのモジュールをつけるだけ配線の知識不要

37. 現時点で唯一国内販売されているJS Board https://www.switch-science.com/catalog/list/563/

38. https://gist.github.com/bathtimeﬁsh/55cc8ef0998d44cc0fb3 node.js互換のAPI モジュールライブラリは npm でインストールできる

39. さらにすごいのがプレオーダー中！

40. https://tessel.io/ Tessel2 小型化 + Ethernet + USBx2

41. https://www.spark.io/ Spark Core

42. http://docs.spark.io/api/ デバイス側はArduinoライクな言語で開発クラウドでコンパイル、Wiﬁでファーム書き換え&実行 Rest APIでデバイスのI/Oを制御する

43. https://github.com/spark/sparkjs

44. https://github.com/spark/spark-server/

45. https://github.com/spark/spark-protocol

46. http://blog.particle.io/2015/05/13/spark-is-now-particle/

47. 猫トイレセンサー2号機を開発中。

48. https://store.spark.io/ 廉価版のPhoton, SIM版のElectronがプレオーダー中

49. http://www.we-io.net/

50. http://www.we-io.net/doc/examples.html HTML, JS, CSSで開発したプログラムを実行できるIoTデバイス OpenWRT(Linux) ベースさすがにやりすぎじゃないかと思ったｗ

51. https://www.indiegogo.com/projects/pocketduino-innovation-from-your-pocket

52. Androidに装着するためのArduino mini Androidデバイスを様々なセンサー等で拡張可能 Android SDKで開発。つまりJavaなのが気に入らなかった

53. https://github.com/bathtimeﬁsh/cordova-plugin-pocketduino Cordova Plugin書きました。

54. Cordovaでアルコールセンサーのデータを受信 CSS Transitionでビールのメーターを制御してる

55. https://www.mozilla.org/ja/ﬁrefox/os/devices/tv/

56. https://www.kickstarter.com/projects/matchstick/matchstick-the-streaming-stick-built-on-ﬁrefox-os

57. https://github.com/fxosorg/ﬁrefoxos-stb-appjam

58. https://github.com/fxosorg/ﬁrefoxos-stb-appjam/blob/master/sample/stb-hands-on-sample/js/tv_api.js

59. WebIDEから起動してみた

60. まだ足りない？

61. Wearable Device

62. Android WearでHTML5

63. http://blog.ludei.com/cocoonjs-enables-android-wear-html5-app-development/

64. http://bathtimeﬁsh.hatenablog.com/entry/2015/02/10/151129 やりかた書きました。

65. http://www.reconinstruments.com/products/jet/ 先週 Recon Jetが届いたので、

66. Mobile Chrome App (Cordova + Crosswalk) をつくってインストールしてみたら動いた。 https://gist.github.com/bathtimeﬁsh/c32f94c09a062f3d7c05 スマートグラスもHTML5でいける。

67. https://www.thalmic.com/en/myo/

68. 3軸加速度センサー 3軸ジャイロセンサー 3軸磁気センサー筋電位センサー腕の動きと筋電位による指の動きを検知することができる BluetoothでPC、モバイルなどのデバイスと連携できる

69. https://github.com/logotype/MyoJS

70. https://github.com/logotype/myodaemon WebSocketでリアルタイム通信が可能。

71. https://www.kickstarter.com/projects/597507018/pebble-time-awesome-smartwatch-no-compromises

72. http://developer.getpebble.com/guides/js-apps/pebblekit-js/

73. ウェアラブルデバイスの普及はアプリ開発の加速がカギ。開発者が容易&開発者の多いJavaScriptを採用するデバイスが今後も増加する可能性は高いと思う。

74. ウェアラブルでHTML5 いつやるの？

75. 次はコイツをどうにかしたい

76. 日本ウェアラブルデバイスユーザー会 w-ug.jp w-ug.jp いますぐ登録！

77. まとめ

78. FlashをHTML5に書きなおす仕事は価格競争ソシャゲは賞味期限短くてデスマループ RWDも当たり前になって価格競争 SEO(笑) ReactとかAngular言うけどまじみんな仕事でつかってんの？

79. そろそろWeb屋は、いま、Webの専門技術を渇望しているのは画面の外の業界。組み込み系、デバイスメーカー等と組んでWebを中心としたサービスの企画・開発が将来の仕事につながると思うから。画面の外に出るべき。

80. HTMLやJavaScriptがWeb屋の本質ではありません。日常的にWebに携わっている中での経験や知見、そこから独自の発想ができることがWeb屋の強み。

81. これからは、Web屋の強みを他の業界で発揮することが新しいビジネスチャンス、スキルアップにつながると思います。マジで新しくて面白いことやりましょう！

82. Thanks !

Web屋という仕事のこれから

Masakazu Muraoka

Transcript