2026年6月13日土曜日

Tetorica Retro Player を作成しました

Tetorica Retro Player を作成しました。

https://kyorohiro.itch.io/tetorica-retro-player


元々は、昔集めた動画や、ZIPで固めた漫画を、ブラウン管テレビやレトロゲーム機のような雰囲気で再生してみたい。

そんな願望から作り始めたアプリです。

動画や画像を読み込み、

  • CRT（ブラウン管）
  • PC-98風
  • Game Boy風
  • Neon
  • Lo-Fi Audio
  • Radio Mode

などのエフェクトを適用して再生できます。

開発当初はシンプルなレトロフィルターを想定していましたが、作り続けるうちに、

  • Comic Viewer
  • Recording
  • Window Capture
  • Chrome Extension
  • Audio Effects
  • Phosphor Dot

など、多くの機能が追加されました。

特に Phosphor Dot の実装では、CRTシェーダ界隈で有名なモアレ問題にまで到達し、自分でも驚きました。

実際に使い込んでみると、

「正確なブラウン管再現」と
「気持ち良く楽しめること」

は必ずしも同じではなく、レトロな雰囲気を楽しむための道具として考えるようになりました。

AIの支援を受けながら開発したことで、以前なら半年以上かかっていたであろう試行錯誤を短期間で繰り返すことができました。

結果として、

「昔集めたコンテンツを、自分の好きなレトロな見え方で楽しみたい」

という当初の目的は十分に達成できたと思います。

ひとまず Tetorica Retro Player は一区切りとして、次の作品作りへ進もうと思います。

[Code]
https://github.com/kyorohiro/tetorica-retro-player

[Github.io] - PWA Demo

[Itch Page] Desktop and Android and Web  

[Chrome Plugin] Chrome Plugin
https://chromewebstore.google.com/detail/tetorica-retro-player/clnpmlgahomdkphcpcajbemodneoecna


About Demo

The following demo uses material from:

Comic Book + Candy #12 (1963)
Available from ComicBookPlus:
https://comicbookplus.com/?dlid=28525

Big Buck Bunny
https://peach.blender.org/

時刻: 0 件のコメント:

2020年5月3日日曜日

mbedtls dart の 開発を始めた web wasm ffi io flutter

C言語 で開発した機能を、Dart をターゲットとして、Web でも サーバーでも、そして Flutter  でも使えるようにしたい。

そこで、mbedtls の 暗号化の部分を Dart 向けのPackageを作りながら、
実現方法を試行錯誤する事にした。


dart:io 向けには dart:ffi を。 webdeb 向けには wasm を通して
C言語で書かれた機能を、Dartに移植する予定だ。

[REF]

開発中のコード
https://github.com/kyorohiro/mbedtls_dart

mbedtls
https://github.com/ARMmbed/mbedtls





時刻: 0 件のコメント:

2018年1月4日木曜日

ServiceWorler メモ

Service Worker の オフライン機能を利用したいので、
あれこれ試してみた。

Memo PWA (0)

 Memo PWA (1) ServiceWorker for offlineapp

Memo PWA (2) Dart PWA Package


時刻: 0 件のコメント:

2017年12月29日金曜日

Emscripten メモ

以前、Emscripten で、あれこれ作成していたのだが、
再学習することにした

Index


(1) Hello, World with Emscripten
(2) Using WASM option At Emcc
(3) Create html
(4) Connect to Javascript
(5) Connect to Javascript structure ‘s pointer
(6) Output args In Function (1)

 (7) Output args in Function (2)


PS

following is emscripten 's code which I tried to write about  previously.

https://github.com/kyorohiro/doc_sdl2
https://github.com/kyorohiro/ccore
https://github.com/kyorohiro/cvectorMath
https://github.com/kyorohiro/capp
https://github.com/kyorohiro/cgame

時刻: 0 件のコメント:
ラベル: ,

2017年12月4日月曜日

About Dart x SDL on Mac

Dart の Native Extensions を利用して、 SDL　を用いたマルチプラットフォームのゲーム開発環境を作れるか検証してみた。


結論からいくと、 「Mac　上で動作する SDL x Dart の アプリは動作させることが難しいよ」 と言うことです。 Windowsはできる。

ただ、時間をかければできるかなぁとも思いました。
※ Dartはゴリゴリ開発されているものなので、近い未来には、変わっているかもしれません。


# Dart とは

Serverサイド や SmartPhone で動作する VM　をもち、 Browser上で動作する JavaScriptを出力できる 凄い奴です。
https://www.dartlang.org/


# Native Extensions とは

コマンドライン向けのVMから、 Shared Library と連携して、Nativeの機能をDartから叩くのに使用します。

https://www.dartlang.org/articles/dart-vm/native-extensions

# SDL とは

クロスプラットフォームの Low level のライブラリーです。 audio, keyboard, mouse, joystick, graphics hardware を扱うことができます。

ゲームを作成するのに必要な機能がサポートされており、スマフォの環境も含めて、ほとんどの環境で動作します。


# 試したこと


## Dart と SDLを組み合わせて、 Dartで書いたゲームをありとあらゆる PFで動作させることができないか?


Dart と SDLを組み合わせて、 Dartで書いたゲームをありとあらゆる PFで動作させることができないか?　と考えました。

Dartには、 async-await がサポートされていたりして、 ロジックが書きやすいです。ゲームスクリプトとか、 Dartがあればあればいらないじゃん。 Dartがゲーム用のスクリプトといって問題ないくらい。気軽にロジックがかけるではないか..


## Dart


#### MAC で

https://github.com/kyorohiro/dart.sdltest

```
git clone https://github.com/kyorohiro/dart.sdltest
cd dart.sdltest
cd doc_sdl2
ninja -f build.osx.ninja
cd ..
sh build.sh
dart main.dart
```


#### Windows で


https://github.com/kyorohiro/dart.sdltest.vc

```
git clone https://github.com/kyorohiro/dart.sdltest.vc
cd dart.sdltest.vc
start Project3.sln
...
Debugモードでビルド.....
...
cd ..
git clone https://github.com/kyorohiro/dart.sdltest
cd dart.sdltest
copy {ビルドしたDLLとLib と SDL関連のDLL} ./
dart main.dart
```

# どうなったか?

Windowsでは、期待通りに動作します。
つまり、Dart で SDLアプリを作れます。



しかし、MACでは以下のようなエラーがでます。

とすると、 WARNING: nextEventMatchingMask should only be called from the Main Thread! This will throw an exception in the future.
と警告がでてそれ以上何もできません。

Mac では　UI　関連のイベントは、 MainThreadで処理しなくてはならないからです。



# もしも macで Dart x SDLを実現したいなら

DartVM に手を入れて MainThread を、制御できるようにする。
DartVM と プロセスを分けて、MainThreadを描画ように利用する。
などなど。

Flutter のコードを見ると、 DartVM を組み込んで　アレコレしているので、
参考にしたり、 そのまま利用したりすると良いかもしれません




時刻: 0 件のコメント:

2017年9月26日火曜日

Bake tiny calc app at antlr3 and Clang with emscripten

ゲームスクリプトを設計しようかと考えた。
文字で書かれた文章を構造化して、書かれた事を実行する。
ANTLR を 使う事にした。
Emscripteで利用するまでについて、解説します。



結論から

ANTLR3 (http://www.antlr3.org/)を利用します。ANTLR4は、C言語がなさげ、CPPはあります!!

ANTLR3 で 生成した Parser と Lexer は、 emscriptenようにビルドしましょう。
少しだけ変更します。以下の通り

電卓を作りました。参考までにどうぞ


コンパイラーコンパイラー

文字で書かれた文章を構造化するのに、Lexer と Parser を作るのがトレンドです。
Lexerで単語を分割する。Parserで分割した単語を木構造化するといった感じです。

こう書くと難しそうですが、いたって簡単です。
文章を構造化するとは、プログラマー的には、文章を関数化するという事です。
これを、念頭に読んでください

「xxx は yyy が zzz です。」を構造化してみましょう。

関数で木構造を表現する

void sentence() {
  xxx();
  printf("は");
  yyy();
  printf("が");
  zzz();
  printf("です。");
}

void xxx() {
  printf("私");
}

void yyy() {
  printf("ポテチ");
}

void zzz() {
  printf("すき");
}

こんな感じで出かけます。 xxx() yyy() zzz()を、自分好みに書き換えれば、
構造化の完成です。
今回の場合だと、「私はポテチが好きです」と表示されるはずです。


関数で構造解析木をつくる

xxx() yyy() zzz() の部分に何が入るかを、解析するのが、Parserです。

void  sentence(char *src) {
  src = xxx(src+1);
  if(src[0] !="は") {
    return; // failed to parse
  }
  src = yyy(src+1);
  if(src[0] == "が") {
    return; // failed to parse
  }
  src = zzz(src+1);
  if(src[0] != "で" || src[0] != "す") {
    return; // failed to parse
  }

}

char* xxx(char *src) {
  char data[100] = 0;
  for(int i=0;;i++) {
    if(src[i] == 'は') {
      return src+i;
    }else {
      data[i] = src[i];
    }
  }
}

char* yyy(char *src) {
  char data[100] = 0;
  for(int i=0;;i++) {
    if(src[i] == 'が') {
      return src+i;
    }else {
      data[i] = src[i];
    } 
  }
}

char* zzz(char *src) {
  char data[100] = 0;
  for(int i=0;;i++) {
    if(src[i] == 'で') {
      return src+i;
    }else {
      data[i] = src[i];
    }  
  }
}


こんな感じです。書くのが大変ですね。

コンパイラーコンパイラーが、かわりにやってくれる

この、大変な作業を、BNF形式で記述すれば自動で生成してくれるのが、
コンパイラーコンパイラーと言われるものです。

今回は、ANTLR(http://www.antlr.org/)を利用しました。


ANTLRについて

C言語は、ANTLR3をつかう

antlr4だと、C++ようはあるのですが、C言語用がありません。


Emscriptenようには、ビルドする

このコードを、自分でビルドします。少しだけ変更が必要でした、
ninja build できるようにしたものを、以下に起きました。


Java版は生成されるのに、C言語版はWarningがでる

```

warning(24):  template error: context [/outputFile /parser] 1:1 could not pass through undefined attribute filterMode
warning(24):  template error: context [/outputFile /parser /genericParser /_sub45 /ruleAttributeScopeFuncMacro] 1:4 no such property or can't access: null.attributes
warning(24):  template error: context [/outputFile /parser /genericParser /_sub45 /ruleAttributeScopeFuncMacro] 1:4 no such property or can't access: null.attributes
```
これは、でても問題ないそうです..

出力するParserの言語のしていは、グラマーファイルに書く


こんな感じ

PS

電卓のサンプルを起きました。

参考までにどうぞ。


REF BOOK




時刻: 0 件のコメント:
ラベル: , , ,

2017年9月24日日曜日

Layer For GL and SDL1 and SDL2 on html5 and Mac and Windows



私は、今、特殊なゲーム用のライブラリーを作成しているのだが、
SDL1 SDL2 html5 mingw osx で、発生する差異を吸収するレイヤーを作成することにした。
https://github.com/kyorohiro/capp

今の所、Image、Sound、TTF、GL が使えます。
徐々に、ビルド環境の構築方法や、イベントの対応などの機能が増えていくはずです..



Purpose

C言語だと、IfDef で、差異を吸収するわけだが、
このコードのあちこちであると、管理が面倒になるので、
それらを、cappライブラリーにまとめることにしたのだ。
https://github.com/kyorohiro/capp


cappライブラリーを作成する前に、もっと短いコードで確認してもいて
それは、以下にあります。
https://github.com/kyorohiro/doc_sdl2


MINGWについては、過去記事を参考にして、GLEWライブラリを生成してください。
http://kyorohiro.blogspot.jp/2017/09/build-sdl-x-mingw-x-opengl-s.html




...

おわり








------

試したコード
https://github.com/kyorohiro/sdl2_doc
This codes can build for windows and mac and html5 on windows and mac

作成中のライブラリー
https://github.com/kyorohiro/cgame

ことはじめ
https://kyorohiro.blogspot.jp/2017/09/which-use-sdl1-or-sdl2-at-emscripten.html




時刻: 0 件のコメント:
ラベル: , ,
登録: 投稿 (Atom)

Tetorica Retro Player を作成しました

Tetorica Retro Player を作成しました。 https://kyorohiro.itch.io/tetorica-retro-player 元々は、昔集めた動画や、ZIPで固めた漫画を、ブラウン管テレビやレトロゲーム機のような雰囲気で再生してみたい。 そんな...

  • KyoroStressの技術 -1- Low Memory Killer を意図的に発生させたい
    [課題] Low Memory Killer を意図的に発生させたい Androidには、ヒープが涸渇すると使われていないアプリをKillする機能があります。 この記事では、意図的にヒープを枯渇させて、この状態をつくる方法について説明します。 単純にヒープを大...
  • About Dart x SDL on Mac
    Dart の Native Extensions を利用して、 SDL　を用いたマルチプラットフォームのゲーム開発環境を作れるか検証してみた。 結論からいくと、 「Mac　上で動作する SDL x Dart の アプリは動作させることが難しいよ」 と言うことです。 Wind...
  • Which SDL1 or SDL2 with emscripten
    Emscripten と OpenGLを使ってゲームを作ろうと思いたって、 まずは、SDL2の基本的な使い方を試していた。 しかし、今の所は、SDL 1系 の方が、良いと思いました。 SDL2があるのに、SDL1 を選ぶのはなぜか? # 201...