福野泰介の一日一創 - create every day

鯖江市の実用IoT、LoRaで格安水位計測IoT&リアルタイムオープンデータ、公開スタート

2018/07/05
#js #opendata #sabae #IoT 

大雨、川の様子は気になっても決して見に行ってはいけません。
それでも気になる、河川の水位。鯖江市では、さくらインターネット協力により、省電力広域無線(LPWA)の一種、"LoRa"を使った水位計測IoTのリアルタイムオープンデータをアプリと共に公開。
LoRaを使った河川水位システムの実証実験 | データシティ鯖江ポータルサイト

7/5、計測できている5箇所とも、水位のピークは21時ごろ。


鯖江市水位メーター
計測箇所の水位と、計測器の温度の推移を誰でもチェック、活用できます。

距離センサーから水位を表示するためには、センサーから川底距離を測る必要があります。計測時の様子。

福井県情報システム工業会にて、スパコン京を手がける富士通さんによる次の一手「デジタルアニーラ」の講演。講演者は、デジタルアニーラプロジェクト 工学博士の中村誠さん。 特殊な電子回路を用いて、ノイマンアーキテクチャでは時間がかかる問題を瞬時に解く特殊チップ。実験に使える小規模版を無料提供してもらえるといろいろ試せておもしろそう!

CISCO推定によると、IoTによってインターネット接続デバイスは2020年には500億台。2018年現在は300億台!? 感覚的にはまだ届いていないような気がしますが、今後、増加ペースが加速するのは確実です。

links
- LoRaを使った河川水位システムの実証実験 | データシティ鯖江ポータルサイト
- 北海道石狩市とさくらインターネット、IoTなどの情報技術を活用した地域活性化に関する包括連携協定を締結~4月よりLoRaを利用した河川水位計測システムの試行運用開始~
- B Inc.とさくらインターネット、IoTやAI、ビッグデータを活用したデータ事業で業務提携~オープンデータによる社会変革を目指して~
- Googleマップハンズオンの続き、地図内に鯖江市水位メーターの位置アイコンを全部置く方法
- IoTで防災力アップ! 河川水位IoTセンサー鯖江市内6箇所、試験稼働中
- 距離計測IoTと水位センサー、現実社会へのデプロイのおもしろさ

ZOZOSUITが来たので、体格オープンデータと3D物理シミュレーションで歩くモデルづくり

2018/07/04
#js #3d #opendata #profile 

ZOZOSUITで計測完了!自分の体型を3Dモデルにして動かせると楽しいかもと、Oimo.jsのデモいじり。
JSで作られた、three.jsと組み合わせて使う、3次元物理シミュレーションエンジンの名前がなぜかオイモ(Oimo)、かわいくて、軽くていい感じ!

歩く人、走る人デモ」Oimo.jsのサンプルを少し改造

ZOZOSUIT到着!

着た!

測った!

計測前にZOZOアプリをアップデート推奨。2回計測した最大差5.4cm。小数第一位が0の時も".0cm"と表記してほしい。

こちら、福野泰介 体格オープンデータ CSV (CC BY)


スタッフTシャツとかの注文に便利かも?RDF化して、5つ星オープンデータにもしてみたい。
計測するごとに変わるので、どこまで正確かの検証は必要そうですが、最新の計測結果をひとまず信用して、Tシャツ、ドレスシャツ、デニムを注文!到着14-28日後とのこと。

体格データに合わせて3Dモデルを変更したり、WebMeganeで実寸大で見て、着た姿を確認するなどできるとおもしろそう。 ZOZOSUIT x Oimo.js 楽しいですよ!

胴長な人デモ」「手足が長い人デモ」色や形をいろいろ変更するところからどうぞ!

IchigoJam web / IchigoJam VR ゲームパッド対応! Web Gamepad APIでiCade互換

2018/06/20
#IchigoJam #js 

単純に2画面分割表示するVRモードに対応した、IchigoJam web
Bluetoothキーボードを接続することで、目の前に広がる大画面でプログラミングに没頭することができます。

iOSには、iCadeというキーボードの仕様を使った手頃なゲームパッド仕様があったので、対応してみました。

かわくだりゲーム for iCade (RUN on IchigoJam web)

10 CLS:X=15 20 LC X,5:?"C" 30 LC RND(32),23:?"*" 35 WAIT3 36 K=INKEY() 37 X=X-(K=65)+(K=68) 39 IF SCR(X,5) WAIT 60:RUN 40 GOTO20

iCadeでは、押したときと離したときにキーダウンイベントが届きます。(オリジナルドキュメント
コントローラー「8BITDO SFC30 GamePad」での動作は下記の通り。
(SFC30は販売終了ですが、Somnus258 1,969円でも同等と思われます)

SFC30は、MacにつなぐとGamePadとして認識するので、PCで動かしたときにもiCade互換になるように、W3C web標準のGamepad APIを使って、エミュレートしています。

IchigoJamでも、iCade互換な物理コントローラーづくりもありですね!

links
- iCade - Arcade Cabinet for iPad - ION Audio - Dedicated to Delivering Sound Experiences
- IchigoJam VR!? meet up with Japanese Raspberry Pi Users Group!

都道府県別 子供減少率マップと青森マップアプリハンズオン、青森オープンデータ利活用セミナー

2018/06/11
#opendata #aomori #js 

青森にて、オープンデータ伝道師活動「青森オープンデータ利活用セミナー」
スマホからメガネ、HTMLからオープンデータ、計測装置からIoT、カンと経験からEBPM(AI)へ。

県別の年齢別人口グラフ、青森は福井より子供減少数がヤバイ。
聞くと、青森県は日本の少子高齢化でも最先端だという。アプリを少し改造して、都道府県別に子供減少率を算出し、色を塗ってみると、見事に東京とそれ以外に色分けされる。

県別 子供減少率
確かに、青森県の子供減少率はトップクラス(2010年データ)。
お隣、秋田より若干減少率が低いという計算結果。
子供減少率は、0-15才の子供人口の差分の平均をとり、15才人口で割って計算。


官民データ活用推進計画に関する、日本の地方公共団体へのアンケート、有効回答数1590。
アンケートの回答、共通語彙基盤を使った5つ星オープンデータにしましょう!


デジタルメガネことスマホMRをかけての登壇スタート。
掛けなければつたわらないメガネスタイル、講演後いろいろと体験いただきました。


SPARQLでマップ!青森編
5つ星オープンデータにも対応している青森県のオープンデータを使った、プログラミング未経験者の方でも使える、マップアプリハンズオン。ぜひダウンロードしてお試しください。
マップアプリハンズオン(青森編)


地元、青森での事例紹介する、岡本さん。はじまりは、MSXturboR!


データで案内する駐車場の事例。イベントには便利ですね!IoT化していかに安く実現するかと周知が鍵!

本日の講演資料。
--> 日本危機を乗り切るには、IT活用は不可欠。オープンデータというインフラ整備。いち早く5つ星オープンデータを普及すべし! インフラなきところに産業なし。

誰かがやってくれる感覚は捨て、いろんな壁を取っ払い、みんなでいち早く取り組むために、何ができるか!?

できることから、はじめましょう。

WebVRで取得可能、シンプル快適 Oculus Go controller

2018/06/10
#megane #vr #js 

2次元のテレビやスマホでは伝わらない、VR/AR/MRのスゴさ。実際体験するしかないですねっ。

アメコミ化しためがね大使まゆちゃん。視界がリアルタイムに変換されて、アメコミの世界にいった感覚になれます。・・・と、いくら書いても伝わらないのがもどかしいところ。


めがねフェスでも人気だった、Oculus Go。 自分で創りたくなるのがものづくり好きの性。シンプルながら操作性抜群の Oculus Go controller をwebアプリで取得する方法を調査。 無事、ボタンと加速度の値が取れました!

const gp = navigator.getGamepads()[0]; const corient = gp.pose.orientation; const pad = gp.buttons[0].pressed; const trigger = gp..buttons[1].pressed;

方向とトリガー、パッド部分が押されたかどうかが取得できます。(戻るキーはVRモードが終了してしまう)
* VRDisplay requestPresent した後のみ有効です


視点移動と合わせたシンプルなサンプルとしてまとめて公開したいと思います。


MRの不思議な世界、お子様たちも興味津々。ようこそプログラマブルワールドへ。


まゆちゃんも体験!


NUAGEのメガネアイス!


NUAGEは、めがねグルメグランプリ、二冠!


次回のめがねフェスではどこまで進化しているか!?


めがね大使まゆちゃんとめがね会館 in アメコミ世界

links
- Oculus Go | Oculus (スマホVRの一段上質のVR体験が23,800円!)

共通語彙基盤対応の拉麺型!? IMIで遊ぼう、開いてるところを探すアプリ on opendata.cc

2018/06/01
#opendata #js 

imi.go.jp という、日本の本気が見えるドメイン、共通語彙基盤。
IPAによる初開催となる招待制イベント「IMI意見交換会」


京都市、5つ星オープンデータの事例で、一日一創アプリ、紹介していただきました!


自治体職員には共通語彙基盤は手強すぎ!とおっしゃる京都市役所の林さん


なんと自分で独自語彙も作成した、拉麺語彙と独自調査のラーメンオープンデータを公開してます!
共通語彙基盤ラーメンデータ in Kyoto
共通語彙基盤ラーメンデータセット 独自定義語彙

すごい!

共通語彙作成までの思考を綴った「ラーメンデータをめぐるオントロ思考の大冒険」ステキです!

開店時間、閉店時間もしっかり共通語彙基盤準拠で入っているので、今開いてるラーメン屋さん検索アプリを作るためのSPARQLクエリーづくり。(12時に開いているところクエリーの例)

prefix xsd: <http://www.w3.org/2001/XMLSchema#> prefix ic: <http://imi.go.jp/ns/core/rdf#> select * { ?s ic:名称 [ ic:表記 ?name ]. ?s ic:利用可能時間 ?t. ?t ic:開始時間 ?startt. filter(?startt <= "12:00:00"^^xsd:time) ?t ic:終了時間 ?endt. filter(?endt >= "12:00:00"^^xsd:time) optional { ?t ic:説明 ?dest. } }

ひとまず、5つ星オープンデータポータル、opendata.cc を使って「開いているところを探す」アプリとして実装。
ラーメンデータを登録すれば、近くの開いているラーメン屋として表示されることになります!(誰でも登録可能!)

開いているところを探すsrc on GitHub CC BY taisukef


経産省、平本さん、オープンデータや共通語彙基盤が日本国家戦略の中枢にどんどん組み込まれて大忙し。


日本国家蔵出しの楽しいオープンデータを使って、一緒につくる仲間、大募集!
ソーシャルハックデー Tokyo vol.2」 2018.6.30 @ SENQ霞が関

どんどん使おう、共通語彙基盤!
コア語彙2.4.1に、sameAsで、英語版を関連付ける手でグローバル化も図れそう!
足りない語彙は、拉麺語彙の如く、勝手に作って、広めたもの勝ちです。
自然にいい語彙に集約されるので心配無用。

多様性と信頼が共存する新しいwebの世界、分かりやすくインパクトある入り口が肝!

今までの延長線上に未来なし、攻める鯖江商工会議所と常識反転メガネ

2018/05/25
#sabae #megane #js 

鯖江市内を中心に1846の会員を持つ、鯖江商工会議所の記念すべき第60回通常議員総会。

WebMegane」 JSで作ったブラウザで動くWebMeganeに、反転モードを追加
左右反転させるレンズもプログラム1行で実現できてしまう、デジタル化したメガネ。

強烈に気持ち悪い左右反転視界も、しばらく歩き回っているとなんとかなってしまう不思議。
電話も、ネットも、スマホ、「今までの常識と違う」気持ち悪さも「利便性」には叶わない。

一眼レフがデジタル化し、光学ファインダーから液晶モニター化によるミラーレスが実現したように。 メガネの世界でもレンズレス時代が訪れる。


今までの延長線上じゃだめだと開会宣言する、鯖江商工会議所、黒田会頭。


新任で阪大から来られた福井工業大学、学長で、理学博士の掛下知行さんと鯖江市長!
商工会議所、鯖江市、福井工大による産官学連携も丸10年。


鯖江商工会議所副会頭「」代表の加藤さんによる〆。


サイトリニューアルしていた「日本酒「梵」の酒蔵 | 加藤吉平商店 |


SDGsバッジとメガネバッジを付けた鯖江市長、いよいよ国連本部、ニューヨークへ!
鯖江の市長さん、ニューヨークへ行く!こどもプログラミングで地方が変わる、EDIX&自治体総合フェア!
鯖江の新しい一歩のきっかけに!

WebMeganeでMR、JSで手軽に実現、外カメラ映像とCGをミックス!

2018/05/23
#megane #js 

MR = Mixed Reallity。CGと現実を混ぜること。

スマホとVRゴーグルで手軽なデジタルメガネを実現、WebMegane
three.jsと組み合わせて、MR化!

ひとまずシンプルな赤い画面を半透明にして合成。
現実とCGが混ざる世界ができあがった。


カメラ入力とThree.jsのCGをミックス!「redsnow - WebMeganesrc on GitHub
ただ失敗は背景のカメラは立体視非対応で、CGは立体視なので違和感あり・・・。
CGの左右視差はなしにする必要がありそう。外カメラ2つが使えれば、立体視可能にできるかも。


こちらオタマートで販売しているVRゴーグルの一番安いもの。
高いものにはついているボタンがないので、何かインタラクションを付ける場合は、視点の移動を基本にする必要がありですが、デジタルメガネ実現だけなら問題なし!

格安VRゴーグルとJSで、Let's begin to make your WebMegane!

links
- 任天堂伝説のゲーム機、バーチャルボーイ風をスマホVRとWebVRで手軽に創る
- WebMegane - your new digital sight / デジタルな視界 on iPhone Safari x VR goggles

PCN i18n MTG at Roppongi with Creative Pasta!

2018/05/16
#IchigoJam #js #china #africa #opendata 

i18n means internationalization (i + 18 charaters + n).
Our PCN mission is programming for all kids all over the world.
English meeting with PCN member of Beijing, Ivory Coast, المملكة المغربية‎, Dziko la Malaŵi and 福井県.

We got translation apps (UDTalk etc).
So there are no borders about i18n communications!


PCN Beijin, République de Côte d'Ivoire, Katsuyama & Sabae.
Let's create kids creators!

At Gaston & Gaspar, you can create your pasta!

English menu is available also!


Created pasta 1.


Created pasta 2.


"Pasta Creation Order Sheet - unoffcial web app version"
Foods makes you. You can choose your future.
This is the first step. I want to to add links to detail data of each foods by opendata.


Let's begin programming with fun without borders!

links
- PCN Programming club network
- Gaston & Gaspar
- Beiging China will join to the PCN! We started next contest for the World, Please support us! / ついにPCN北京も加わり、いよいよ世界に広がる こどもプログラミング!コンテスト協賛にぜひご協力ください! – about yrm
- みんなもやってみよう「PCN〇〇」!新たに加わるコートジボワール、モロッコ、マラウイ、旭川。EDIX 学びNEXTにぜひどうぞ! – about yrm

How to make the Inclusive City - Learn Braille (点字を学ぼう) on IchigoJam / Alphabet(+和文)

2018/05/15
#IchigoJam #IoT #js #africa #codefor #nerima 

インクルーシブシティとは、いろんな壁を越えて誰もが豊かに暮らせる都市。
The Inclusive City makes everyone happy.

「はじめのいっぽ」は関心。
The first step is the interest.

見えなくても聞こえなくても伝わる、点字を学習するプログラムを作りました。
I made a program to learn braille, characters for everyone.


キーボードで打つと、対応する点字が表示されます。(A-Z版とひらがな版、プログラムは後半に)
You can check the braille with typing A-Z or Kana of Japanese.
(RUN on Ichigojam web)


アフリカ各国からのインターン生と、お互いの紹介とIT使った社会発展に向けたディスカッション。
Mutual introduction and discussion to improve this society with IT with interns from Africa.


アフリカと日本、つなぎましょう!
Let's connect Africa to Japan.


Code for Nerima では、体表点字の開発者、長谷川さんに見てもらえました。
I met Mr. Hasegawa, an inventer of braille with motors at Code for Nerima.


コードでつながる練馬と鯖江。
Sabae(Fukui) connected Nerima(Tokyo) with the code.


Code for Nerima 青木さん作のデジタルメガネ体験。メガネ新ジャンル、熱い!
I enjoyed the digital eye-glasses by Mr. Aoki. It's hot to create new glasses!


インクルーシブシティづくり、ぜひご一緒に!
Let's create the inclusive city!

点字学習プログラムのつくりかた on IchigoJam
How to make to learn braille on IchigoJam

点字をデータ化する(点字 - Wikipedia
Make the code(number) from the braille (braille - Wikipedia)

?`100000 32

10 00 00 - braille in binary (2進数化した点字) → 32

10 LET[0],32,40,48,52,36,56,60,44,24,28,34,42,50,54,38,58,62,46,26,30,35,43,29,51,55,39 100 K=INKEY():IF K=0 CONT 105 ?CHR$(K) 110 IF K<65 OR K>90 GOTO100 120 B=[K-65] 300 ?BIN$(B,6) 390 GOTO 100

タイプすると対応する点字コードを表示
Show the code by typed character.

300 FORI=0TO5 310 LC 5+I%2*4,2+I/2*4 320 ?CHR$(232+B>>(5-I)&1) 330 NEXT 60 CLS 70 VIDEO3 105 LC5,0:?CHR$(24,K);

点字っぽく表示を工夫してできあがり!(24=特殊キーコード、行削除)
Make up the display to finishi!(24=special key code, delete line)

ひらがなバージョン。
Japanese Kana version.
(RUN on IchigoJam web)

10 LET[0],`100,`101,`110,`111,`011:'AIUEO 20 LET[5],`001,`101,`110,`010,`011,`111,`100:'KSTNHMR 30 LET[12],`010010,`010011,`010110:'YYY 40 LET[15],`0010,`0110,`0111:'W 50 S="AIUEOKSTNHMRYYYW" 100 K=INKEY():IF K=0 CONT 105 ?CHR$(K); 110 N=-1:FORI=0TOLEN(S)-1:IF ASC(S+I)=K N=I:NEXT:ELSE NEXT 120 IF N<0 GOTO100 130 IF N<5 B=[N]<<3:GOTO300 140 K=INKEY():IF K=0 CONT 145 ?CHR$(K) 150 IF N=8 AND K=ASC("N") B=[17]:GOTO300 160 M=-1:FORI=0TO4:IF ASC(S+I)=K M=I:NEXT:ELSE NEXT 170 IF M<0 GOTO100 180 IF N<12 B=[M]<<3+[N] 190 IF N=14 B=[12+M/2] 200 IF N=15 B=[15+M/4] 300 ?BIN$(B,6) 390 GOTO100 60 CLS 70 VIDEO3 105 LC5,0:?CHR$(24,K); 300 FORI=0TO5 310 LC 5+I%2*4,2+I/2*4 320 ?CHR$(232+B>>(5-I)&1) 330 NEXT

ローマ字で打つと対応する点字が出ます。
This program shows in braille by your type in Roman letters.

濁点半濁点などへ拡張してみましょう。容量不足対策はこちら。
Let's make extension versions! If you want to more memory...

?FREE() 362 ?"10 LET[0]";:FORI=0TO17:?",";[I];:NEXT:? 10 LET[0],4,5,6,7,3,1,5,6,2,3,7,4,18,19,22,2,6,7 20 30 40 ?FREE() 480

118byte縮みます。
You can save 118byte.

links
- Programming for Rwandan kids! Open Teaching Materials
- デジタル指点字はじめのいっぽ「数字」の点字表現を体得する読み上げ学習マシーン

Tweet
クリエイティブ・コモンズ・ライセンス
この作品は「Creative Commons — CC BY 4.0」の下に提供されています。
CC BY 福野泰介 - Taisuke Fukuno / @taisukef / アイコン画像 / プロフィール画像