HOKYPOKY.BLOG

HTMLコーダーがWonderflで始めるFlash生活

HTMLコーダーとして普段はHTMLサイトを構築しているみなさん、こんにちは。

ボクも普段はHTML/CSS/JavaScriptを使ってサイトを構築しています。
でもFlashもやりたい！なんて人は多いのではないでしょうか。実際にボクがそうです。

簡単にいってしまえば「やりたいならやればいいじゃない」ということですが以下のような壁があるかと思われます。

Flashを始めるにあたっての壁

  1. HTMLとFlashの概念の違い。
  2. Flashもってない、高い。
  3. ソースが見れない。
  4. 仲間がいない。教えてくれる人がいない。

まあ確かにこの気持ちは分かります。

1は、全く新しいスキルにチャレンジするとなるとちょっと勇気がいりますよね。
特に2と3に関して言えば、HTMLサイトとは大きく異なりますよね。 HTMLなんてとにかくエディタさえあれば始められるし。AdobeサイトにてFlex SDKが無料で配布されていますが、設置とかなんとかで敷居が高い。しかもコマンドライン上でコンパイルするとかなんとかで結構めんどくさいんですよね。
4は人によってはいるかもしれませんが、なかなか孤独な戦いというのはつらい・・・

そこで今回紹介するのは面白法人KAYACによるサイト上でFlashをつくることのできるサービス「 wonderfl」です。

「サイト上でFlashをつくることのできるサービス」とありますが、これがホントにすごい。
先にいうと、上の４つの懸念は全て吹き飛びます。

wonderflが凄いところ

  1. MXMLに対応している
  2. 無料
  3. ソースがみえる
  4. Fork, Favoriteなどでつながるコミュニケーション

実はこの4つが上に書いた壁を全てとっぱらってくれます。
では、一つ一つ説明。

1. MXMLに対応している

実は最近のFlashは単にFlashといっても、従来のFlashとは別にFlexというものも存在します。
Flexというのはソフトウェアの名前なので的確ではありませんが、実際にはmxmlという規格が作られました。

MXMLというのはxmlベースのマークアップ言語でFlash版HTMLだとイメージしてください。
要素をMXMLで記述して、ActionScriptで制御する。これって実はXHTML+JavaScriptと関係似てませんか？

そう、今までやっていたXHTML+JavaScriptが単にMXML+ActionScriptに置き換わったと考えればいいのです。

MXMLもXHTMLも元をたどればXML。JavaScriptもActionScriptも元をたどればECMAScriptとなっていて似ているどころか兄弟！と言った感じでしょうか。
実際にソースを見てもらえると分かりやすいかと思います。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
    <![CDATA[
        private function helloWorld():void
        {
            myMsg.text = "Hello World!";
        }
    ]]>
    </mx:Script>
    <mx:TextArea id="myMsg" />
    <mx:Button id="myButton" label="Click!" click="helloWorld()" />
</mx:Application>

これで結果は

となります。(Wonderflのブログパーツです)

もはやHTML過ぎてFlashやってる感じがしませんね。
そう、いままでの経験や知識がそのまま引き継がれる！これはかなり敷居が下がったのではないでしょうか。

嬉しい事にWonderflは最近mxmlをコンパイルしてくれるようになりました。

無料

このサービスは無料です。しかもアカウントがOpenIDでつくれるのでとっても簡単。
さまざまなOpenIDに対応しています。とても親切。すぐに始められます！！

ソースがみれる

ボクのページで申し訳ないのですがこのようにソースをみることができます。

これからActionScriptを勉強しようとしている人にとってこのソースがどれだけ手助けしてくれることか！

トップページからは人気のコードや、人気のユーザーが表示されているのでとりあえずソースを見る事から始めることもできます。

さらに検索機能がうれしくて、例えば本を読みながらこの関数を使った例なんかをみてみたいなーなんてときにもサンプルコードがいっぱい出てきます。

colorMatrixFilterを使った例

4. Fork, Favoriteなどでつながるコミュニケーション

WorderflにはForkというものがあります。これはTumblrのReblogと似ていますね。
ソースを継承して改変する事ができます。

ニコニコテレビちゃんを描いてみた
http://wonderfl.kayac.com/code/e0729bcbc67c0d6e4624124d8e8a84d85e282d68

ニコニコテレビちゃんを動かしてみた forked from ニコニコテレビちゃんを描いてみた
http://wonderfl.kayac.com/code/480459c0d307fceff61b3cfc66ddf90d2e8e9dd7

やこのような例も。

とにかく作ったものをUPするとそれがコミュニケーションとして動き出す！
誰かが作ったものをForkしてもいいし、Forkを募集しても面白いかもしれません。

また、自分のお気に入りのFlasherやコードを見つけたらFavoriteするのもいいでしょう。
自分のwonderflのFeedにFavoriteした人やコードの最新情報が更新されるので便利です。
自分のコードをForkされたりFavoriteされてる場合もFeedに情報が出てきますので、誰かが自分のコードを気に入ってくれたりするのも楽しみですね。あとはTwitterなどを公開している場合はfollowしてみるのも良いのではないでしょうか。

まとめ

HTML+JavaScriptがMXML+ActionScriptと似ているということ。
Wonderflを使えばすぐに始められる事、そしてコミュニケーションも生まれるということを紹介させてもらいました。

実際ボクがこれから始めようかと思っているところなんで、今から一緒にやろうよ！と思ってくれる仲間募集です！w
@HOKYPOKYやwonderflのボクのページなど超WELCOME！！

かわいい

so cute ♥
まぁ有名なやつだ。

最近空回り感がすごくて、本気でうまくいってないなー。
正直言って無理して楽しく振る舞ったりもしてる気がする。

ふとしたときに、ハァって思うのならよくあったことだし単純に疲れてるだけなんだけど。 

こういう状態を直す方法を知っているのが幸いで、とにかくインプットを増やせば良いんだよね。
ボクの場合は。思考が多くなる時期は、アイデアが枯渇してる証拠。 

本を10冊くらい一気に読んだり、映画を10本くらい一気に観たり、ただ起きたら寝るまでゲームしたり。

そうすると頭のなかにあるアイデア水が溜まっていって、ふとした瞬間溢れ出る。

あとは情熱だな。情熱。ジョーネツ。

高次元言語に向かう日本語

言語に対しての話なのに、あまりうまくまとまってない自分に愕然。

先にいっておくと、これはボクは日本語が好きだということ。
そしてその進化がとても興味深い。といった話。

プログラムをするようになって、様々な言語スタイルがあることがわかった。

高次元言語、低次元言語といった分類がある。
高次元になればなるほど人間にわかりやすい直感的なもの、低次元になればなるほどコンピュータに近い言語ということになる。
良くわからないけど、PHPはCでできているらしい。とかそんな話。
ま、ちょっと勘違いもあるけど、大体そういう風に思っても良い。
例としてアセンブリは低次元で、JavaScriptは高次元。Cは低次元寄りとかそんなイメージ。

最近の日本語の流れというか古くから日本語というものは簡単に簡単になってきていると思う。例えばひらがなができたり、最近のケータイ小説(笑)だったり、これらはプログラムでいうところの高次元言語に向かっていると考えている。

空気を読む。コレに対して嫌な気持ちを抱く人もいると思うが、ボクは凄いと思う。
たとえばプログラムでいうところの型指定のない言語。なくても動くという言語。
コレと似ている。大体わかるだろ。の世界。

他にも日本語のすばらしい例。
２年くらい前のANAのキャッチコピーに「マッタリ〜ナ、ホッコリ〜ナ沖縄」といったものがあった。これって実は初めて聞く言葉だけどこのキャッチコピーがいわんとしていることがわかる。知らない語彙がでてきても何となく言わんとしていることがわかる。日本語は元から擬音語などが秀逸だとも思う。

さて、日本語がだんだんゆるく、高次言語化に向かっていることはなんとなく分かってもらえたと思うが、結局何がいいたかったのかという話になると、それを許してあげてもいいんじゃないかなということ。若者の言語感覚というものはあなどれないということ。
高次元言語と低次元言語どちらがすばらしいかなんてくだらない議論をしているわけではない。
日本語が高次元言語に向かっているという事、特に若者はそれらを求めてきているという事だ。
「それでも伝わる言語」より直感的になってきているので、論理ではなく感覚で伝わる言語。これが最終的にどのように進化していくのかはボクとしては楽しみだ。
とにかく「日本語がすばらしい」と聞くと例えば「鈍色」などに代表される日本語の繊細な色彩感覚だったりするところをフィーチャーされがちだが、そもそも感覚というものを言語にするのが得意なんじゃないかな。

最後にボクの注目する日本語の未来。

  • 外来語の受け止め方。そのうち単語だけじゃなくて、Mixin的に一塊の文章も交えてくるのではないかと。
  • 擬音語の進化。ゆるふわ。とか。
  • 代名詞の使い方。あれそれこれどれの進化。
  • 顔文字、ギャル文字などの文字の進化。

しかし、まとまらないなー。
自分の言語能力の低さに愕然。だれかこれを秀逸に書き直してほしい。

ググった数よりググられたい。

この仕事を初めて3年半がすぎ、何も知らなかった自分がまぁまぁそれなりに色々知って来れたのは情報を掘り続ける姿勢があったからだとは思っている。
もちろん、跡を残してくれた先人に感謝しつつ。

そして去年の夏にふと思った。

ググった数よりググられたい。

これは自分が今までお世話になった人たちへの恩返しでもあり、自分の形のない存在証明なのかな、なんて。

天気がよかった。
ただそれだけでなんか救われる気がするボクは、やり場のない長いトンネルの中にいるのかもしれない。

そう、視界は外へ。みんなから見えるところへ。
今日の空は地球の径よりも遥かに遠くまで見渡せたのだから。

verse

form : 形
uni-form : 制服 (単一の形)

ふむふむ。じゃあ次。

verse : 詩
uni-verse : 宇宙、銀河

こ、これは・・・

どうも、ブロガーです。

弟のブログが面白かったんでボクもブロガーになろうと思いました。

ずっと一緒に遊んでた弟なんだけど、どうしてこうも趣味の違う人にそだったか不思議です。

父親からはハワイにいるぜ！なんてハイテンションなメールが来る。
素直に羨ましいです。

母親はとりあえず機械音痴なのでメールの件名に全ての文章を入れてきます。本文は空。

そんな今井家です。意味はありません。

今日は実はルームシェアを始めて1年がたつ記念すべき一日でした。
すげー。契約切れるまであと1年。今年はなにか成し遂げたい。

Railsで初めてアプリケーションを作ってみた。

社内プロジェクトですが、サーバーサイドの知識ほとんどないボクがRuby on Railsを使ってWEBアプリケーションを構築してみた。

内容として一日の行動記録。要は日報アプリケーション。
一日のタスクとそれに費やした時間を記録。
さらに個々のdeliciousアカウントをAPIを使って読み取り、共有したいブックマークを会社のdeliciousにRepostすることができるブックマーク共有機能。
一日の感想コメントと、メッセージチェーン機能(一つ前に日報を書いた人の言葉がみれる。次の日報を送る人に一言コメントが送れる)があり、
それらを送信すると社内の日報としてメールが送信され、アーカイブを閲覧、ダウンロードできるといったものだ。

Ruby on Railsを選んだ理由

ボクは今までHTML, CSS, JavaScriptを中心にやってきたんだけど、これらはどうにも限界があった。
つまりボクの考えるWEBというものとは実は無縁の技術だったのだ。それはFlashも同じ。

端的にボクの見ているWEBにサーバーサイドがないとどれだけつまらないものになるかということだ。
mixiやYouTube、Twitter、はてな、このブログもそう。Google検索ももちろんサーバーサイドが提供してくれた。

そこでサーバーサイドをやろうと思う訳だが、JavaScriptしかプログラムのわからないボクにとってPHPはとても壁が高かった。
それこそちょこっとした１アクションくらいならPHPでなんとかする事はできるけどアプリケーションを構築するとなると、ホントお手上げ状態。

そこでフレームワークという言葉に出会う。そしてそれがRuby On Railsだったというわけ。

Ruby on Railsの壁

まずRuby on Railsの壁としてRubyという言語がある。
ドキュメントが少ない。さらに動くサーバーがない。
Rubyが動けばいいかというとそういうわけではなく、このフレームワークは敷居が高い。

ドキュメントに関しては、まずはてブのrailsタグを購読することにしたのと、本を数冊購入した。

中でも最初のRails of Ruby on Railsは良書だった。とにかくRailsに触れる・作るということに徹底していて、よくわからないけどRailsすごい！って気分にしてくれる。
ごちゃごちゃした説明はほとんど省いていて、写真や図をふんだんに使いとにかく楽しい。
初めてのフレームワークということもあり、それらの概要を感覚的につかむのにはとても良かった。それこそ一日でそのままソースを書いていけばブログができてしまった。
Rails体験ツアーって感じです。

次は「たのしい Ruby」「Rubyレシピブック」「Railsレシピブック」シリーズ。ボクのRails三原色。
楽しいRubyはRubyの文法などを知る事ができた。要はオブジェクト指向のドットシンタックスだということでJavaScriptできると似ている部分も多くためになった。
さらにRailsレシピブックはぼろぼろになるまで読んだ。ドッグイヤーしまくり。

サーバーは最終的にPassengerを使う事にした。理由は簡単だからだ。
mod_railsと言われるだけあって、PassengerをサーバーにインストールするだけでRailsの環境を構築できる。
本格的に構築するとなるとlighttpdを使った方がいいみたいですね。でもここに時間をかけるのだけは避けたかった。

社内プロジェクトなのでMac G4にPassengerを入れて運用することにした。
また、このHOKYPOKY.は海外のDreamHostを借りた。
国内でサービスとして運用したい場合はラピッドサイトのVPSなどを借りるのが良さそうだった。

SQLite

Railsとは少し話がそれてしまうんだけれども、SQLiteというデータベースにも惚れた。
それこそ大規模になってきたらいろんな知識が必要になってくるとは思うのだけれど、SQLiteの手軽さといったらない。
DBを作成しなくていいとか、ファイルをコピーすればそのままデータもコピーされるとかほんとにすばらしい。
とにかくポータブルであることと、DBがどうなっているかみるのに凄く役にたった。
そしてFirefoxのアドオン、SQLite Managerにはお世話になりました。

流行

流行というものの力にもお世話になった。要はRuby on Railsはホットなのだ。
ブックマークされているサイトたちのみんなのテンションやモチベーションが高く、新しい事への挑戦、困難な事への共有、またニュースにも話題が多いのでとにかく飽きない。
まだ正式リリースはされていないが、Rails3.0のMerbとの統合についてなどは近年のフレームワークにおいてとても興味深いニュースとなって、フレームワークを取り巻く環境全てがホットだった。

感謝

HTMLコーダーである自分がWEBアプリケーションを構築することができたのには、もちろん自分の中で興味があり挑戦していくこともあったのだが、一番は様々な人のおかげ。
特にプロジェクトとして認めてくれたマネージャーには感謝です。
また、Feedに登場してきた全てのRails関係者の皆さんにも多大な感謝。

まだまだこれから覚えていかないと行けない事も多いし、これからは自分がそういった歯車の一部になっていけるよう精進したいと思いました。

こまかい話

は、これから続きとして書けたらいいなと思います。

sigh

ため息で全てを吹き飛ばしてしまいたい。

「はいはい」って感じ。
分かりましたー。なんて認めちゃった方が楽なのかもしれない。
頑張ってるねー。なんて褒めちゃえばいい話かもしれない。

ごちゃごちゃうるせーんだよ。

生きた心地のしない、夢のない空間。つまらない。
ほんと脳みそ腐っちゃいそうだ。全然納得できない。

無味無臭に、何も期待せず、ため息も殺し、その場をやりすごすことにする。

Stork in Bad Saulgau

嘘みたいなホントの話。

ボクは昔、ドイツ桐蔭学園というところに通っていて、Bad Saulgauという街に住んでいました。
そこはそれこそ絵に描いたようなドイツの田舎街でとても美しい街だったのを覚えています。

ザウルガウの中心街の広場には教会があって、街の憩い場となっています。
そこの教会の十字架は一風変わっていて、今でも信じがたいのですが十字架の上にコウノトリが巣を作っています。

ふとそれを思い出して、Googleの画像検索したらやっぱりそれは実在して、とてもうれしかった。

ザウルガウの十字架にいるコウノトリの巣

ザウルガウの十字架にいるコウノトリの巣

十字架の上にコウノトリが巣をつくるとなると、とても狭い面積の上に大きな巣ができるわけだから、不安定極まりない話。
写真では分かりづらいかもしれませんが、この十字架をよく見ると巣の下が人の手によって補強されています。

言葉では言い表せないな。

なんていうか想像を超えたものが実在するという感覚。人と街と自然。是非もう一度訪れたい場所です。