Born Neet
- The Emotional Programmer -
| Next Entry … j | Prev Entry … k |
| Next Page … J(Shift + j) | Prev Page … K(Shift + k) |
| Scroll Down … Space / Page Down | |
| Scroll Up … Shift + Space / Page Up | |
なんかエンジニアの間では常識だと聞いたので。
別にプレゼンする機会はないけど。(あってもパワポ / Impress限定だし…)
なんだかんだ(後述)でできたのがこれ。
(まぁHTMLをスライドっぽく見せてるだけのプログラムですが)
(x)html2presen
(Firefox推奨。IEでも動きますがとてつもなく重いです。FFでもかなり重いけど;)
サンプルとして2つのプレゼンを置いてます。
(ツールの使い方をそのツール自体で説明するという暴挙)
[開発記(?)]
今回は他人のソースを見ないで作ることを目標にした。
車輪の再生産ってやつなんだろうけど、一旦自分で作ってみた方が勉強になるので。
(とはいっても完全に一からは面倒なのでjQuery使った。そろそろ自分用のbasicライブラリ作らないといけないなぁ…)
で、実際作ってみると、予想より難しくてかなり苦労した。
基本的な部分はすぐにできたんだけど…
なんとなく付けてみた落書き機能に超苦戦。
最終的にcanvas要素(+ExplorerCanvas)でやることにした。
(大量のspan要素を生成する方法もやってみたけど、重すぎて却下)
canvasを弄るのは初めてで全くわからず、結局ネット上のいろんな情報に頼ることに。
でもソースの流用とかはしなかった、頑張った!(って普通か)
以上。
一通り動くようにはできたし(まだまだバグ・機能不足はあるけど)、
amachangさんのツールでも見て勉強するかな。
[参考記事]
- Canvas - HTML5.JP
このサイトがなかったら完成しなかった。感謝! - Taken SPC : いい加減な canvas 要素の紹介
こちらのサイトにもお世話になりました。 - ブラウザ上でお絵かき: Days on the Moon
本当はこれぐらい軽快に動作させたかった!
(ライブラリ使わせてもらおうかなぁ…)
先日公開した作詞スルは、デフォルトでプロジェクト杉田玄白の不思議の国のアリスを読み込んでました。
そのため、他のテキストをもとに作詞したい人は、毎回隠しメニューの「真っ白に」ボタンを押さないといけないという面倒な仕様になってました。
サーバの負荷的にもそれはよろしくないよなぁ…ということで、初期状態では何もしないのも作りました。
それが、作詞シナイです。
いや、作詞はするんですけどね、もう名前とかどうでも…。
あと、サンプルをもう一つ作りました。
前回のサンプルは、僕が作詞スルからコピペして作ったんですが、今回のは動的に何個か詩を作るようにしました。
…ん!?
これ作詞スルいらなくなってない?
今回のサンプルの方が何曲も同時に見れるし。
いやいや、アリス+別のテキストで作る時には便利…作詞シナイでも出来る;
まぁいいか!
(なんかサンプル2が「アルバム作る」みたいになっちゃった気はするけど…)
ちょうどVOCALOID2:鏡音リン・レンも出たことですし、
どうぞ使ってやって下さいm(_ _)m
※ FlMML& JSMMLなんて面白そうなものを見つけたので、
自動作曲(?)にも挑戦しようとしたんだけど…
文字数にあわせてランダムに音並べるだけってのはちょっと無理があった。
ただの雑音に;
ってことで、その過程で作った作詞シナイだけでも公開しておこうというわけです。
(ホントは作詞する自体をイジっていい感じにすべきなんだろうけど、それは面倒いので!)
ふぅ、これ系はちょっと飽きてきたので当分放置すると思います。
さて、次は何をしようかな~?
[長文注意]
前々から人口無能とかに興味はあったんだけど、
+最近流行りの圧縮新聞に触発されて
僕もJavaScriptでAIっていうかボットなサイトを作ってみた↓
作詞スル
はいはい、ネーミングセンス0ですよ、わかってますよ。
その名の通り、歌詞っぽい文字列を生成します。
作った歌詞を並べたらこんなんできました。
人口無能のシュールさ全快です!?
VOCALOID2:初音ミクとかのお供にどうですか?
(実は昨日初めて聞いた、そのためにニコニコにも今さら(!)入ったり。思ったよりぽくてびっくり。すげーな、YAMAHA…だよなエンジン作ってるの。)
[使い方]
は、ロゴをクリックするだけの、ワンクリックアプリケーション(?)です。
あと、下の方に隠し(てないけど)メニューがあって、「タグにする」ボタンで歌詞のHTMLを表示できます。
他のメニューは、correct.jsサンプルの時と同じくドーピング用で、他のテキストを読ませたりできます。
(重いのとかヤパイのは読み込ませないでくださいね。)
[仕組み]
ソースを見てください…じゃああんまりなので、ちょっと説明します。
他のサイトでも良く使われてる形態素解析+マルコフ連鎖です、たぶん。
あんま理解できてないです、マルコフ連鎖 - Wikipedia(2007年12月27日 21:45:14)見て泣きそうになりました。
要は、文をバラバラに区切って、隣接する確率によって繋げていくっていう単純明快アルゴリズムです。(言い切った!)
サイトにもある通り、解析の正規表現は形態素解析もどきを改良してみた - エブログで紹介されてる方法をほぼそのままパクりました。
※ N-gramもちょっと試してみたら面白そうだったけど…いかんせん重いんです!
そして、Alice's Adventures in Wonderland: Japaneseから拝借した、不思議の国のアリスのテキストを読ませて(重いので1~6、7~12章で分けてランダムでどちらか)、そこから歌詞っぽいデータを作ってるわけです。
元がクリエイティブ・コモンズ(表示-継承)だから、機械的に作ったのもCCになる・・・のかなぁ?
もちろん、他のテキストだけを読み込んだ場合は関係ないけど。
以上、説明でした。
※ 今回は、ちゃんとOOPで作ろうと頑張った
…んだけどだんだん飽きてきて、HTMLを作るころにはもう適当2。
その場しのぎの応急処置を多発してしまう悪い癖が。
(結果ソースは僕以外が見ると意味不明な記述だらけに;)
それでもわりとおもしろいものができたんじゃないかと、自画自賛しなくちゃやってらんない!
ちなみに、これは自分の中で正式サービスと勝手に位置付けてるので、いつものゴミ箱じゃなく、サブドメイン(lyrics)を与えてみました。(のわりにはHTML&css適当すぎとか言わないで…)
[参考]
はじめてのAIプログラミング―C言語で作る人工知能と人工無能
この本がきっかけで、人口無能を面白いと思うようになった。
だいぶ前に読んだんだけど、今回改めて読み直した。やっぱ人口無能の会話は笑っちゃう。
ただ、最近LLっていうかJSばっかやってるからCを読むのがつらかった。本質じゃない文字列処理とかにてこずっちゃってもう…。
だいぶ前に公開したyahooとgoogleを交互に検索するbookmarklet、y←→g。
最近気づいたんだけど、特定の文字をyahooに投げた時に文字化けする。
例えば、「精度」とか。
原因はキーワードをUTF-8でエンコードしてたから。
JavaScriptのencodeURIComponentはそういう仕様だってのは知ってたんだけど…。
yahooはEUC-JPとUTF-8のどっちで投げてもいい感じに処理してくれると勝手に思ってた。
(実際多くのケースではそうしてくれるんだけどね)
他の文字コードとして解釈できちゃうような文字列の場合化けちゃうのかな?
ってことで、yahoo検索のURLに&ei=UTF-8を追加して無事に解決。
修正版を以下に置いておきます。
y←→g
ご面倒かと思いますが、差し替えをお願いしますm(_ _)m
※ userjsに同じようなのものがあると知ってちょっとショックを受けてたりします…。
(8倍速対応 | Google検索結果ページに同キーワードでYahoo!で検索するリンクを貼る-IE7pro+Yahoo! in Google)
あきらかにbookmarkletでやるよりスマートだなぁ。userjsおそるべし。








