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

イベント設計に便利!タイムスケジュール計算機 timesum2

2017/11/16 23:55:00
#js 

イベント設計、何時に始まり、どのセッションに何分取って、何時に終えるか?
そんな時間の計算に便利な「タイムスケジュール計算機」を作りました。

タイムスケジュール計算機 - timesum2

使い方
1. 開始時刻をセット
2. 所要時間を分単位や、コロン付きの時分表記で時間で入力するとリアルタイム計算
3. 右側のコメント欄と共に、下のテキストエリアにコピペに便利な計算結果!

シンプルな、JavaScriptでつくったオープンソースなWebアプリ、好きなように改造、デザイン、命名し、コンピューターとプログラミングでできる便利を広めてください!

links
- timesum(元ネタ、一日一創をはじめた2012年の作品)
- 計算系アプリ in 一日一創2012
- 計算系アプリ(再まとめ中)

プログラミングはプログラミングで楽をする、WebAssemblyマシン語入門その2

2017/11/09 23:55:00
#asm #wasm #js 

前回「ブラウザだけでOK! 1+1からはじめる、WebAssemblyマシン語入門その1」では、マシン語の命令表からひとつずつ選んで数を書いてみました。 プログラムをこのようにマシン語にする作業のことをアセンブル(英語で組み立てを意味する)と言います。

数が多くなってくると、こうして手で変換するのは大変なので、プログラムを作って自動化しましょう。 今使っている環境の範囲だけで動く簡易的なアセンブラ「WebAssembly poor assembler」をJavaScriptで作りました。


WebAssembly poor assembler

こちら、前回はマシン語だった param+1 を計算するプログラムのアセンブリ言語プログラムです。

get_local $0 i32.const 1 i32.add end

「ASSEMBLE」ボタンを押すと、下に数字の並びに変換され、RUNで動かせます。

20 0 41 1 6a b

試しに、i32.add を i32.mul に書き換えて、ASSEMBLE、RUNしてみましょう。
i32.const 1 を i32.const 5 に書き換えて、ASSEMBLE、RUNしてみましょう。
param に、10と入力しなおして、RUNしてみましょう。

ちょっとだけ複雑な計算をさせてみます。

get_local $0 i32.const 5 i32.mul i32.const 1 i32.add end

i32.const 1 と i32.add を書き加えて、n*5+1 を計算するプログラムにしました。
ASSEMBLE、RUNしたり、paramを書き換えてみましょう。

このようにアセンブルを自動化するプログラムのことを、アセンブラといいます。
(手でアセンブルすることをハンドアセンブルといい、アセンブラがない時代の必須テクニックでした)

次はコンパイラを作ってみます。お楽しみに!

WebAssemblyマシン語入門
- ブラウザだけでOK! 1+1からはじめる、WebAssemblyマシン語入門その1
- プログラミングはプログラミングで楽をする、WebAssemblyマシン語入門その2

IchigoJam web 拡大表示に対応!未就学児からシニアまでIchigoJamプログラミング体験!

2017/10/30 23:55:00
#IchigoJam #KidsIT #senior #js 

車載用の小さい画面で手軽にはじめられるIchigoJam。
ただ、小さいお子様や、シニアな方にはちょっと文字が小さいかも?
そんなとき便利なコマンド

VIDEO 3

文字が倍角表示されます!

VIDEO 5

これで4倍表示!

パソコンやスマホ、タブレットでも体験できる、IchigoJam web も、VIDEOコマンドに対応しました!


IchigoJam web

大きな画面対応の未就学児、小学生低学年用のサンプルプログラムもいろいろと用意したいと思います!

高校生インターンでバス到着予測アプリ、iPhone風スクリーンショット用フリー素材

2017/10/27 23:55:00
#js #intern #jig #opendata 

今年初開催となる高校生対象の3日間のインターン。
テーマはオープンデータを使った美しいWebアプリ開発。
初日の午前中、軽いガイダンス、自己紹介の後、早速企画会議。
オープンデータを眺めつつ、日常の不満を元にアイデアを出して、吟味。

決定したのは、バス到着時刻予測アプリ!
鯖江市自慢のオープンデータ、リアルタイムに位置と乗客数が分かるつつじバスオープンデータを使用!


バスの到着時間がわかるWebアプリ
1. バス路線を選択(鯖江市営つつじバス)
2. 現在位置最寄りのバス停2つから選択
3. 次来るバスまでの到着予測時間までの残時間が表示される
・・・という、シンプルなWebアプリ!

現在は2つ前のバス停通過時間を見てその差分を最寄りに足しているだけということで、今後ゲーム化したり、曜日やイベントのデータも含め、機械学習で予測精度を高めたりといろいろ展望は膨らみ、楽しみです!


【画像】バスの悪いところランキング 1位は「時間通りにこない」で55%|ニフティニュース」発表中
早発が問題となる路線定期運行バスなので、遅れ気味に運行されるのはしょうがないとして、どのくらい送れるのかは見える化したいですよね!

最終日の夕方、発表とコードレビューを行って、3日間のショートインターンは修了。


みんなでお昼食べたり、おしゃべりしたり、ボードゲーム会に合流したり、楽しんでもらえてたら何よりです!

発表資料作成の援護射撃として作ったスマホ画面っぽく見せるための透過画像がこちら!
- sphone-base.png (透過PNG画像、オススメ!)
- sphone-base.key (Keynote版)
- sphone-base.pptx (PowerPoint版)
CC0のライセンスフリーなオープンデータとします。どうぞ活用ください。

親しみやすく表示する鯖江市論手川水位メーターアプリ with D3.js

2017/10/26 23:55:00
#js #d3 #opendata 

河川の状況、D3.jsを使って親しみやすく、かわいいゲージを見つけたので、改良してみました。

鯖江市 論手川 水位メーター D3.js version

台風時には気になる河川の水位、鯖江市の川、論手川に設置されたリアルタイム5つ星オープンデータ化された水位計でも大幅な上昇が記録されています。

(鯖江市論手川の水位の推移 2017.10.22 / 2017.10.23

sakura.ioなどIoTを使った身近な安心につながるオープンデータ、どんどん増やしていけるといいですね!

links
- 5つ星リアルタイムオープンデータ SPARQLを使った鯖江市論手川排水機場の水位表示アプリ
- 5分でできるオリジナル鯖江論手川排水機場水位表示iPhoneアプリ / Swift2入門

越前がにロボコン会場リハーサル&得点記録システム

2017/10/25 23:55:00
#js #KidsIT 

福井県システム工業会の30周年イベント「越前がにロボコン」の開催が来月へと迫る中、会場ハピリンにて導線確認を兼ねた打ち合わせ。

こちらが福井駅前、ハピリン2Fの会場となる場所です。


越前がにロボコン 得点記録システム
カニロボの試走と合わせて使える記録システムの第一弾できました!(越前がにロボコンのルール


海のない鯖江市ですが、Hana道場から「さばえカニロボット」として登場!(開発背景


勝山の子供たちの着々と開発すすむカニロボ達(写真)


小学生向け越前がにロボコン、開催は11/26(日)!
電動バイク「zeCOO」などを手がける、ツナグデザイン・根津孝太さんも特別審査員として来福!

福井の冬の味覚と言えば、越前がに

links
- 越前がにロボコン
- ハピリン
- 福井県システム工業会

D3.js で作った「やらわか時計」D3再入門

2017/10/24 23:55:00
#js #d3 

SVGを使った美しい描画を簡単につくれる D3.js
再入門しようと、2012年作品「やわらか時計」から復習開始!


softtime / やわらか時計」 フルスクリーン対応


Macでフルスクリーン表示した図
プロジェクターで映したり、iPadで表示して飾っておくなどもいいかもしれません

D3.jsを使ったオープンデータビジュアライズをいろいろ試していきます!

links
- Gallery · d3/d3 Wiki
- D3 入門 | スコット・マレイ | alignedleft

ルワンダ記、英語とプログラミングがつなぐ世界 / English and Programing will become the tool to connect kids all over the world!

2017/10/20 23:55:00
#IchigoJam #js #africa #doc 

Thank you Rwanda! It was great jorney. ルワンダに感謝!スゴい旅でした。
I saw how to develop the country and the future. ルワンダに国と未来の作り方を見ました。
I decided to share this experiance to Japanese kids! この経験を日本の子達に伝えます!


Japan embassy in Rwanda. It was my first experience to enter to the Japan embassy.
Thank you Miyashita-san! We've got 15th!
"Japanese IT Entrepreneurs visit Rwanda (October 16, 2017) : Embassy of Japan in the Republic of Rwanda"
在ルワンダ日本大使館と大使公邸にお邪魔しました。在ルワンダ日本大使、宮下さん、ありがとうございます!
"日本のIT企業家等のルワンダ訪問(2017年10月16日,18日) : 在ルワンダ日本国大使館"


KidsVenture workshop for adults at FABLAB and kLAB Rwanda!
"Programming for Rwandan kids! Open Teaching Materials"
たくさんのルワンダの若者との出会いに感謝!


A student of Tumba Collage of Technology, paticipated our IchigoJam workshop!
"IchigoJam workshop at Tumba Collage of Technology (トゥンバ高専)"
国境を超えた高専つながり、トゥンバ高専生!


We went to exciting electric parts shop in Kigali!
ワクワクする電子パーツ屋さん、キガリにあります!


Like a Akihabara shop!
まるでアキバ!


Many tempareture sensors and relays figured Rwandan interest to agricultures.
たくさんの温度計やリレーが農業国ルワンダっぽい!


Thank you great heartful and young staffs!
丁寧でステキな若きショップスタッフさん、ありがとう!

Everyone we met in Rwanda interested in computer and programming.
We decided to make materials to teach both English and Programming!
ルワンダで、会う人すべてがコンピューター、プログラミングに興味持ってくれました。
英語とプログラミングをまとめて学習できるコンテンツ、作りましょう!


At the first, I translated IchigoJam print "LED" into English. (PDF)
まず手始めに、IchigoJamプリント「LED」を英語化!質のアップ、手法改善を始めます。


This Rwanda last meal was at Japanda! (Japan + Rwanda !?)
It was a nice Donburi!
ルワンダ最後のご飯は、ルワンダJICA事務所近くの日本料理屋さん「JAPANDA」
ナイス、丼!


Thank you Kasai-san, great organizer of this jorney!
最高の旅をオーガナイズしてくれた、笠井さん!ありがとうございました!
"嫁に人生を狂わされた会計士のアフリカ見聞録" (ルワンダお寿司の記事、必見w)

Programming for Rwandan kids! Open Teaching Materials

2017/10/18 23:55:00
#IchigoJam #js #africa #opendata 

IchigoJam workshop in FABLAB Rwanda at Kigari!

Thank you kids! It was very excited! You're IchigoJam evangelist.

This slide is Open Programming Learning (Teaching) Materials with IchigoJam.

Check the IchigoJam prints(日本語版) also!
We support on the Facebook group IchigoJam-FAN@en (日本語版).


Same on the earth!


We presented IchigoJam 4 sets to FABLAB Rwanda!


Thank you FABLAB and kLAB!

links
- Kids are same anywhere! PCN’s first IchigoJam Africa classroom held in Kigali Rwanda! – about yrm

Improve innovations with kids programming at Rwanda!

2017/10/17 23:55:00
#IchigoJam #js #africa 

Africa IT Tour, Rwanda Day 3!

Kigali Convention Centre with colorful illuminations


babyl improving helthcares in Rwanda from UK.
SMS is still important because smart phone users in Rwanda are under 10%.
He can read my T-shirt BASIC program!


Rwandan mobile phone infrastructure company TRES is focusing softwares and youth!


Not sweet Banana, like a potato!


With Chief Strategist ICT Sector Development at RDB (Rwanda Development Board!
He said "world-class professional talent for innovation" in Rwanda!
Let's expand a range and connect Rwandan and Japanese kids!


With Rwanda Speciality Coffee producer BUFCOFFEE
Solve the problems about agriculture with IoT and kids!


In front of WiredIn, software development service company related Japan!
WiredIn's co-founder Mr. Tanaka is born at Sabae-city, my home town!


Rwanda-Japan Night!


with Good Curry!


BananaCrepe with colored LEDs!


I showed up my room at hotel with colored LEDs!

How to show up with colored LED.
1. get the WS2812B LED tape.

2. solder just 3wires to colored LED.
3. program it on IchigoJam!

1 'WS2812B looping driver 10 POKE#700,66,70,75,70,252,180,64,24,80,33,9,2,1,49,9,4,4,120,160,70,69,120,172,70,1,48,129,70,114,182,128,37,1,48,3,120,255,34,74,96 20 POKE#728,3,39,10,38,43,66,1,208,10,39,3,38,1,63,253,209,0,34,74,96,1,62,253,209,109,8,239,209,1,60,234,209,68,70,72,70,98,70,1,58 30 POKE#750,148,70,228,209,98,182,252,188,144,70,153,70,112,71 100 L=48:POKE#800,L*3,300/L:I=0:V=7:S=60 120 FORJ=0TOL 130 H=I+J*360/L:GSB@HSV2RGB:POKE#802+J*3,G,R,B 140 NEXT 150 U=USR(#700,#800) 160 COPY#802+L*3-3,#802,3:COPY#802,#805,L*3-3 165 WAIT3 170 GOTO 150 500 @HSV2RGB 'use CDEF 505 R=V:G=V:B=V:IF S=0 RTN 510 D=H/60%6:C=V-(59-H%60)*V/60*S/100:E=V-H%60*V/60*S/100:F=V*(100-S)/100 520 IF D=0 G=C:B=F 530 IF D=1 R=E:B=F 540 IF D=2 R=F:B=C 550 IF D=3 R=F:G=E 560 IF D=4 R=C:G=F 570 IF D=5 G=F:B=E 580 RTN

source code of WS2812B looping driver in ARM Cortex-M0 Assembly language.

'POKE[ad],[data len],[loop count],[GRB data ...] @WS2812BLOOP R2=R8 R3=R9 PUSH {R2,R3,R4,R5,R6,R7} R0=R0+R1 R1=#50 'R1=#50010000 GPIO1 R1=R1<<8 R1+=1 R1=R1<<16 R4=[R0] R8=R4 R5=[R0+1] R12=R5 R0+=1 R9=R0 CPSID @LOOP_DATA R5=#80 R0+=1 R3=[R0] @LOOP_BIT R2=#FF [R1+`0001]L=R2 R7=3 R6=10 R3&R5 IF 0 GOTO @SKIP R7=10 R6=3 @SKIP R7-=1 IF !0 GOTO -1 R2=0 [R1+`0001]L=R2 R6-=1 IF !0 GOTO -1 R5=R5>>1 IF !0 GOTO @LOOP_BIT R4-=1 IF !0 GOTO @LOOP_DATA R4=R8 R0=R9 R2=R12 R2-=1 R12=R2 IF !0 GOTO @LOOP_DATA CPSIE POP {R2,R3,R4,R5,R6,R7} R8=R2 R9=R3 RET

Have a fun with the computer and programming!

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