GYAOS!のバトルシーンの演出

HTML5

SPEC | Flash、JavaScript、HTML、CSSクリエイターの採用試験 - wonderfl build flash online

モンスターを捕まえて、育て、戦わせるゲーム『GYAOS!（ギャオス）』の
バトルシーンの演出方法を追求してください。

にチャレンジ。


forked from: GYAOS_sample - jsdo.it - Share JavaScript, HTML5 and CSS

スクラッチの様にマウスで擦ると攻撃できる。

ただ闇雲に擦ってるだけじゃ面白くないのでAttackゲージを設けて制限を掛けたり、マウスの移動量やモンスターのDeffenceゲージによって与えるダメージが変わる様にしたけど、今回は演出面だからあんま関係ないかも。

バトルシーンの演出としてはパーティクルに始まり、パーティクルに終わる的な感じかと。

Pythonでスクレイピングしたい

Python

例えば、SJISのサイトをスクレイピングして、UTF-8で出力とか文字コード周りが全然分かってなくてハマった。

どうもPython内部ではUnicodeで処理してるので、一旦Unicodeに変換(decode)してから、UTF-8に変換(encode)するという事らしい。

UnicodeとUTF-8を一緒にしてた事がマズかったと。

#!/usr/local/bin/python
# -*- coding: utf-8 -*-

import urllib2

url = "http://hoge.hoge"
contents = urllib2.urlopen(url, "rb").read().decode("shift_jis").encode("utf-8")

なるほどなぁ。

Favicon Makerなサービスを作成中

Favicom

先日の(Fav)icon Makerが割と高評価頂けたので、ちょっとしたサービス化に向けて作り込んでる。

http://favicom.good-morning-world.com/

jsdoit版からは機能面がガラリ。

パレットがデカくなったり、選択範囲の移動・塗りや、色抽出、そして共有など・・・。

サーバ側は一先ずPHPで。

まだPythonは書けるレベルまで行ってないので余裕見て追々かしら。

jsのコードがちょっとした量になってきたので、メンテとか大変そうだ。。

物好きな方がいらっしゃったら、ご利用頂ければこれ幸い。

CBCNET ( http://www.cbc-net.com/ ) のRSSFeedを利用して、CBCNETのトップページをリニューアル

HTML5

JAM - HTML5 and Flash

Session5「CBCNET ( http://www.cbc-net.com/ ) のRSSFeedを利用して、CBCNETのトップページをリニューアルしてください。」

との事で、HTML5でマークアップ。


forked from: CBC NET - jsdo.it - Share JavaScript, HTML5 and CSS

始めは22面体とか突拍子のない事考えてたんだけど、結果的にはこんな感じに。

記事写真にマウスオーバーすると内容レイヤーが表示される仕組みで、その表示にCSS3のtransitionを使用してみた。

その対比というか、記事スライドは横方向にしている。

横スライドはjsでabsolute座標を変更してるんだけど、Operaがどうもカクカクでjsが速いんだか何だか。

カテゴリ、タグ、月別アーカイブのリンクには、Ajaxでもブラウザの「戻る」「進む」を有効にさせるべく、jQuery hashchange eventを使用。


(参考)
・Ajaxやタブ切替には必須かも？ブラウザの「戻る」「進む」を有効にするjQueryのhashchangeプラグイン


ロゴ画像が四角い事もあり、全体的に四角なデザインを心掛けてみた。

(Fav)icon Maker

HTML5

JavaScriptで動的アイコン生成。

Dotshopをforkして追加しようかと思ったけど、HTML5ぽくCanvas使って作ってみた。


(Fav)icon Maker - jsdo.it - Share JavaScript, HTML5 and CSS


フォーマット仕様に関しては、

・ICO(CUR) ファイルフォーマット

を参考にさせて頂いた。


もうちょい煮詰めてみようかなぁとぼんやり思ってる。

JAM - HTML5 and Flash にてSilver受賞(2回目)。

HTML5

JAM - HTML5 and Flash

Session4「視覚的にも楽しめる楽器アプリをつくってください」

にてSilverを受賞(2回目)。

これは逆に悔ｓ(ry

「フォークもう一本」と言った側からありがとうございます。

今回ばかりはOperaとFirefoxしか確認できなくてどうかなと思ってたけど、結局js側はプログラムで波形作って鳴らしてた作品が賞を取ってたんで、狙いは間違ってなかったかなと。

次は王道(？)のWebサイト制作なんで、かなり凝ったデザインが見れそうかなと期待＆自分も上を目指してこうと思ってたり。