第27回 ゲームから読み解く、俺スクリプト時代の知的な挑戦
株式会社ピーデー
川俣 晶
2007/11/28
そのほかの見どころ
Ajaxとそれに関連する話題を紹介します。
■ Google OpenSocialで各SNS共通のウィジェットが実現?
![]() |
| OpenSocial のトップページ |
- - PR -
GoogleのOpenSocialは、共通のwidgetが対応SNSのどれでも使用できるようにする標準技術です。これが何を意味するのかは、F.Ko-Jiの「一秒後は未来」というブログの「OpenSocialをどのように捉えるか」で下記のように述べられていて、参考になります。
「OpenSocialによってmixiがソーシャルなプラットフォームになるとすれば、これからは新たなSNSを作るのではなく、mixiをはじめとするSNSに足りない機能をwidgetで提供するということがポイントになると考えられる。もはや会員を自力で集める必要はない。mixi上にwidgetを提供するだけで、最初から1000万のユーザを相手にすることができるからだ」
ユーザー側から見れば、使い慣れたSNSから離れることなく追加機能が自由に組み込めるようになれば便利ですね。
編集部注:SNSそのものについて詳しく知りたい読者は、Master of IP Networkの5分でネットがわかるシリーズ第7回、「2006年のネット界を席巻したSNS」をご参照ください。
■ IEを拡張するJavaScriptデバッガ、DebugBar
Webブラウザ上のデバッグツールは、IE/Firefoxを問わずいろいろ紹介してきましたが、これはIE用の強力なデバッグツールです。1つでも多くツールを知っているといいことがあるかもしれません。
![]() |
| 「リッチクライアント & 帳票」フォーラムTOPページをDebugBarで解析(画像をクリックすると拡大します) |
ちなみに、DebugBarのサイトのHOMEを表示させると英語ではない言語(フランス語?)の文章が交ざって表示されたのが、印象に残ります。どうやらフランスのサイトのようですね。
■ ページの画面が崩壊! するブックマークレット
ここに書かれた行をWebブラウザのアドレス欄に入力すると、ページ内容が徐々に崩壊していきます。
![]() |
| 崩壊中の「リッチクライアント & 帳票」フォーラムTOPページ |
Webブラウザ上のJavaScriptで何ができるかを学ぶのに良い題材だと思います。堅苦しい書籍で学ぶのに飽きたら、こういうプログラムの動作を解析すると楽しくさまざまな知識が身に付くと思います。
■ iTunesのCoverFlowっぽい鏡面反射画像を作るJSライブラリ
1枚の画像から、鏡面反射的なエフェクトの付いた画面を作り出すライブラリです。
![]() |
| 3d image reflection with javascriptのページ |
なぜこれを取り上げたのかというと、容易に調達できる少数の素材だけで、それなりに見栄えの良い効果が得られると役立つからです。通常、「見栄え」が欲しい場合にはまさにそれなりの見栄えを持った画像をPhotoShopなどで作り出すのが早道です。
プログラムを使って特殊なエフェクトを掛けるのは、手間の掛かる作業です。しかし、このようなライブラリがあれば、逆により少ない手間で見栄えを得られる可能性が出てきます。
特に、「見栄え」そのものが本来のページの目的ではなく、単なるアクセントにすぎない場合は、こういったプログラムで見栄えを改善できれば助けになります。しかも、プログラムで表示時に生成させるのなら、素材をいつでも差し替えられます。
■ FlashではなくJavaScriptでゲームを作るという「知的な挑戦」
JavaScriptだけで書かれたゲームです。ゲームとしての内容はよくあるもので特に目新しいものではありません。しかし、音や動きも含め、すべてJavaScriptで書いてある……という「追求の精神」は注目に値します。
![]() |
| Prototype/Scriptaculous Version of Same Gameのページ |
さて、このゲームを見ていて思い出したのは、パソコン黎明(れいめい)期の状況です。Flashを使えば簡単なのにあえてJavaScriptにこだわる…… という精神が、当時にもあったような気がしました。1980年代初期の8bitパソコン全盛期には、NECのPC-8801シリーズと、富士通のFM-7シリーズが2大人気シリーズとして支持されていました。特に、NECと比べて一般向けパソコンのヒット作に恵まれない富士通にあって、FM-7の高い人気は歴史的に貴重なものではないかと思います。
とはいえ、セカンドライフの富士通島の歴史コーナーに行くと、3Dモデルで展示されているパソコンはFM-TOWNSだけで、画像データで展示されるパソコンはFM-16πと9450だけという感じであり、もはや当事者の富士通でさえ存在を忘却しつつある感じもありますが……。
この2つは、高級高価格のPC-8801シリーズと、安価で手軽なFM-7シリーズと市場をすみ分けていましたが、実は性能面では安いFM-7シリーズの方が圧倒的に優れていました。例えば、グラフィック画面の消去を実行すると、FM-7はあっという間に終わるのに、PC-8801は何秒もかかって上からじわじわと消えていく感じでした。
さて、この状況下で私はPC-8801のプログラミングの仕事をしていました。それは、同じ機能を実現するためにFM-7の何倍もの手間と知恵をつぎ込まねばならないことを意味します。では、その仕事は苦痛であったのか…… といえば、そうではありません。むしろ、面白かった…… とすらいえます。限界を超えるための「知的な挑戦」は刺激があるし、出来上がったプログラムは多数のユーザーが所有するパソコンで実行できたのです。
そして、あえてJavaScriptにこだわるプログラミングも、これと同じなのだな…… と思いました。「XXなら簡単にできるのに」と思いつつ、あえて「知的な挑戦」を行い、そして勝利すればそれは多くのユーザーが所有するWebブラウザで即座に実行できます。満足感や手応えの大きな挑戦といえるでしょう。
■@IT関連記事
パターンとライブラリで作るAjaxおいしいレシピ
Ajax開発においてみなさんはMVCを意識していますか? 本連載では、デザインパターンとライブラリを活用し、MVCで設計する分かりやすいプログラミングの仕方をサンプルを見ながら解説します
- 第1回 jQueryを使ってTwitterをおいしくマッシュアップ
- 第2回 prototype.jsでYouTubeをインクリメンタルサーチ
- 第3回 Ext JSとprototype.jsで作るリッチなUI
- 第4回 Ajaxの弱点を補うscript.aculo.usの楽しいエフェクト
- 第5回 jQuery UIで実現! Ajaxで複数選択ドラッグ&ドロップ
- 第6回 Aptana Jaxerで解決するAjaxのSEO対策とは?
| いまさら聞けない、“Ajax”とは何なのか? いまさら聞けないリッチクライアント技術(3) Googleマップで有名になり、もはやWebの定番といっても過言ではないAjax。その生い立ちや仕組み、構成技術について解説 「リッチクライアント & 帳票」フ ォーラム 2007/8/23 |
||
| いまさら聞けないJavaScript入門 いまさら聞けないリッチクライアント技術(2) Ajax技術が注目され大復活を遂げたJavaScript。しかし、復活するまでには数々の悲劇が…… さらに実例や使い方なども解説 「リッチクライアント & 帳票」フ ォーラム 2007/7/17 |
||
社内SNSをOpenPNEで作ってみよう
OpenPNEというオープンソースソフトで社内SNSを構築し、いかに有益に面白く運営していくかを導入事例を交えて解説する。
- 第1回 社内でSNS? ホントに役に立つの? 面白いの?
- 第2回 SNSとアプリのID連携もかんたんに実現するOpenPNE
- 第3回 NECでは社内SNSをどのように使っているのか?
- 最終回 OpenPNEの社内SNSをもっと便利に活用するには?
| JavaScript開発ツールの本命! FirebugとAptana どこまでできる? 無料ツールでWebサイト作成(4) JavaScript/Ajax開発で“使える”無料ツールはあるの? そんな疑問を持つ人にはFirebugやAptanaがオススメです 「リッチクライアント & 帳票」フォーラム 2007/11/16 |
||
| 低スペックPCでも使える! Webブラウザでサイト作成 どこまでできる? 無料ツールでWebサイト作成(3) Webブラウザのプラグインにもサイト作成に役立つツールが多く存在します。何よりプレビューが正確で動作も軽いです 「リッチクライアント & 帳票」フォーラム 2007/10/12 |
||
1-2 |
| INDEX | ||
| 第27回 ゲームから読み解く、俺スクリプト時代の知的な挑戦 | ||
| Page1 実は、マイクロソフトは画像検索やマッシュアップでもすごい!? プラグイン抜きで新言語を使う「俺スクリプト」の時代 Mozillaの「Prism」に見るデスクトップ回帰 |
||
| Page2<そのほかのみどころ> Google OpenSocialで各SNS共通のウィジェットが実現? IEを拡張するJavaScriptデバッガ、DebugBar ページの画面が崩壊! するブックマークレット iTunesのCoverFlowっぽい鏡面反射画像を作るJSライブラリ FlashではなくJavaScriptでゲームを作るという「知的な挑戦」 |
||
Ajax うきうき Watch バックナンバー
- 第1回 Webアプリのユーザビリティを改善しまくるAjax
- 第2回 Ajax、それはWeb 2.0へと続く道
- 第3回 どんなに無茶をやっても「それもありかな」なAjax
- 第4回 自動車業界のAjaxを活用したキャンペーンを目撃せよ
- 第5回 “どのブラウザでも動くAjax”を共有財産として育てよう
- 第6回 プロプライエタリ2.0から考えるAjaxの公開/非公開部
- 第7回 メモリリークが小さくなったGoogle Maps APIの新版
- 第8回 “CGUI” 消費者が作り出すUIの時代突入
- 第9回 巨大化するAjaxライブラリをシンプルにする新たな流れ
- 第10回 地図のように年代を移動できるMITのAjax歴史年表
- 第11回 JSONがRFCになり、どんどんこなれるAjaxサービス
- 第12回 サーバが通信を開始できるComet活用Webチャット
- 第13回 オンラインゲームで検索精度を上げるGoogleの巧みさ
- 第14回 IE7とFirefox 2への利用者の大移動は起こるか?
- 第15回 グーグル検索エンジンを特定ジャンル専用に、Co-op
- 第16回 帯域やデバイス領域をフル活用させる“モバイルAjax”
- 第17回 新しい技術を模索するYahoo!、Google、MS
- 第18回 Ajaxの高度な使用例、Yahoo! pipes
- 第19回 Apollo参戦でウィジェット開発者の争奪戦が激化
- 第20回 Twitter登場で注目されるRTコミュニケーションツール
- 第21回 過熱するTwitterブームとMicrosoftのマッシュアップ
- 第22回 iPhoneのAjax戦略、そして今日もWeb APIは増加する
- 第23回 Ajax開発者がヒーローになるとき、それはいま!
- 第24回 携帯電話への拡張を進めるGoogleとWeb隠しコマンド
- 第25回 Ajaxで加速!? エンタープライズ2.0とWebOSの普及
- 第26回 「言葉」を超えた説得力を持つAjaxの存在感と広がり
- 第27回 ゲームから読み解く、俺スクリプト時代の知的な挑戦
- 第28回 マッシュアップ元年が終わり、2008年はどうなる?
- 第29回 Twitterやクラウドへも分岐するAjax/Web APIの道
- 第30回 Ajaxはじめて物語、そしてサーバでも動くJavaScript
- 第31回 新ブラウザ戦争はon fireだがJavaScriptはoffのナゾ
- 第32回 Google App EngineはAjaxへのハードルを下げるか?
- 最終回 Pure JavaScriptの動画再生やRPGも好きでした
TechTargetジャパン
- 次のモバイルアプリはどのフレームワークで作る? (2012/5/24)
スマホアプリの開発を容易にするJavaScriptのフレームワークが続々と増えている。それぞれの良さや仕組み、何がどこまでできるのかを徹底解剖する - 「LESS&専用エディター」でCSSをシンプルに書こう (2012/5/23)
「LESS」はCSS初心者に向けた、シンプルなライブラリだ。「LESS」で、変数などのプログラミングの基礎的な考え方もCSSで学ぼう - 学校が世界一のデジタル環境になったら (2012/5/18)
授業はアーカイブに蓄積され、家からも見られる。家族が授業テーマのアイデアを出す。そんな姿が実現されるかもしれない - 1000万ドル調達も夢じゃないクラウドファウンディング (2012/5/15)
クラウドファンディングは、寄付型でも投資型でもない「購入型」が主流。商品を“開発する前に販売”して開発費用を集める逆転のシステムだ
|
|





