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

オープンデータアプリコンテストで盛り上げる私達のまち - 徳島 Our Open Data 阿波食マップアプリ

2018/10/14
#js #tokushima #kosen #OurOpenData 

オープンデータにいち早く取り組んだ、徳島県。
賞金総額125万円、地元密着テック情報の50周年記念事業「学生限定オープンデータアプリコンテスト」の審査員としてお招きいただき、3度目の徳島。 徳島大好きでアプリづくに取り組むステキな学生たちに会えました!


うれしい参加学生同士のつながり、いい仲間ができたかも!?


早速つくってみたよ!「阿波食ナビ
Our Open Data で見つけた、共通語彙基盤対応の5つ星オープンデータRDFのオープンデータ「首都圏で食べられる徳島「阿波食」」!フィルター機能付きで結構使いやすい!?


しらすにも、すだち!


ちくわが竹輪である理由がわかった!温かくて美味しい!今まで食べた中で最高の竹輪。


四国、戻り鰹!こうしたステキな食に首都圏でもきっと会えるアプリです。


地産地消オープンデータを使ったアプリアイデアから、眠るデータを発見!「とくしま食巡りの店」のオープンデータ(できれば緯度経度付き、更に欲をいえば5つ星オープンデータ)があれば、阿波食ナビが徳島でも使えます! 欲しいデータはどんどんOurOpenDataに要望してほしいと、徳島県の中の人も言ってくれてましたね!


アワ・ストラグル、いきなり本格的なアイデアな予感!?


若者が遊ぶ場所がない課題に、自分たちで創るというステキな解決策。 アイデア部門ながら、なかなか作り込んできたスマホボードゲーム「アワ・ストラグル」画面。自分の考えたおもしろゲームを実際カタチにして、気軽に誰かに遊んでもらえるいい時代ですね! GitHubでみんなで創り始めて、キャラクターをどんどん追加できる環境も作っちゃうのもいいね。ドット絵ツールのベースアプリ「dote」もありますし、みんなでつくるいい環境もあれば、コラボもいいかも。


観光地などでゲットできるカード。


ロケーションベース型 観光アプリ、AwatabiGO!2016年のjigインターンのテーマはなんとかGoでした。「鯖江でGO! jigインターン2016成果報告会


好きな動物&食べ物が「うなぎ」なので、自作のうなぎパーカーで発表するうなぎくん!徳島県立徳島科学技術高校の2年生、プログラミング初めての勢いで作ったARゲーム!


ARモードで登場する「はてな」をタップすると、すだちでゆるキャラゲットモードに!質疑応答で飛び出した、すだちをしぼってゲットというアイデア! スマホの画面上でどう「絞る」という演出をするか、あれこれ試すのも楽しそう。


アプリ部門、最優秀賞受賞、喜びの声を動画で!賞金50万円(相当!?)


阿南高専4年生、地方からの若者消滅問題に、まずはしっかりデータで向き合おうというアイデア。 地域経済分析システムRESASをより具体的に、小さい単位で追いかけ、論理的に時には思い切った策を取る必要があります。 鯖江市での人口対策会議では、町単位での転入転出のデータありました。市町単位でのオープンデータの新しい形、創りましょう!(アイデア部門、最優秀賞)


思わぬ受賞で戸惑う高専生。プレゼンターはテック情報の代表取締役社長、濱尾さん。


阿南高専生!


観光地をスタンプラリーで回るアプリ。自分で創る位置ゲーで遊ぶ楽しさはまた格別ですよ!チート対策を含む、遊ぶ人を飽きさせない運用体制が鍵かも? だけどやってみないとわからないから、まずははじめるべし。


ご当地アプリ、徳島弁がかわいい!みんなが使っている環境を使う、大事ですね。LINE BOTでシンプルに避難所を提供。


食材オープンデータ、アレルギー対策や、新たな切り口でのグルメ観光に良さそう!文部科学省「食品成分データベース」を使いやすい5つ星オープンデータとして、ご当地食材を産地でオープンデータ化してマッシュアップが良さそうです。 「すだち」の栄養素はデータありました!


人口あたりのお医者さんの数、トップクラスの徳島県は、危険な面もはらんでいます。特別料金がかかる総合病院にどうしても集中してしまう現状を、オープンデータとアプリによる誘導で最適化しましょう。


不名誉なナンバーワン、糖尿病が多い徳島県。原因は運動不足と濃い味付けにある? 「国民栄養調査データを活用した都道府県別栄養関連指標の検討」 こちらのデータに拠ると、歩かない県のようですが、炭水化物(糖質)摂取量は沖縄が低い以外は全国あまり変わりない様子。塩分は関東と比べて低いので違うのかも・・・。 データを使った犯人探しゲーム、楽しいですね。PDFから、5つ星オープンデータ化して、いろんな相関をまとめてとってみるときっとおもしろい。


おやつのお菓子、なんと3つ!やっぱり、徳島県、糖質好き!?


糖尿病対策には、楽しく歩くこと、とくしまっぷ!


ステキ高校生!徳島県立城ノ内高校の学生たち、アプリづくりはやってないとのことですが、簡単なところから始めたり、作れる学生とのコラボ、やりましょう!


散歩コースオープンデータを、ところどころにある過去の写真スポットをARで見ながら歩こうというアプリ。 「鎌倉今昔写真」や「鯖江今昔写真」の徳島版もぜひ!


住む場所を決めるアプリ。なんと、コンビニ、ドライブスルーオープンデータも!?「徳島県ドライブスルー一覧 - Our Open Data」には、なんと徳島県の独自調べ! ここはぜひ大手飲食店チェーンによるオープンデータを要望したい!


匿名投稿で投稿の敷居を下げる不審者情報共有サービス。 いいことも不具合もいろいろレポートする鯖江で運用中の「さばれぽ」に不審者情報投稿を追加するのもありかも?


再開のキーワードは、ハッシュタグ阿波オープンデータ「#OurOpenData」!

実は、徳島、今月はもう一度来ます!
半世紀に一度のチャンス「高専プロコン in 徳島」へもぜひ!
10/27-28@アスティとくしま

映画の10倍、普通の4倍、秒間240回描画! 革新的ディスプレイに備える軽量ゲームフレームワーク sq-game.js

2018/10/13
#js #game 

4Kや8K、映像の進化は画面解像度だけでなく、時間解像度も進化してました。
通常、秒間60回、60Hzで更新される画面、なんと4倍の240Hzにも達しています。(実験では480Hzも!)

レースゲームなど、動きが激しいアクションゲームでのフレームレートはとても大事。
処理が重たいゲームで30fps(frame per second、秒間更新回数)なものは、操作の遅れが最大33ミリ秒(1秒/30)発生し、見た目にもカクカクぎこちなく見えて幻滅です。

初代ファミコンも60fps(正確には59.97fps?)のなめらかなでクイックな反応が楽しい。ゲームによっては敵が多く出すぎて「処理落ち」と呼ばれるフレームレートの低下も当時でも、よく知られた現象でした。

そんな重要な要素、フレームレートが4倍にもなった世界、ゲームに限らず未来を感じます。ブラウザ上でも手軽に実験できそうなので、JS用かんたんゲームフレーム「sg-game.js」を作って、その実現の時を待つことにしました。

サンプルアプリ「FPSChecker」は、その環境でのリフレッシュレートを表示しながら、ぐるぐる色を自身の角度を色相としながら回る円、タップまたはクリックするほどに回転周波数が変わります。 10Hzにしたときに残像で見える円の数、通常の環境では6ですが、12コ、14コ、24コと増えるはず。(480Hz環境なら48コ!)


FPSChecker」(スクリーンショットは60fps環境を模したもの)

IO-DATA製24.5インチ240Hz対応モニター「KH2500V-ZX2」を買って試してみます!
(「EX-LDGC251UTB」と同じ仕様のパッケージ違い)

今回、新設した正方形ゲーム用シンプルフレームワーク「sg-game.js」、ゲームづくりに、JavaScript言語によるプログラミング学習に、活用ください。


こちら、最小サンプル「min.html」をコピペし、min.htmlとして保存、ブラウザで開けば動きます!
PC、iPhone、iPad、Android、いずれもOK!

<!DOCTYPE html><html><head><meta charset="utf-8"/> <title>min</title> <script src="http://taisukef.github.io/sq-game/sq-game-r1.js"></script> <script>"use strict"; var gamemain = function(game) { game.loop = function(g, ts, dt, vw) { g.setColor(255, 0, 0); g.fillCircle(500, 500, ts % 1000); }; }; </script> </head></html>

正方形ゲーム専用フレームワーク sq-game.js の使い方
- gamemain メソッドをつくる
- 受け取った、game オブジェクトに 描画用ループ loop メソッドを設定する
- g は canvas、ts は時間、dt は時間差分、vw はバーチャル幅と高さ1000
- 必要なら、タップされた時の操作用に tap メソッドを設定する

こちらが、sg-game.js を使った、上記、FPSCheckerのプログラム!

<!DOCTYPE html><html><head><meta charset='utf-8'/> <title>FPSChecker</title> <meta name="apple-mobile-web-app-capable" content="yes"/> <meta property="og:image" content="ss.png"/> <link rel="apple-touch-icon" href="icon.png"/> <script src="sq-game-r1.js"></script> <script>'use strict'; var gamemain = function(game) { game.tap = function() { if (hz == 10) hz = 0.1; else if (hz < 0.95) hz += 0.1; else hz++; }; var hz = 1; var th = 0; game.loop = function(g, ts, dt, vw) { g.setColor(0, 0, 0); var fh = 60; g.setFontSize(fh); var s = "" + fixfloat(hz + 0.05, 1) + "Hz"; g.fillText(s, 10, 10 + fh); var s = "FPS: " + Math.floor(1000 / dt) + " / " + fixfloat(dt, 2) + "ms"; g.fillText(s, vw - g.measureText(s).width - 20, 10 + fh); th += dt / 1000 * Math.PI * 2 * hz; var r = vw / 4; var x = vw / 2 + Math.cos(th) * r; var y = vw / 2 + Math.sin(th) * r; var cr = 90; var rgb = hsv2rgb(th / (Math.PI * 2) * 360 + 90, 0.8, 0.8); g.setColor(rgb[0], rgb[1], rgb[2]); g.fillCircle(x, y, cr); g.setColor(255, 255, 255); var fh = 80; g.setFontSize(fh); var s = "" + fixfloat(hz, 1); g.fillText(s, x - g.measureText(s).width / 2, y + fh / 4); }; }; </script> <style> a { color: gray !important; } </style> </head> <body> <div id="src"> FPSChecker<br> APP: CC BY <a href=http://fukuno.jig.jp/1686 target=_blank>fukuno.jig.jp</a><br> LIB: CC BY <a href=sq-game-r1.js target=_blank>sq-game.js</a><br> </div> </body> </html>

ちなみに、映画のフレームレートは秒間24コマ、CGはきれいになってもなかなか変わりませんね。
8Kで秒間240コマの映画とか、未知の体験も楽しみです。

Add a friend on Solid! Add a link to make friends on your new open SNS.

2018/10/04
#solid #js #web 

Web inventor, Sir Tim started new open social platform "Solid".
Web発明者、ティム卿が始めた新しいオープンなSNS「Solid」

It's a little hard to understand to add a friend, but we can make ourselves because it's open!
標準ではちょっと分かりづらい友達追加でしたが、オープンに作れちゃうのがいいところ!作ってみました。

"add friend" button. (友達追加ボタン)

add a friend 'taisukef'

Let's start to make and join "Solid", decentralized open SNS!
Solidでつくる、非中央集権型(デセントライズド)分散型オープンSNS。はじめのいっぽ、はじめましょ!


"Add a friend on Solid" (Solidで友だち追加) src on GitHub

On Chrome, why do I get the error after log in!?
Chrome、ログイン後、エラーメッセージがでる不思議

{"error":"invalid_request","error_description":"Mismatching redirect uri"}

links
- The first step of Solid / web発明者による新ソーシャルプラットフォーム「Solid」はじめのいっぽ with GitHub
- Ruben Verborgh's answer to In layman's terms, what is the essence of Sir Tim Berners-Lee's project Solid? - Quora
- How solid is Tim’s plan to redecentralize the web? – Irina Bolychevsky – Medium
- solid/chat - Gitter

web発明者による新ソーシャルプラットフォーム「Solid」はじめのいっぽ with GitHub

2018/10/01
#web #solid #js #opendata 

web発明者TimによるLinked Dataベースの新プラットフォーム「Solid」発表!
“Webの父”バーナーズ=リー氏、個人情報をGAFAからユーザーの手に戻すプロジェクト「Solid」立ち上げ - ITmedia NEWS
One Small Step for the Web... — Inrupt
Tim、MITを休職、W3C業務を減らし、Inruptを共同創業という本気っぷり!

こちらSolidアプリはじめのいっぽ、チュートリアルを日本語化して、1項目追加したもの

プロフィール ビューワー for Solidsrc on GitHub


「Log in with Solid Community」でログインすると、名前、ノート、友達が取得できます。

アカウント名は速いもの勝ち、とりあえず自分のWebID、ひとつ作ってみましょう。
Solid」→「Get a Solid POD


「Solid Community」で「GET A POD」


Registerで登録!
これで上記のアプリ「プロフィールビューワー」が動作します。(ログインは、Solid Communityを選ぶ)


ちょっとわかりづらい友達(知っている人 knows)追加の方法は、自分のカードをホームアイコンの左で編集画面にいき


下部にある同心円状の白黒の丸に誰かのWebIDのURLをドラッグアンドドロップすると、追加されます。
WebIDの例:https://taisukef.solid.community/profile/card#me

WebID、ぜひお知らせくださいっ
(2018.10.4追記 「Add a friend on Solid! Add a link to make friends on your new open SNS. #solid #js #web」)

続いて、Solid appづくり
昼休み中にできちゃうアプリづくり、やってみましょう!(Build a Solid app on your lunch break)

チュートリアルを見てもOKですが、もっと簡単、日本語化した Solid app on GitHub を活用ください。
GitHubで、forkして、Settings、Sorceを「master branch」でSaveして、しばらく待つと、https://[自分のgithub ID].github.io/profile-viewer-tutorial/ でアクセスできます!

今回触ったJavaScriptコードは、たったこれだけ (main.js)

const VCARD = $rdf.Namespace('http://www.w3.org/2006/vcard/ns#'); // Display their note (added by taisukef) const note = store.any($rdf.sym(person), VCARD('note')); $('#note').text(note && note.value)

RDFlibというJSのライブラリを使って、人や人との関係を表すFOAF語彙のRDFデータに認証情報付きでいろいろとシンプルにアクセスできます。

Solidのドキュメントには、Linked Data、Solid Appのつくりかた、Solid Serverの立て方なども!

はじめよう、新しいwebへの小さな一歩!
Let's start a small step for new web!

links
Solid (MIT)
- Solid (GitHub)
- Solid Project @ MIT (@SolidMit) | Twitter
- ウェブの父バーナーズ・リー氏、「データを企業から個人の手に取り戻す」新計画 - ZDNet Japan
- “Webの父”バーナーズ=リー氏、個人情報をGAFAからユーザーの手に戻すプロジェクト「Solid」立ち上げ - ITmedia NEWS
- One Small Step for the Web... — Inrupt

インターン最終日の成果発表会を新たなはじまりに! Nuxt.jsはじめのいっぽの計算機

2018/09/07
#intern #js #opendata 

前々週の月曜日にスタートした、高専インターン2018もあっという間に最終日!
4チーム16人、4プロジェクトの成果発表!最高のチームワークを発揮し、ステキなプレゼンを決めてくれました!

修了証書&サイン入りIchigoJam教科書を授与。


jig.jpインターン報告会2018 decorated by KOSEN interns!


「カササス」
遠めの通勤通学、歩く場所の天気を元に、シンプルに傘の必要可否を提示するサービス。
インターン歴史中初の事態、台風による自宅作業の日をうまく利用シーン撮影に使う貪欲さ。
IoT化したり、より細かな情報に対応したりと夢を広げつつ、まずは、自分が超便利に使えるようワガママ仕様で自分向けにデプロイすべし。


「にゃーん」
インターネットネイティブ世代のストレス解消にSNS。でも、うっかり炎上は困るので、いっそ猫語しか使えないSNSをという斜め発想。
どんなネガティブ発言も受け止め、サーバーに送る前に猫語に変換するプライバシー重視設計。投稿されるのは「にゃにゃーん」だけ。誰かが何か言ってるなという空気感を感じられる、サブSNSに良いのかも?
Twitterでは廃止されてしまったUserStreamをAPIもろとも開放し、オープンデータなネコ画像に癒やされつつ、グローバルにつながる猫語ネットワークに平和の緒があるかも!?


「ともたび」
北は八戸、南は沖縄。遠く離れたココ鯖江の地で過ごす3週間。勝手のわからない場所でも、シンプルなチャットでつながるローカルコミュニケーション。
わざわざ来てくれる人に何かしてあげたい地元の人と、せっかくなら地元の人のオススメを知りたい旅人との価値交換による価値創造を最大化しよう!


「アライブ」
水害を知らせる火災報知器的なデバイスと、水位オープンデータとつなぐ、行政向け管理サービス。
エリアメールでは広すぎるため使いづらい水害の警告。とはいえ、避難遅れは命に関わる重大事。安価な専用IoTデバイス化することで、安全安心な町づくりに貢献。
大きなボタンを使ったシンプルなインターフェイスが特徴。


鯖江市の取り組みを紹介してくれた鯖江市役所の牧田さんから、子供、お年寄り、障がい者、インクルーシブで誰にでも優しいデバイスづくりに可能性ありと、牧田さんからアドバイス。


永平寺町エボリューション大使のあみるも観に来てくれて、シリコンバレーでも通用するものありとうれしい講評。 あみるのお気に入りは「ともたび」グローバル対応して、永平寺町でもやりたいとのこと!


こちらも成長させてもらえるインターン!


おつかれさま!


懇親会にて、不完全食がテーマのタンパク質マシマシ、jigカレー#2の材料。


デプロイした結果、カレー味のjigエビという評価。


インターン参加&来鯖、ありがとう!また会いましょう!


インターンの総仕上げの全員ブログ、楽しみにしてるよっ
jigintern2018’s diary

今年のプロジェクトで人気だった、webアプリ用フレームワーク、Nuxt.js(ナクスト ジェイエス)。
ひとまずセットアップと、簡単なn進数計算アプリづくり。

良い機会なので、はじめのいっぽ、クライアントも軽量で、シンプルで、検索エンジン相手の実装も簡単そう。
そろそろブログかえなあかん(福井弁)と思っていたところなので、ちょうどよいかも

<template> <div id="app"> <h1>bin-oct-hex - nuxt.js test</h1> <input v-model="num"> <p>{{ num }} は、2進数で {{ bin }}</p> <p>{{ num }} は、8進数で {{ oct }}</p> <p>{{ num }} は、16進数で {{ hex }}</p> <ul id="src"> <li>APP: CC BY <a href=http://fukuno.jig.jp/2237>fukuno.jig.jp</a></li> <li>Framework: <a href=https://ja.nuxtjs.org/>Nuxt.js</a></li> </ul> </div> </template> <style> body { margin: 5vw 5vh; } h1 { margin: 1em 0em; } input { font-size: 150%; } #src { margin: 1em 0; padding: 0; list-style-type: none; } #src a { color: gray !important; } </style> <script> export default { data () { return { num: 15, } }, computed: { bin() { return parseInt(this.$data.num).toString(2); }, oct() { return parseInt(this.$data.num).toString(8); }, hex() { return parseInt(this.$data.num).toString(16); }, }, head: { title: "bin-oct-hex - nuxt.js test" } } </script>

創るほどに広がる可能性、インターンで感じてくれていたなら、今日の日を終わりではなくスタートに!

緊急時に必要なアプリとは? JavaScriptで光モールス信号でSOS発信するアプリ

2018/09/05
#js #IchigoJam 

平和な日常の尊さ。
いざという時に向けて、プログランミングで備えておけることは何か。

自分の力ではどうにもできなくなった時のSOSモールス符号
「・・・ --- ・・・」

画面の光と音でSOSモールス信号を伝える、JavaScriptによるwebアプリを作りました


webアプリ「SOS

IchigoJamでは、音楽を鳴らすためのPLAYコマンドを使って、モールス信号を実現可能。
プログラムにして、ボタンを押しながら起動で、SOSを発信し続けるデバイスになる。(RUN on IchigoJam)

PLAY"$T400O4 ARARA R2. A2.R A2.R A2. R2. ARARA R1R2."

Code for Japanの関さんがファシリテートする、自然災害に立ち向かうハッカソン
Call for Code ハッカソン
9/15-16、東京お台場にて開催とのこと!

レヴィドラゴンを召喚せよ!プログラミングという魔法

2018/09/04
#KidsIT #minecraft #js #IchigoJam 

IchigoJam開発者としては、示しておきたい、フラクタル(自己相似)の実現!
フラクタルに触れたきっかけ、ドラゴン曲線の一種、レヴィドラゴンの召喚に成功。

複雑とシンプルが入り混じった不思議な雰囲気がフラクタルの魅力。
簡単な手順(アルゴリズム)を、繰り返し(再帰的に)使うことで実現できます。

レヴィドラゴンNを描くアルゴリズム
右向いてレヴィドラゴンN-1を描く、左向いてレヴィドラゴンN-1を描く
(ただし、レヴィドラゴン1は決まった長さの線分)

このアルゴリズムをIchigoJam BASICのプログラムにすると、こんな感じ。

10 CLS:X=23:Y=18:D=0 20 [S]=7:S=S+1:GSB@FRAC 30 END 100 @FRAC 110 IF [S-1]=1 GSB@FWD:GSB@FWD:S=S-1:RTN 120 D=(D+1)%4 130 [S]=[S-1]-1:S=S+1:GSB@FRAC 140 D=(D+3)%4 150 [S]=[S-1]-1:S=S+1:GSB@FRAC 160 S=S-1:RTN 200 @FWD 210 X=X+(D=1)-(D=3):Y=Y+(D=2)-(D=0) 220 LCX,Y:?CHR$(236); 230 RTN

コンピューターサイエンスには欠かせない、データ構造の一種、スタックを使った再帰について詳しくはこちら。
ハノイの塔で遊んで分かる再帰的アルゴリズム(最大公約数、階乗、フィボナッチ)


子供に大人気のマイクラをハックする8x9Craft」を使った、もう一つの建築方法、world.setBlockを使ったレヴィドラゴンを描くJavaScriptのプログラムがこちら。

crab.setCreative(true); var item = Items.BlockofGold; var x = 0; var y = 2; var z = 0; var d = 0; var forward = function() { x += (d == 1 ? 1 : 0) - (d == 3 ? 1 : 0); z += (d == 0 ? 1 : 0) - (d == 2 ? 1 : 0); world.setBlock(item, x, y, z); }; var turnRight = function() { d = (d + 1) % 4; }; var turnLeft = function() { d = (d + 3) % 4; } var frac = function(n) { if (n == 1) { forward(); forward(); } else { turnRight(); frac(n - 1); turnLeft(); frac(n - 1); } }; frac(8);

プログラミングの基本は、コンピューターとのおはなし。
やってほしいこと(アルゴリズム)を、プログラミング言語という言葉で伝えます。
いろんな方言はありますが、ひとつしっかり覚えれば、その応用でどんどん話せる言葉が広がります。

自動建築ロボットは、マイクラの世界だけでなく現実社会にもロボットとして出現する時代。
コンピューターがない時代からすると、チートや魔法にしか見えない、プログラミングの世界。
ワクワクするものからどんどんモノにしていきましょう!


大人も楽しい、プログラミング、興味持った方、9/22に禅の里、永平寺町「四季の森会館」にてイベント!
Amil's Website: 2018年9月22日:禅xシリコンバレーxIchigoJam体験プログラミングワークショップ(初心者向け)
講師は、永平寺エボリューション大使「あみる」と私。
今回は子供にも高専生にも人気なIchigoJamのプログラム、プログラミングの真髄に、手軽に触れてみましょう!

links
- はじめての統計プログラミング with IchigoJam / 神々の里、高千穂エディション神よけゲームで遊び学ぶ統計動画レポート
- 防ごう子供のキーボード離れ!1行短縮かわくだりゲームの入門スライド - 総務省統計局でプログラミング体験!
- ハノイの塔で遊んで分かる再帰的アルゴリズム(最大公約数、階乗、フィボナッチ)
- マシン語で150倍速!フルカラーLED「APA102C」がお土産のゲーム機を作ろう福井高専公開講座
- 地図アプリでふりかえる、センサーとまちあるき!まちをよくするアイデアとIchigoJamプログラミングつぎのいっぽ
- Amil's Website: Beginner's Zen Programming Workshop @Eiheiji
- Amil's Website: Zen Programming - Private Class

JavaScriptでハックするマイクラ!8x9クラフトでフラクタル建築に挑戦しよう

2018/09/03
#KidsIT #minecraft #js 

マイクラはじめのいっぽ」の次はプログラミングでハック!
無限にブロックが使えるレゴ的な遊びを楽しんだら、より楽するために、コマンドを覚えていく流れ。
そして、夢の自動化。


神戸発のマイクラMOD「8x9Craft ハッククラフト」を使うとロボットに建築させることができちゃいます。
建築ロボットしても活躍する「はっくん」を「はっくんの貝殻」アイテムで召喚したら、コマンドで動かそう!

/crab forward

IchigoJam BASICと同じように行番号で記憶させて、runで実行!

/js 10 crab.up(); /js 20 crab.up(); /js 30 crab.forward(); /js 40 crab.forward(); /js run

http://localhost:8080/codeEditor」にブラウザで開くとJavaScriptのコードが書ける。

プログラムといえば、ジュラシックパーク小説版ではまったフラクタル!

crab.setCreative(true); crab.up(); crab.up(); var frac = function(n) { if (n == 2) { crab.forward(); crab.placeDown(100); crab.forward(); crab.placeDown(100); return; } frac(n - 1); crab.turnRight(); frac(n - 1); crab.turnLeft(); } frac(8);

crab.setCreativeでブロック無限モードにして、再帰呼び出しを使ってフラクタル図形を描かせよう!


はっくんがポチポチとブロックを置いていく様子を眺められます。
並行して、はっくんは何個もおけるので、待っている間にも別の場所でプラグラミングして、実行!


こちらの画面は、いろんな数とブロックで呼び出し、はっくんに書いてもらったフラクタル!

var BLOCK = 230; crab.setCreative(true); crab.up(); crab.up(); var frac = function(n) { if (n == 2) { crab.placeDown(BLOCK); crab.forward(); crab.placeDown(BLOCK); crab.forward(); return; } crab.turnLeft(); frac(n - 1); crab.turnRight(); frac(n - 1); crab.turnRight(); frac(n - 1); crab.turnLeft(); frac(n - 1); } frac(6);

オススメのBlockID
100(赤きのこ)、35(白)、41(黄)、222(水色)、230(青)
* Block_IDs - Java Edition data values – Official Minecraft Wiki


いろんなフラクタル図形に挑戦してみよう!
上下移動を組み合わせた、3Dフラクタル建築もおもしろいですよっ

links
- PCN神戸
- キッズプログラミングスクール8×9(ハック) | 現役エンジニアが教えます
- 8x9Craft ハッククラフト

IchigoCakeでナムコキャラ&ナムコサウンドを操る! CakeRes x レトロゲームズ でサウンドテスト

2018/08/22
#js #IchigoJam 

IchigoJamの拡張版、ツインCPU搭載のIchigoCake。
IchigoLatte x PanCake の「IchigoCake JavaScript」が先行販売中。
IchigoCakeに、あのナムコキャラ&ナムコサウンドが操れる拡張パック「CakeRes x レトロゲームズ」が登場!

©BANDAI NAMCO Entertainment Inc.
カタログIPオープン化プロジェクト|バンダイナムコエンターテインメント

ゼビウス、パックマン、ギャラガ、ギャラクシアン、マッピー、ワルキュレーレの冒険のBGMや効果音をランダムなキャラクターと合わせて堪能するプログラムを作成!

IchigoCake JavaScript (IchigoLatte)によるプログラムはこちら

var pc=new PanCake(); var a=new Array(); a[0]=4;a[1]=1;a[2]=2;a[3]=2;a[4]=2;a[5]=1;a[6]=1;a[7]=3;a[8]=3;a[9]=3;a[10]=3;a[11]=3;a[12]=2;a[13]=1;a[14]=1;a[15]=1;a[16]=1;a[17]=1;a[18]=1; function snd(n) { if (n==19) { pc.mLoad(0,0x26); pc.mLoad(1,0x29); } if (n==20) { pc.mLoad(0,0x2c); pc.mLoad(1,0x2e); pc.mLoad(2,0x30); } if (n<18) { var s=0; var i=n; while (1) { i=i-1; if (i<0) break; s=s+a[i]; } var i=a[n]; while (1) { i=i-1; pc.mLoad(i,s); s=s+1; if (i==0) break; } } pc.mPlay(1); } var n=0; function key(k) { if (k) { pc.reset(); show(); snd(n); n=(n+1)%21; } } setBprs(key); function show() { pc.sStart(rnd(16)); var m=0; while (1) { pc.sCreate(m,rnd(0xf0)); pc.sMove(m,rnd(10)*8,rnd(5)*8); m=m+1; if (m==10) { break; } } } key(1);

最大4和音奏でるPanCake、最大3トラックで作られたナムコサウンドをpc.mLoadで設定して、pc.mPlayで再生!
BGMと効果音(SE)を別チャネルで設定すれば、同時に鳴らすこともできますよ。
マッピーとワルキューレは、きっと長いトラックのため、番号が飛んでいるところに注意。


大作づくりが狙える容量も拡大している拡張版!
IchigoCake BASICが楽しみですねっ。


めがねストラップづくりも楽しんだ、高専インターン Day3


IchigoSoda(= IchigoJam x sakura.io)を使ったIoTミニ講座!


16人、4プロジェクト、進捗良しです!

links
- CakeRes×レトロゲームズ
- カラフルなドット絵で楽しくプログラミング! 「IchigoCake(いちごけーき) JavaScript」 - ショッピング | +Style (プラススタイル)
- IchigoCakeを楽しもう - OpenSpace

アイデアを出す4つのコツ - Webアプリでセキュアなズーム付き鏡、webmirror

2018/08/21
#js 

インターンDay2は、スクラム勉強、企画会議、チーム分け、ビジョンづくり、定時後のお楽しみ、かんばんゲーム!
詳細はインターンブログ参照「本格始動! - jigintern2018’s diary

企画・開発・提供を行う、jig.jpのミニ版を体験してもらう3週間の開発インターン。
苦手意識を持つ人が多いアイデア出しのコツ4つを伝授。
1. 日常の不満 (ちょっとした不満をまず挙げる、意外な解決方法がきっとある)
2. 未来の普通 (社会変化で10年後はどうなっているだろう?今の常識も過去では非常識)
3. 新技術 (アイデアは組み合わせ、新技術を組み合わせると自然に新しくなる)
4. オレ得 (とにかくオレは作りたい!意外と共感してくれる人がいるよ、世界は広い!)

アイデア出すこと自体は超簡単。難しいのはヒットするアイデア。こればっかりはやってみないと分からないので、とにかく表に出してみることが大事。 みんなで眺めながらいろいろ話している内に、いろいろつながってやりたいものが見えてくる。

今日の私の不満、なぜかズームできないiPhoneのインカム、鏡として使う時にズームしたい。そこで、

webmirror zoom」 (src on GitHub)

映像流出リスクが気になるインカム使うアプリ。Webで使うカメラAPIはHTTPSでないと使えません。GitHub上に撮影した映像を流用していないことを証明するプログラム(ソースコード)を開示(オープンソース)しているので、安心です!

使うほどに上がるプログラミング技術、身の回りのアイデア、どんどん実現しちゃいましょう!

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