JavaScript

tweetmeme_style = ‘compact’;tweetmeme_url=’http://dentaq.net/1558/salyu%e3%80%8c%e3%81%9f%e3%81%a0%e3%81%ae%e3%81%a8%e3%82%82%e3%81%a0%e3%81%a1%e3%80%8d%e3%81%ae%e3%83%9f%e3%83%a5%e3%83%bc%e3%82%b8%e3%83%83%e3%82%af%e3%83%93%e3%83%87%e3%82%aa%e3%81%ab%e3%80%81web/’;Checkプレイをクリックすると、ディスプレイが4つのウィンドウに分割され、それぞれのウインドウがそれぞれ別のミニマルなリフレインを奏で、それぞれのループが有機的に重なり合い、ひとつの曲となる。 もちろん、曲の頭から終わりまで4つのウィンドウが奏でる四重奏をじっくり見ても良いし、ウインドウを閉じると当然そのパートのビデオは消えるので、ループ・シーケンサーのトラックミュートボタンを操っているような感覚でDJ気分を楽しんでも良かろう。 ユーザーが新たなストーリーを作っていけるというインタラクティブ(双方向)性ひとつとっても従来の音楽PVとは全く違う体験をユーザーにもたらしてくれる。 ■salyu「ただのともだち」 http://www.salyu.jp/salyuxsalyu/musicmixer/ そして、このミュージックビデオについて調べるとほどなく、Googleから「Chrome Music Mixer」というサービスにたどり着いた。すでに素材となるビデオが用意されていて、ユーザーは好きなビデオを4つセレクトし、すぐにそれらをミックスした作品を再生することができる。salyu「ただのともだち」もこのサービスを応用し作られたもののようである。 ■Chrome Music Mixer http://www.morewithgoogle.jp/musicmixer/ 「Chrome Music Mixer」に実装された画面4分割を実装するJavaScriptのソース部分。縦横無尽なJSのイベントハンドラで操作されていることがわかる。 http://www.morewithgoogle.jp/musicmixer/js/chrometube.js 個人的には、かつて宅録少年だったころには、ラジカセ2台の多重録音から始まり、MIDI~ハードディスクレコーダー、DAWと変遷してきたが、原点は「音をいくつも重ねていける」ということに対する喜びであった。 時は流れいまや誰でも音のみならず映像をこんなに手軽にミックスし楽しめる時代になった。 これからのクリエイターは音と映像の垣根はどんどんなくなる。そして双方向性、ユーザー参加型の要素があるという点もWeb時代の大きな特徴。Webの進化が新たなコミュニケーションのカタチをどんどん開拓している。

Continue reading about salyu「ただのともだち」のミュージックビデオに、Web技術を使った双方向アートの新たなカタチを見た。

tweetmeme_style = ‘compact’;tweetmeme_url=’http://dentaq.net/1407/javascript%e3%81%a7%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e3%82%92%e3%81%af%e3%81%98%e3%82%81%e3%82%8b%e4%ba%ba%e3%81%ae%e3%81%9f%e3%82%81%e3%81%ae%e6%9b%b8%e7%b1%8d%e3%82%ac/’;Check私自身、JavaScript生まれのJavaScript&PHP育ちですが、 JavaScriptでプログラミングを学ぶメリットはズバリ「手軽さ」ではないでしょうか。 コンパイル作業など無しに、結果がブラウザにすぐ表示される。 これはプログラミング入門の敷居を下げるという意味で画期的なことなのではないでしょうか。 以下はもっぱら個人的な経験に基づいた、JavaScript学習書籍のすすめです。 本との出会いは偶然的要因も大いにあり、他にも良書はいくらでもあるでしょうから、参考までに。 ■基礎から学べるJavaScript標準コースウェア 最初に買ったJavaScriptの本がこれ。当時の上司に薦められた。 練習問題などもちゃんと解きながら丸々一冊終了すると、 C,Javaなど他のコンピュータ言語とも共通する、for文、if文といったプログラミングの基本が身に付く。 基本言語仕様について簡潔にまとまっているのと、初めて買ったJS本ということもあり、内容をよく理解しているため、 再確認のため参照することが多い本。 一冊目としてはやや本格的過ぎるかもしれないが、数学の面白さも垣間見せてくれる要素もあり、個人的には一冊目がこの本で良かったと思っている。 ■JavaScript 通称「サイ本」。JavaScript開発者の定番。 まだ私自身、全ての内容を理解できてはいないが、 開発の際、手元においておけばリファレンスとして使える。 そしてじっくりと頭から読み込むと、今まで考えも付かなかったような使い方を思いつくヒントが、隠されているかもしれない。 内容がとても濃く、深い本。

Continue reading about JavaScriptでプログラミングをはじめる人のための書籍ガイド。

tweetmeme_style = ‘compact’;tweetmeme_url=’http://dentaq.net/1378/dom%e3%83%97%e3%83%ad%e3%82%b0%e3%83%a9%e3%83%9f%e3%83%b3%e3%82%b0%e3%81%ab%e3%82%88%e3%82%8b%e8%b6%85%e7%b0%a1%e6%98%93cms%e3%81%ae%e4%bd%9c%e6%88%90/’;CheckあるWeb運用案件で、全くCMS化されていない今時珍しいサイトがある。 運用を任されており、お知らせ一覧を毎回、トップページ、お知らせ一覧その1、お知らせその2と 三箇所更新しなくてはいけないのがいい加減面倒になってきたので、これを簡易CMS化してみようと思い、やってみた。 もっとも適している言語はPHPだが、URLが変わってしまうので、 あくまでJavaScriptによるDOM操作のレベルで、一箇所書き替えるだけで3つの場所に代入され更新されるような プログラムを考えたかった。 1)JavaScriptで配列を組む(更新日、リンク先、更新内容、など) 2)配列内の文字列を加算演算子で制御して、htmlソースを組み立てる(htmlタグの間に上記文字列を挿入) 3)トップページは五件まで繰り返す。お知らせ一覧は全て出力。それぞれを関数化。 4)jQueryでDOM操作(指定のIDを持つタグに上記文字列を関数化し代入) 5)DOM(xhtml)の作成 というような処理を作ってみた。 4)でつまづくかと思ったが、普通のJavaScriptで書いた関数名をそのままjQueryのセレクタに代入できたので、 createElementやらappendChildやらinnerHTMLやら使わずに、あっけないほど簡単に実現出来た。 直感的にDOM操作が簡単にできるjQueryはすごく便利だ。DOM操作には欠かせない。

Continue reading about DOMプログラミングによる超簡易CMSの作成

Katsu on 8月 10th, 2010

tweetmeme_style = ‘compact’;tweetmeme_url=’http://dentaq.net/1011/wordpress%e3%81%aeweb%e3%82%af%e3%83%aa%e3%82%a8%e3%82%a4%e3%82%bf%e3%83%bc3%e5%82%91/’;Checkwordpressで構築されたサイト、多いですよね。人気の背景には、プラグインやテーマ(デザインテンプレート)が充実していることが挙げられると思います。ちなみに当ブログも、wordpressで動いております。日ごろWebクリエイターなどをやっているにもかかわらず、このサイトはほぼ頂き物だけで作られています。有志の方々が作ってくれた、便利なプラグインやテーマを組み合わせているだけ。日ごろ全身全霊を込め人様のサイト制作をしているので、自分のサイトくらい楽をさせて、というのが現状の偽らざる本音でございます。 さて、そんな便利なwordpressプラグインをもっぱら個人的な趣味で開発、無償で提供し、ブログライフひいてはウェブライフを便利にしてくれる愛すべき”ギーク”たちには感謝と敬意(といくばくかの呆れ)を忘れてはなりません。 また、彼らの創造物から学び、一歩でも追いつこうとする技術的向上心も、忘れてはなりません。 私が特に個人的にリスペクトを欠かさない三人を、感謝と敬意(といくばくかの呆れ)を表し、ご紹介します。 ■Roy Tanck http://www.roytanck.com/ Flashによる3Dタグクラウド「WP-Cumulus」の作者。当ブログにも設置させていただいてます、球体でクルクル回るタグクラウド。回すと気持ちいいですね。呆れるくらい、よく出来てる。 ■Alex King http://alexking.org/ ・Wordpressブログのサイドウィジェットに最新のTweetを表示 ・Wordpressブログに記事を投稿するとTweetで知らせてくれる ・一週間のツィートのまとめをWPブログに投稿してくれる など多機能なTwitter用プラグインTwitter Toolsの作者。まぁ、普通ですが、Twitterと連動させたいコトはこれ一本で事足りるので、Tweeterには便利です。 ■Andres Armeda http://armeda.com/ jQueryを使い記事をカルーセル表示させる「WP Post Carousel」作者。 jQueryを使ったwordpressのプラグインもだいぶ充実してきているなか、このインターフェイスは画期的。残念ながら当サイトのようなブログサイトよりはニュースサイトやECサイトのほうが使い道がありそうですが、wordpressの使い道の新たな方向性を提示するような優れたイノベーションという感想を持っております。

Continue reading about wordpressのwebクリエイター3傑

Katsu on 7月 16th, 2010

tweetmeme_style = ‘compact’;tweetmeme_url=’http://dentaq.net/987/translatethis-button/’;Check面白いサービスを見つけました。 http://translateth.is/ 翻訳したい言語を選んで実行してみましょう。 Translate TranslateThis(); 精度はまだまだ?だけど発想自体は素晴らしく発展性のあるものだし、今後のGoogle Language APIなるものの進化に期待したいところです。

Continue reading about Translate This Button