siouxcitizen

混沌としてきたので投稿コードをまとめてみました
Naver : http://matome.naver.jp/odai/2142288467101177901

作業用BGMにYoutube動画を連続再生するプログラムもまとめてみました
直リンク : http://matome.naver.jp/odai/2143666226200730001
アーティスト別の再生動画の一覧付きリスト : http://matome.naver.jp/odai/2142630899820574901

旧ブログ : http://oretaikan.blog20.fc2.com
作りかけ新ブログ : http://oreorekaihatsu.blogspot.jp/

Works

CreateJS SpriteSheet キャラ / マップチップ表示

// forked from siouxcitizen's "CreateJS SpriteSheet マップがスクロールするように修正" http://jsdo.it/siouxcitizen/mOHt //Wonderflのこちらのコード、 //■ キャラ / マップチップ表示 http://wonderfl.net/c/y0cw?page=1 ■ //をどこまで再現できるか試してみました //いろいろ動き、背景等が微妙に違いますが。。。 //あと自分の開発PCではかなり処理が重いっす。。。 // //画面をクリックした後、 //キーボードの↑↓←→押下で勇者?画像が移動します。 // // //マップチップ、キャラチップいろいろと扱いムズいっす。。。 //そもそもチップのもとになる画像をまとめなかったせいもあるかと思いますが。 //いろいろごまかしたり、差し替えたり、プログラムひねったりで //なんとかここまでできました。。。 //特に家の繰り返しの壁描画のところでは相当ムリヤリなプログラムで //グラフィック描いています。。。 //背景チップは最初から16×16のピクセルで区切ったほうがよかったんかなぁ? // // // //チップ素材は以下のサイトからのものを使わせて頂きました //チップの利用規約等については以下サイトを確認下さい // //First Seed Material //http://www.tekepon.net/fsm/ //

  • 4659
  • 5

CreateJS>EaselJS P.17 タイムアタック機能追加

タイムアタック機能追加してみました。 といってもダンジョンでZボタン押しっぱなしにしていればクリアできてしまいます。。。 最初のスタート画面で僧侶の前でZボタンを押した場合メッセージが表示される機能も追加してみました。 今後はもうちょっとましなゲーム性となるように改良していきたいっす。 敵画像素材は以下のものを使わせて頂きました。  Party http://wonderfl.net/c/ixkn

  • 2539
  • 3

Atlas-x Practice09 クイズ結果をTwitterへ投稿する機能を追加

Twitterに投稿する機能を追加しました。 PCでは動いていますが、スマホ上ではどう動くのか確認してません(スマホ持ってないので。。。)。 参考サイト・コード: 超革命的スクリプト言語 アトラスXの使い方 #1 http://wise9.jp/archives/2135 超革命的ゲームスクリプト言語アトラスXの使い方 #2 フラグを使おう http://wise9.jp/archives/2187 超革命的ゲームスクリプト言語アトラスXの使い方 #3 Twitterと連携して256倍楽しくする http://wise9.jp/archives/2230 enchant.js+アトラスXでIT力判定クイズを作ってみる! http://wise9.jp/archives/2602 Category Archives: 連載:超革命的ゲームスクリプト言語アトラスXの使い方 http://wise9.jp/archives/category/%E9%80%A3%E8%BC%89%E8%B6%85%E9%9D%A9%E5%91%BD%E7%9A%84%E3%82%B2%E3%83%BC%E3%83%A0%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%97%E3%83%88%E8%A8%80%E8%AA%9E%E3%82%A2%E3%83%88%E3%83%A9%E3%82%B9x%E3%81%AE%E4%BD%BF //【Javascript】配列の順序のランダム入れ替え //http://www.softel.co.jp/blogs/tech/archives/2328 //乱数を使って配列をシャッフルする //http://www.pori2.net/js/number/5.html

  • 2372
  • 0

CreateJS EaselJS 0.6.1 前回コードから戦闘機能を改良

// forked from siouxcitizen's "CreateJS 0.6.1 前回コードから戦闘もどき機能追加" http://jsdo.it/siouxcitizen/1mJ8 自分のスマホから操作できるゲーム目指して。。。(自分のスマホでの動き怪しくなってきましたが。。。) 自分のスマホからだとAボタンが連打になってしまいやすい。。。 前回の [最初の画面から下に行った2画面目の「しかばね」と戦えるようにしてみました] の単純な戦闘機能に加えて、 敵に強さにレベルを複数用意した上で、倒したその敵からボーンをもらい、 集めたボーンから作る秘薬で勇者をレベルアップというシステムを追加してみました。 テストとかパラメーターのバランス取りなんかはほとんどやってません。。。 バグ多いかも 決定ボタン→仮想キーのAボタン、またはキーボードのZボタン Bボタン→仮想キーのBボタン、またはキーボードのBボタン→勇者キャラの移動スピード変更 1画面目 決定ボタンで僧侶に話しかけることができます 僧侶が説明的な感じでシステム説明します。。。 何もないところで決定ボタンを押すと勇者のステータスが表示されます 2画面目 決定ボタンで敵「しかばね」と戦闘できます 2画面目での勇者の場所が変わると出てくる「しかばね」のレベルも変化わります 「ボスしかばね」を倒すとゲーム終了となります 「しかばね」は強さのレベルによらず全て同じ画像です。。。 3画面目 決定ボタンで魔女に話しかけることができます ボーンが十分にあればボーンで秘薬を作成・使用して勇者のレベルアップができます 何もないところで決定ボタンを押すと勇者のステータスが表示されます ついでに、 指摘された反対になっていたAボタンとBボタンの位置を修正 CreateJSの0.61ではなくEaselJSの0.61であるようにタイトルを修正

  • 1252
  • 1

WebGLなしThree.jsサンプル3Dモデル表示 Female

// forked from siouxcitizen's "WebGLなしThree.jsサンプル3Dモデル表示" http://jsdo.it/siouxcitizen/tLnwl WebGL使用せずにThree.jsのサンプル3Dモデル表示してみました モデル使用に問題ありそうなら削除します Three.js r66 と Three.js r53 ではテクスチャのパス指定が変わる? Three.js r66 → "mapDiffuse" : "../../../../r/8/7/e/r87ea.jpg" Three.js r53 → "mapDiffuse" : "../../../../../r/8/7/e/r87ea.jpg" jsdo.itでThree.jsで3Dモデルを表示するために以下コードを参考にさせていただきました 自分でWebGLなしThree.jsの3Dモデル読み込み http://jsdo.it/kjunichi/ftPA WebGLありThree.jsの3Dモデル読み込み http://jsdo.it/kjunichi/i47H THREE.JSONLoaderのパスの調査 http://jsdo.it/kjunichi/s9b8

  • 2797
  • 2

WebGLなしThree.jsの3Dモデルアニメーションサンプル表示 Horse

// forked from siouxcitizen's "WebGLなしThree.jsサンプル3Dモデル表示 Female" http://jsdo.it/siouxcitizen/2nvo WebGL使用せずにアニメーションする、Three.jsのサンプル3Dモデルを表示してみました モデル使用に問題あるようなら削除します 以下サンプルコードを使用させていただきました http://threejs.org/examples/#canvas_morphtargets_horse view-source:http://threejs.org/examples/canvas_morphtargets_horse.html

  • 2924
  • 0

WebGLなしThree.jsサンプル3Dモデル表示 Buffalo

// forked from siouxcitizen's "Three.js r66 でWebGLなしテクスチャ付モデルを表示" http://jsdo.it/siouxcitizen/rkEN WebGL使用せずにThree.jsのサンプル3Dモデル表示してみました モデル使用に問題ありそうなら削除します Three.js r66 と Three.js r53 ではテクスチャのパス指定が変わる? Three.js r66 → "mapDiffuse" : "../../../../r/8/7/e/r87ea.jpg" Three.js r53 → "mapDiffuse" : "../../../../../r/8/7/e/r87ea.jpg" jsdo.itでThree.jsで3Dモデルを表示するために以下コードを参考にさせていただきました 自分でWebGLなしThree.jsの3Dモデル読み込み http://jsdo.it/kjunichi/ftPA WebGLありThree.jsの3Dモデル読み込み http://jsdo.it/kjunichi/i47H THREE.JSONLoaderのパスの調査 http://jsdo.it/kjunichi/s9b8

  • 2008
  • 1

Three.js r66 でWebGLなしテクスチャ付モデルを表示

// forked from siouxcitizen's "forked: THREE.JSONLoaderのパスの調査" http://jsdo.it/siouxcitizen/4RuK // forked from kjunichi's "THREE.JSONLoaderのパスの調査" http://jsdo.it/kjunichi/s9b8 // forked from kjunichi's "WebGLありThree.jsの3Dモデル読み込み" http://jsdo.it/kjunichi/i47H // forked from kjunichi's "自分でWebGLなしThree.jsの3Dモデル読み込み" http://jsdo.it/kjunichi/ftPA // forked from siouxcitizen's "失敗 自分でWebGLなしThree.jsの3Dモデル読み込み" http://jsdo.it/siouxcitizen/xAsG // forked from siouxcitizen's "Three.js Sample Test07" http://jsdo.it/siouxcitizen/8hdD Three.js r66でWebGL使用せずに3Dモデル表示してみました Three.js r66 と Three.js r53 ではテクスチャのパス指定が変わる? Three.js r66 → "mapDiffuse" : "../../../../r/8/7/e/r87ea.jpg" Three.js r53 → "mapDiffuse" : "../../../../../r/8/7/e/r87ea.jpg"

  • 1912
  • 0

修正Three.js Practice09 3D Earth

Dropboxに置いたテクスチャ用画像が読み込めなくなっていたので画像ファイルをjsdo.itに置き直してソースを修正しました。  あと、元々の画像サイズがjsdo.itに置くには大きすぎたので解像度も変更しました。 解像度変更に使用したのは「縮小専用。」というソフトです。 なぜかFirefoxでも見ることができるようになりました。。。

  • 3569
  • 7

Three.js Practice08 3D Model Load

  • 6158
  • 6

Three.js Practice07 Light

  • 5150
  • 2

修正Three.js Practice06 Texture on Cube

Dropboxに置いたテクスチャ用画像が読み込めなくなっていたので画像ファイルをjsco.itに置き直してソースを修正しました。

  • 1722
  • 0

修正Three.js Practice05 Texture on Plane

Dropboxに置いたテクスチャ用画像が読み込めなくなっていたので画像ファイルをjsco.itに置き直してソースを修正しました。

  • 1462
  • 0

Three.js Practice04 Cylinder

  • 4949
  • 0

Three.js Practice03 Plane

  • 4842
  • 0

Three.js Practice02 Sphere

  • 4271
  • 0

Three.js Practice01 Cube

  • 6054
  • 1

MagicaVoxelで勇者キャラクタを作成してAway3Dで表示

// forked from siouxcitizen's "Away3DでMagicaVoxelによる某配管工キャラクターを表示" http://jsdo.it/siouxcitizen/kYJEK MagicaVoxelで勇者風キャラクタ(自分基準)の3Dモデルを作成してAway3Dで表示してみました モデル作成にあたり "Away3DでMagicaVoxelのキャラクターサンプル表示その8" http://jsdo.it/siouxcitizen/pM7k のモデルをもとに "CreateJS EaselJS 0.6.1 前回コードから戦闘機能を改良" http://jsdo.it/siouxcitizen/cqW8 の勇者キャラ的なものを目指して作成してみました 剣ちょっと長すぎたかな~?

  • 1661
  • 0

Three.js r70 でOBJファイル形式3Dモデルを表示(WebGL使用)

// forked from siouxcitizen's "Three.js r70 でサンプル3DモデルFemaleを表示(WebGL使用)" http://jsdo.it/siouxcitizen/7mPx Three.js r70 でOBJファイル形式3Dモデルを表示 OBJファイル形式の3Dモデルを表示してみました  以下サイト・コードを参考にさせていただきました Three.js + Oimo.js で箱に色々入れてみるテスト http://jsdo.it/cx20/olho three.js / examples → webgl → loader / obj http://threejs.org/examples/#webgl_loader_obj view-source:http://threejs.org/examples/webgl_loader_obj.html MagicaVoxelで勇者キャラクタを作成してAway3Dで表示 (参考にした自分のコードです) http://jsdo.it/siouxcitizen/mvkT

  • 2743
  • 0

Three.js r70(WebGL使用) 3Dモデルにマウスクリックイベントを追加2

// forked from siouxcitizen's "Three.js r70(WebGL使用) 3Dモデルにマウスクリックイベントを追加" http://jsdo.it/siouxcitizen/rrPcp 3Dモデルのマウスクリックイベントを追加その2 前回のコードから、 勇者3Dモデル以外の3Dモデルについてもマウスクリックイベントを追加してみました 3Dモデルごとのイベントの振り分けを、動けばいいや方式でテキトーに実装したので そのへん怪しいかもしれません 操作方法: 青ボタンで勇者キャラ左まわりにカメラが移動 赤ボタンで勇者キャラ右まわりにカメラが移動 黄色ボタンでカメラの距離を変更 緑ボタンでカメラの高さを変更 紫ボタンでカメラを元の位置へ移動 勇者3Dモデル、村長3Dモデル、マップ(マップ用Plane)、をクリックでメッセージが表示されます 引き続き以下のコード・サイトを参考にさせていただきました Three.js でピッキング(3Dモデルをマウスで選択)してみた http://tmlife.net/programming/javascript/threejs-picking.html Three.js 3Dモデルをマウスでクリック(ピッキング処理) http://gupuru.hatenablog.jp/entry/2013/12/02/190413 多彩な表現力のWebGLを扱いやすくする「Three.js」 (5/5) http://www.atmarkit.co.jp/ait/articles/1210/04/news142_5.html JavaScript 3DレンダリングエンジンのThree.jsを試す http://kray.jp/blog/three-js/ 公式サイト?のサンプルも参考にしました view-source:http://threejs.org/examples/webgl_interactive_cubes.html

  • 4924
  • 0

Three.jsとvox.js でMagicaVoxelで作成した「勇者」を表示してみるテスト

// forked from siouxcitizen's "forked: vox.js を試してみるテスト" http://jsdo.it/siouxcitizen/oQid // forked from cx20's "vox.js を試してみるテスト" http://jsdo.it/cx20/u80n // forked from ohisama1's "vox.js test 0" http://jsdo.it/ohisama1/e9dm 参考にした昔作成した自分のコード Three.js r70 でOBJファイル形式3Dモデルを表示(WebGL使用) http://jsdo.it/siouxcitizen/8alk

  • 1127
  • 0

Three.jsとvox.js でMagicaVoxel作成3Dモデル複数表示

// forked from siouxcitizen's "Three.jsとvox.js でMagicaVoxel作成「しかばね」による「しかばね」ヒエラルキー表示" http://jsdo.it/siouxcitizen/q7bk // forked from siouxcitizen's "vox.js でMagicaVoxelで作成した「しかばね」を表示してみるテスト" http://jsdo.it/siouxcitizen/YjO6 // forked from siouxcitizen's "vox.js でMagicaVoxelで作成した「魔法使い(青髪)」を表示してみるテスト" http://jsdo.it/siouxcitizen/gRwG // forked from siouxcitizen's "vox.js でMagicaVoxelで作成した「魔法使い(赤髪)」を表示してみるテスト" http://jsdo.it/siouxcitizen/Szdn // forked from siouxcitizen's "vox.js でMagicaVoxelで作成した「僧侶」を表示してみるテスト" http://jsdo.it/siouxcitizen/I0vf // forked from siouxcitizen's "vox.js でMagicaVoxelで作成した「勇者」を表示してみるテスト" http://jsdo.it/siouxcitizen/KnAG MagicaVoxel作成の3Dモデルをいろいろ表示してみました 参考にした昔作成した自分のコード forked: vox.js を試してみるテスト http://jsdo.it/siouxcitizen/oQid Three.jsとvox.js でMagicaVoxelで作成した「勇者」を表示してみるテスト http://jsdo.it/siouxcitizen/KnAG Three.jsとvox.js でMagicaVoxelで作成した「僧侶」を表示してみるテスト http://jsdo.it/siouxcitizen/I0vf Three.jsとvox.js でMagicaVoxelで作成した「魔法使い(赤髪)」を表示してみるテスト http://jsdo.it/siouxcitizen/Szdn Three.jsとvox.js でMagicaVoxelで作成した「魔法使い(青髪)」を表示してみるテスト http://jsdo.it/siouxcitizen/gRwG Three.jsとvox.js でMagicaVoxelで作成した「魔法使い(黄色髪)」を表示してみるテスト http://jsdo.it/siouxcitizen/SPjs Three.jsとvox.js でMagicaVoxelに「ひよこ」もどきを表示してみるテスト http://jsdo.it/siouxcitizen/CSO2

  • 616
  • 0

Three.js + Oimo.js で勇者・僧侶・魔法使いキャラ候補を箱に入れてみるテスト

// forked from cx20's "Three.js + Oimo.js で箱に色々入れてみるテスト" http://jsdo.it/cx20/olho // forked from cx20's "Three.js + Oimo.js で箱にボールを入れてみるテスト(その2)" http://jsdo.it/cx20/7cp5 // forked from cx20's "Three.js + Oimo.js で箱にボールを入れてみるテスト" http://jsdo.it/cx20/sOaG // forked from cx20's "Three.js + Oimo.js で坂道にボールを転がしてみるテスト" http://jsdo.it/cx20/8ECT // forked from Lo-Th's "Oimo.js Moving" http://lo-th.github.io/Oimo.js/test_moving.html こちら Three.js + Oimo.js で箱に色々入れてみるテスト http://jsdo.it/cx20/olho をもとに 自分の作成したOBJファイルによる3Dモデルを表示してみました 3Dモデルは以下コードで使用したOBJファイルを使いまわしたものです MagicaVoxelで勇者キャラクタを作成してAway3Dで表示 http://jsdo.it/siouxcitizen/mvkT Away3DでMagicaVoxelで作成した魔女キャラクタ候補その3を表示 http://jsdo.it/siouxcitizen/ot5N Away3DでMagicaVoxelで作成した僧侶キャラクタ候補を表示 http://jsdo.it/siouxcitizen/yemJ 作業中なぜだかわかりませんが、 バラバラと3Dモデルがこぼれ落ちてくる様子が 楽しく感じられるようになってきました なんだろ?

  • 2070
  • 5

Three.js で Happy RPG風キャラーズ! 2015 (with 複数RPG風キャラ達)

// forked from siouxcitizen's "Three.js で Happy Halloween! 2015 (with Colorful Pumpkins)" http://jsdo.it/siouxcitizen/knDk 要WebGL うまく3Dモデルを読み込めない場合は「Reload」すれば読み込めるかもしれないです 以下の自分のコードを参考にしました Three.js + Oimo.js で勇者・僧侶・魔法使いキャラ候補を箱に入れてみるテスト http://jsdo.it/siouxcitizen/tSQ0 Three.js で Happy Halloween! 2015 (with Colorful Pumpkins) http://jsdo.it/siouxcitizen/knDk Three.js で Happy じいちゃん! 2015 (with じいちゃん) http://jsdo.it/siouxcitizen/2ljB

  • 808
  • 0

Three.js で Happy 配管工ズ! 2015 (with 複数配管工キャラ達)

// forked from siouxcitizen's "Three.js で Happy スケルトンズ! 2015 (with 複数ほねキャラ達)" http://jsdo.it/siouxcitizen/mmCE // forked from siouxcitizen's "Three.js で Happy RPG風キャラーズ! 2015 (with 複数RPG風キャラ達)" http://jsdo.it/siouxcitizen/g63v // forked from siouxcitizen's "Three.js で Happy Halloween! 2015 (with Colorful Pumpkins)" http://jsdo.it/siouxcitizen/knDk 要WebGL うまく3Dモデルを読み込めない場合は「Reload」すれば読み込めるかもしれないです 以下の自分のコードを参考にしました Three.js + Oimo.js で箱に色々追加で入れてみるテスト http://jsdo.it/siouxcitizen/pZKm

  • 1181
  • 2

前回コードよりカメラ視点移動ボタンとサウンドON/OFFボタンを追加してみました

// forked from siouxcitizen's "前回コードよりHTML5のAudio機能による再生サウンドを追加" http://jsdo.it/siouxcitizen/UwtE 前回のコードに、 カメラの視点移動ボタンとサウンドON/OFFボタンを追加してみました Win7PCのFirefox41.0.1では音の再生できました 画面左上の「○」ボタン押下でカメラ視点操作用ボタンの表示・非表示を切り替えられます カメラ視点操作用ボタンは 「左」ボタンが勇者を中心にカメラを左まわりで回転させるものです 「右」ボタンが勇者を中心にカメラを右まわりで回転させるものです 「上」ボタンがカメラ視点を高くしていくものです(一番高い視点からさらにボタン押下で一番低い視点になります) 「距」ボタンで勇者からのカメラの距離を変更します 「元」ボタンでカメラを初期位置にもどします 画面右上の「♪」ボタンでBGMやSE音といったサウンドのON/OFFを切り替えます 「いどう」ボタン押下ででてくる「僧侶子」「魔女子」「しかばね」「遺跡」ボタンを押下すれば それぞれの画面へ遷移できます。 「たたかう」ボタンは「しかばね」画面で試せます あと画面をクリック&ドラッグで3Dの視点が変化します 以下の自分作成のコードを参考にしました Three.js r70(WebGL使用) でCreateJSもつかってインターフェースまわりを修正 http://jsdo.it/siouxcitizen/kVxe 音楽:魔王魂 MP3ファイルとOGGファイルは以下サイトからのファイルを使用させていただきました 魔王魂 http://maoudamashii.jokersounds.com/

  • 733
  • 0

Skills

Hot tags

Categories

HTML / CSS / JavaScript