開発メモ

17/12/27
app7_preact_pixi


・Typescript, fusebox, preact, pixi.js
・Entity-Component-Systemを検討
・pixi.jsによる描画
・全方位移動/狙撃を実装

WSAD/カーソルキーで移動,マウスでAIM&狙撃です。
実行ページ

17/12/22
app3_pixi

・Typescript, fusebox, pixi.js
・Actor継承パターン
・ES6 generatorを使った敵の行動記述を実装
・pixi.jsによる描画
・弾を出す

17/12/21
app2_inferno

・Typescript, fusebox, inferno
・スマホでのスワイプによる自機移動を実装
・広いワールドを実装
・ワールド全体をメインスクリーンとは別のCanvasでデバッグ表示

ドラッグ/スワイプで移動です。
実行ページ

17/12/20
app0_react

・Typescript, fusebox, React
・スマホ用描画枠作成
・デバッグ用描画領域確保
・canvas上に自機を表示/移動

2017/12/18
新しいゲームの開発を計画
[概要]
・オンライン多人数対戦弾幕STG
・PCブラウザ/スマホアプリ
・全方位?
・クライアント/サーバモデル, WebSocketを使用
・ゲームセッションなし,いつでも参加/退出可
・最大100人ぐらい同時参加

弾幕を多数出して100人ぐらい同時参加で遊べるゲーム

[方針]
とりあえずさっと動くものを作り実現性を検討したい。
・5~10人ぐらい参加可能なゲーム。
・開発速度重視。各部最適化しない。簡潔でコンパクトなコードをさっと書く。

多人数対戦弾幕がゲームとして成り立つのか?
ラグで操作が遅れそうだけれで細かい弾避けができるのか?
スマホでの操作どうする？
などが懸案事項。

(1)Typescriptでクライアントのみで完結するスタンドアロンのゲームを作る。
(2)ゲームコアロジックを抽出しTypescript/node.jsでゲームサーバを作る。Typescriptでクライアントを作る。
小規模プロトタイプ、開発速度優先で進めてをこれを1~2カ月程度でどうにかまとめたい。

ゲームを新しく作り始めた。
開発の進捗状況を把握するために作業の成果を載せていきたい。
現状ローカルマシンでメモ帳やマークダウンエディタで進行状況を管理しているのだけれど、どの程度作業が進んでいるかがわかりにくいので、Web上に日付と作業内容、スクリーンショットや実際に動くプログラムを残していき進行状況を把握できるようにしたい。

まずはメモ帳から内容を抽出してこれまでの開発状況を確認する。

テストです。

テストです。

開発環境をReact+Typescript+Webpackに換えました。
これまではUI部分はRiot.jsで、図形の描画はCanvasの描画APIを使っていましたが、図形の表示をSVGをDOM内に直接埋め込む方式に切り替えました。おそらくRiotでも同じことができるとは思いますが、Reactの仮想DOMでSVGを扱う例が多数あり、それらの影響を受けました。

点/辺/面を入力して移動するなどの編集操作をSVG直接表示の実装でできることがわかりました。またundo/redoも実装しました。これをベースにベクターイラストエディタを作るには、
1.最低限通常のドローソフトの編集機能がこの設計で作れることを確認
2.パスをスプライン曲線で編集するなど、polylerの独自の機能を実装
が今後必要です。２が難しくて、研究的な要素が多いため実装がなかなか進まないことが今までの開発過程からわかっています。そこで、まず、１の普通のドローソフトに近いものを一旦作ってみようと思います。

ブラウザ上で動く簡単なベクター形状エディタを作ろうとしています。
ある程度作る–>一から作り直す、というのを繰り返しています。
開発環境はTypescriptとRiot.js,Webpackです。
描画はCanvasを使っています。
バグが多く安定して動作するものがまだできていません。
複雑なイラストを描いていると途中でクラッシュしてしまい、うまく描けません・・・