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

まずはゲームを作ってみたい。だったら、思う存分作ってみよう!

ゲームづくりに含まれるプログラミングテクニックは、様々なアプリケーションづくりに応用可能。
快適に動作させるためにアルゴリズムを工夫することは、サービス運用時のコスト削減に直結。

パソコンを持っている高専生にオススメは、作ったアプリを友達に自慢できるJavaScriptを使ったwebアプリ。
eggamejsとして、かんたんゲームフレームワークを提供します。

サンプルアプリ、ワンキー弾幕ゲーム「dnmk
タップや、クリックでちょっと浮かびます。狙ってくる弾を可能な限り避けよう。


egclockjs
時計アプリをオリジナルでつくってみようという課題作品を掲載しました!

プログラミング言語も語学の一種、英語と一緒で使えば使うほどに楽に使えるようになりますよ!
まずは一週一創あたりから作るペースを身に着けよう!

今週は、eggamejs の作品募集!
GitHubアカウントをつくって、forkして、改造して、READMEへ「プルリク」ください!
質問は issues へどうぞ。

5/28、jig.jp、16周年記念日、リクエストあってjigカレー。

今回のオープン隠し味は、IchigoJam専属農場の採れたてイチゴ!


おいしそうに赤くなったイチゴ発見!引っ張るとプチっと良い音がします。


PCN大野研究所長、前川さん。元福井高専の先生で、今も非常勤でアマハム部支援に来てくれてます。
納屋で語る、Oculus Questと高専教育。電波をVR空間で見るアプリとかおもしろそう。
VRですべての学習を実験化、体験化できる!


たった2株のイチゴの苗から始まった IchigoJam専属イチゴ農場、3年目には、こんな広大なイチゴ畑に!


17kgも収穫。


12時から準備を始めるのがjigカレー、買い物がスピード勝負。カットサラダは多めに買いましょう。


煮込まないのがjigカレー。すぐ火が通る、こま肉をチョイス。牛が安心度高め。ひき肉は溶けちゃうからコスパ悪いかも。


包丁禁止がjigカレー。調理済み煮物系も重宝します。


12:20、予め沸騰させておいた鍋に肉から投入。足を伸ばした買い物で、5分押し。


後は煮込みながらどんどん投入。


採れたてイチゴ、15コ投入。


12:35 完成!jigカレーイチゴ味、概ね好評!
調理済みごぼうは大正解!


イチゴミルクとタピオカも登場。


良い色のイチゴ!まだまだあるので、イチゴジャムに!


イチゴ1kgに、砂糖300g。混ぜて、2時間放置し、煮込み開始!


アク取り、大事?


1時間ほど完成!煮沸消毒した瓶を準備しておきましょう。


食べられるイチゴジャム、できあがり!
食べられない IchigoJam と同様、手作りは楽しいですね!

links
- How to make IchigoJam eatable edition! 食べられるIchigoJamのつくりかた
- 完全まちの要素とは?鯖江市長、フリーミアム動物園、創造拠点Hana道場とオープンソースなjigカレー
- 150枚限定、IchigoJam - jig.jp 15th anniversary edition
- jig.jpロゴに隠されたひみつ - jig.jp 10周年

jig.jpの部活のひとつ、デザイン部。部活動でデザフェス出展!
ものづくりイベント Maker Faire とはちょっと違う雰囲気がまたおもしろい。

攻めたコスチューム発見。
テープLEDで飾ったメリーゴーランド、WS2812Bを使うと個別制御できて楽しいですよ!

WS2812BフルカラーLED制御対応 IchigoJam β だととっても簡単!
見に来てくれた、幼稚園児、小学生も興味津々!

お気に入り「暗いエリア」、ほんのり光るふわふわがステキ!

光で飾る。

光る昆虫。明かりデザイン、研究したくなりますね。

暗いエリアで活躍、光るネクタイ

秋葉原の明和電機ラジオスーパーHana道場通販でも入手可。改造方法はこちら

マトリクスWS2812Bを使った電光掲示板、布一枚通すと、いい感じという発見。

IchigoJam BASICで変更可能な電光掲示板のデザイン。(制御方法

スマホで描けたら便利そう、ということでひとまずざっくりつくってみました!

デンコーデザイナー - dotec48x8
URLがデータになっているので、変換して表示してみましょう!

1960年世界人口の3%だった日本は、2017年現在で1.69%。
このまま日本の人口減少と、世界の人口拡大が続くと、ますます薄れる存在感。

世界銀行の人口オープンデータを世界カラム地図にマッピング。1960年から最新の2017年までの変遷をざっと追えるアプリにしてみました。

世界人口カラム地図 / The World Population TabularMaps
中国とインドだけで40%近く、特にインドの増加がすごい!


こちら日本が世界人口の3%あった1960年のスクリーンショット。GDPなどの割合など、いろいろマッピングして見るのもおもしろそう。 カラム地図、世界を見るのに便利!

高専を選ぶ中学生もまた、1%。
ものづくり好き、プログラミング好きな高専生向け夏休み恒例企画、jigインターン2019、募集開始!
全国高専生向けjig.jpインターンプログラム2019 ~募集開始のお知らせ~
今年は随時選考、定員なり次第終了するので、応募はお早めに!


jigインターン2018ブログ - jigintern2018’s diary

jig.jp、創業から一緒、インキュベイトファンドの初パーティー!

VR、宇宙、食、教育など様々な分野でチャレンジするスタートアップ仲間との楽しく、刺激的な時間!


さりげなく着用していた「光るネクタイ」の改造方法を紹介。

宇宙ビジネスで熱い、水という資源が眠る月!
月色に光るネクタイを作ってみましょう。コアとなるマシン語プログラムはこちら。

R0=18 R1=[@DATA_GRB]L CALL @WS2812B @DATA_GRB DATA L #141000

RGB、3つのLEDの強さは、G、R、Bの順番に16進数で指定します。

月色に光りました!

asm15でアセンブルした後、BASICのデータ部分の末尾3byteを書き換えれば自在に色が変えられます。

40 POKE#7AD,20,0,0


緑に!


今回は昇圧回路とスイッチを使わず、単4電池ケース縦2本でつくる重いけどより安価版。
基本的な作り方は、「光るネクタイのつくりかた」と一緒です。


電池温存する場合は紙などを挟んでおくと便利。(やっぱりスイッチはほしかった)


4KBに拡張された、IchigoCake BASICを使うと、LPC810 Writerとプログラムが1ファイル化もできます。


LPC810への書き込みを実行、SAVE0しておけば、画面がなくてもボタン押しながら実行で書き込み簡単!

Armマシン語(asm15形式)、WS2812B単色表示プログラム全文

DATA L #10000400 ' stack DATA L #21 ' entry point DATA L 0, 0, 0, 0, 0 DATA L #EFFFFBDF ' VALID_CODE = 0x100000000-0x10000400-0x21 @ENTRY R0=[@SYSAHBCLKCTRL]L R1=#DF 'SWM, GPIO, I2C:off, FLASH, FLASHREG, RAM, ROM, SYS [R0]L=R1 R0=[@FLASHCFG]L R1=[R0]L R2=3 ' flash no wait: set 0b00 R2=~R2 R1&=R2 [R0]L=R1 R0=[@PINENABLE0]L R1=[@PINENABLE0_DATA]L [R0]L=R1 R0=[@GPIO_DIR0]L R1=`1100 ' PIO0_2 and PIO0_3 [R0]L=R1 @MAIN R0=18 R1=[@DATA_GRB]L CALL @WS2812B CALL @WAIT GOTO @MAIN 'WS2812B driver 'param ' R0 - data count (ex WS2812B 1 led = 1) ' R1 - G R B 'use ' R2 - OUT value ' R4 - GPIO address ' R5 - bit count @WS2812B R4=[@GPIO_NOT0]L R2=`100 ' PIO0_2 @LOOP_DATA R5=1 R5=R5<<23 @LOOP_BIT [R4]L=R2 R1&R5 IF 0 GOTO @ZERO NOP NOP NOP NOP NOP NOP NOP [R4]L=R2 GOTO @JOIN @ZERO NOP [R4]L=R2 NOP NOP NOP NOP NOP NOP @JOIN R5=R5>>1 IF !0 GOTO @LOOP_BIT R0-=1 IF !0 GOTO @LOOP_DATA RET 'WAIT 'use ' R7 - wait count @WAIT R7=[@WAIT_N]L R7-=1 'wait R7*3+1 clock IF !0 GOTO -1 RET ' init @SYSAHBCLKCTRL DATA L #40048080 @FLASHCFG DATA L #40040010 @PINENABLE0 DATA L #4000C1C0 @PINENABLE0_DATA DATA L #FFFFFFBF @GPIO_DIR0 DATA L #A0002000 @GPIO_NOT0 DATA L #A0002300 ' WS2812B @WAIT_N DATA L 400000 @DATA_GRB DATA L #141000

いろいろ改造してお楽しみください!
光るネクタイ、明和電機秋葉原店「ラジオスーパー」で入手可!

ポスターなどをまっすぐ貼りたい!を実現するARアプリ「gmeterAR
スマホの外カメラの映像に、加速度センサーを使った補助線をいれました。


gmeterAR」 for iPhone/iPad/Android

以前作った傾きを調べるミニツール「gmeter」を、ARフレームワーク「egarjs」を使ってAR化。
まっすぐが気になる人、ぜひ使ってみてください。

DAISO版500円で買えちゃうスマホVRで作った、遅延メガネテクノロジーを横展開、iPadのカメラを使った過去を映す鏡「delaymirror」を開発。

メガネをかけている人の悩み、メガネを外すとよく見えない。
1.5秒過去が映る鏡を使って、自分の新しいメガネ姿を見てみましょう。


delaymirror
iPad, iPhone 他、インカメラがあるPCでも動作します。
めがね会館1FのショップにあるiPadでもご利用いただけます!
(タップすると、画面を停止する機能付き。停止があれば、遅延いらないかもw)

映っている映像はどこにも送信していません。
オープンソース on GitHub、なので心配ならご自身でチェック可能です!
egarjsを使えば、カメラを使ったアプリ開発が簡単便利。ぜひ、チャレンジしてみてください。

links
- egarjs かんたんARフレームワーク - #jigjs

PCNこどもプロコンでノートパソコンをゲットしたこどもや、高専生などにおすすめしたいプログラミング言語 JavaScript。 webを通じて、世界中のパソコンやスマホ、一部のゲーム機でも動きます!

シンプルなフレームワークを提供する jigjs のひとつ、時計フレームワーク「egclockjs」を使って、学生が好きな弾幕シューゲー風時計を作ってみました。


danmaclocksrc on GitHub

中央から放たれる弾幕、開始角度が長針、終了角度が短針です。
慣れれば読めます。

弾幕の数や、回転させる数、弾の飛ぶ速度と加速度、あれこれいじって実験してみましょう!

弾幕に三角関数の cos と sin は欠かせません!
とりあえず定石的に使いつつ、試行錯誤、いろいろ遊びながら理論に触れるとすっと理解できます。

links
- スマホを手にしたら挑戦したいJavaScriptで楽しいwebアプリづくり!かんたんフレームワーク群 jigjs 第5段は時計アプリフレームワーク

G空間ハッカーはじめのいっぽ「Geospatial Hackers Program | Peatix
福井会場の1日目は、サンドーム福井のものづくりキャンパス


40名もの参加者、みんなでつくろう地図アプリ!


Chromeじゃないと動かなかったり、コピペの貼り付け場所が分からなかったり、いろいろありましたが、それぞれの地図アプリできました!
Forks · code4fukui/egmapjs


かんたんマップアプリづくりハンズオン(egmapjs 地理院地図編)スライド (PDF)
分かりづらかった点など、ブラッシュアップしました。
地図アプリのページ、下にQRコードを出したので、すぐにスマホで確認できますよ!
誰かに教えるのも簡単、自分だけの地図アプリ、自慢しちゃいましょう。


SPARQLを使ったサンプル位置ゲーム「消火栓へゴー」とすぐにお試し「チュートリアル
こちらを元にあれこれ改造するのもいいですね!

文書を編集するHTML、プログラムをつくるJavaScript、デザイン変更CSS、データを取得するためのSPARQL。
用途に合わせて登場する、4種類のコンピューター言語、興味があるものから、ひとつずつ遊んでみると良いですよ!

links
- egmapjs

福井高専テスト明け、IT研究会でミニLT会!

トップバッター福井高専IT研 部長による「C++でゲームを作ってみた」


VRとシェーダーとUnityのススメ
こちらGitHubにC#のプログラム、VR空間で撃ってターゲットを破壊するコードもとってもシンプル!
VRアプリは意外と簡単、部費でVR機材、買っちゃう!?


世界征服が夢の高専生が部活を征服する話 / I wanna dominate this world - Speaker Deck
スペシャルゲスト、山口県宇部高専のG空間ハッカー、コンピューター部部長のはすみんのLT
高専IT系部活のありかたのディスカッション、もりあがりました!


kirakira - egarjs sample
(書籍はIchigoJamとの接続も掲載、超特急Web接続!ESPマイコン・プログラム全集
簡単にできてテンションあがるARアプリ、かんたんフレームワーク化しました。#jigjs 第6段!


egarjs」こちらのQRコードをスマホで読み取ってお試しください!


さまざまな解像度があるPC、スマホに簡単に対応できるよう、座標系として真ん中を(500,500)とした 1000x1000 の正方形を採用(sg-game.jsと同様)

例えば、左上から右下へ線を引きたかったら

g.drawLine(0, 0, 1000, 1000)

まんなかに円を描きたかったら

g.fillCircle(500, 500, 10)

など、とってもシンプル!

ミニLT「ARアプリをつくろう」でデモした、色がみえるアプリ iromieru はこちら


福井高専メディア研究会のFMラジオ番組「高専ライブ」の収録
コミュニティFMラジオ放送局、たんなん夢レディオは福井高専の一期生が創設!


ものづくり好きネットワーク、宇部高専x福井高専x石川高専!
高専生と、地域のものづくり好きな子供や大人たちとつながる場、Hana道場も見学。

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