Note Archive

僕はウェブ制作に関する技術や知識の学習をほぼ全て独自の方法で行ってきました。
それ故他人にその方法をレクチャーし実践してみろとは中々言えませんが、その中でも「大体どんな人にも役に立つであろう学習法」と言うものがありますので、今日はその方法について僭越ながら書きたいと思います。

まず僕がなんの前知識も持たず、それこそ「HTML はウェブページを構成する言語」と言う程度の知識レベルでもってウェブサービスの受託開発を始め、対価を支払ってもらえるクオリティの作品を提供できるまでになった過程において最も重要な事はもちろん「どうやって効率よく問題を解決するか」と言う能力でした。

フェーズ1

「どれだけの事を知っているか」と言う質問は、ことインターネットの世界で仕事をしている身としてはナンセンスであると言わざるを得ません。
僕が知っている必要は無いんです。答えられない疑問にぶち当たったとき「どこをどう探せば答えが見つかるか」というノウハウと「得られた答えの信憑性」を適切に評価できる最低限の知識さえあればいいんです。ググレカスってのはこの事だったわけです。

とは言え多くの初学者はまず「どこをどう探せば答えが見つかるか」と言うノウハウが無いわけですから、自分の中に答えがない時点で「分からない」となってしまいます。質問系サービスで質問している人たちですね。
実生活に関わるような事であれば短絡的に人に聞くことは間違いではないと思いますが、これが技術的な内容であった場合には話が別です。
このように技術的な内容を質問してしまうような状態をとりあえずフェーズ1とします。別に意味はないんですけどね。

フェーズ2

このフェーズ1の人たちは言うなれば「手に漢字辞書を持ちつつ人に漢字の読みをたずねる」と言うような事をやっています。そもそも”手に漢字辞書を持っている”という認識がありません。まずは手に漢字辞書を持っている、要するに欲しい回答を手に握っていると言う前提を理解する必要があります。
これは最終的に肌感覚にまで高める必要があります。「自分の知らない事は探せる」のがほとんどの場合に適合する事実です。今の時点ではそうじゃないかもしれませんが、この感覚を常に持つ事によって次のフェーズに進む事が出来ます。

次のフェーズは「探し方が分からない」状態にある人です。「インターネットで検索すれば見つかるんだろうけど、どうやって探せばいいの？」というような感覚です。
ここまでくれば後もう少し。答えは簡単「問題を解決した気になったとき、それをアウトプットするにはどういった単語を使うか」と言う事を考えれば良いのです。
”問題の答え”が存在する前提に”問題”自体の存在が不可欠なわけですから、”問題の答え”を知りたければ”問題”自体をキーにして探せば良いのです。
つまり、今起きている問題に由来する普段見かけないエラーメッセージであるとか、状況を言葉にして検索してみましょう。

なんとなく「今起きている問題の原因」がつかめてきたのではないかと思います。つかめていない人は探り方が浅いだけだと思います。
「今自分が思いついたアイデアは既に誰かが思いついている」のと同じくらい「今自分が困っている状況は既に誰かが困っていた」のです。
その困った経験を先駆者が残していない可能性はありますが、日本語だけではなく英語圏にまで検索の手を伸ばすと大体見つかるはずです。
もしかするとフェーズ1の人が誰かに質問したページが見つかるかもしれません。諦めずにとことんまで探してみるときっと見つかるはずです。
仮に答えが見つからなかったとしても、答えをつかむための糸口は見つかるでしょう。

フェーズ3

さて、ここまでがフェーズ2なわけなのですが、ここからが本題。
「探せば答えか、答えに繋がる糸口が見つかる」と言う点について理解できたなら、今度はその検索性能を向上させましょう。
いくらインターネットで検索すれば見つかるからといって、できるならば手間を惜しみたいですし、何よりも問題の法則性から答えを探す作業自体を簡略化させないと実務的ではありません。自分が組んでいるプログラムにエラーがでたからといってそうそう1日も2日も答えを探す時間は無いはずです。
とは言え ML なんかに「教えて下さい」じゃ本来自分でハンドリングしなければならない開発時間の一部を善意の第三者に依存する事になりますので、ご自身のマネージメント自体も不安定なものとなってしまいます。これじゃ本末転倒ですね。

という事で僕がお勧めしたいのが「質問に答える側に立つ練習」です。問題とその解決手段という事象に関係しているのは”質問者”と”回答者”という単純な二者です。
「人の立場になって良く考えてみろ」とはよく言ったものですが、これがまさにそう。「質問に対して回答する立場を以って回答する力を身につける」即ち「問題を解決する能力を身に着ける」練習です。
あなたにとって ML で質問している人は自己の能力を向上させるための機会提供者です。僕自身 PHP という言語を通してウェブアプリケーションの開発や、ウェブサービスの運用をゼロから学んできました。その最初期にとった行動が「PHP-users の ML で質問に答える」と言うものです。PHP どころか所謂プログラム言語そのものにそれほど触れてこなかった人間が、いかに実務的とは言えその実務的な理解が全くない状況でウェブサービスを作らなければならないような状況においては背に腹はかえられません。とにかく「答える方が分かってる」と言う自明の理を頼りにひたすら質問に答えてました。
プログラムが動かないと言うのであれば同じ環境を作って再現して解決策を考えてみたり、モジュールが動かないという質問があれば PHP をソースからビルドしてみたり。こういったプロセスは「質問に答える」というモチベーションが根底にありますので、僕みたいに一人でやっている人間にとってはとても張りのある勉強法でもありました。

効果はてきめん。質問に対して答えを返す立場に立つ事で「問題を解決するアプローチの確立」どころか「問題を解決するために予め知っておかなければならない知識」や「問題の根本にあるインターネットの文化的、歴史的な構造と、その構造が影響するその他の問題」と言った”一つの事象に紐づく様々な要因”についての知識と、それらを関連付ける技術的なインデックスが皮膚感覚で培われていきました。
これが大体フェーズ3．次のフェーズ4が僕のいる位置なので、それ以降のフェーズはどんなもんなのかわかりませんが、とりあえずフェーズ4は「抽象的な表現や思想を技術的なアプローチで具体的にする」と言うものです。

フェーズ4

僕がフリーランスの時代から使っていた屋号は「SPaiS」といって Spice(スパイス)をもじったものです。クライアントが持ち込む様々なアイデアやビジネスプランに対して技術的な視点で「どのように実現していくか」をスパイスとして味付けしていく事が僕が自分に課した命題でした。
おかげさまで様々なクライアントとお話をさせて頂き、様々なビジネスプランやアイデアをウェブの世界に技術的なアプローチで昇華させることができ、昨年起業しました。
まあそんなことはどうでも良いのですが、問題に対する解決策を提供する力を高める事によって、本質的には問題でない「こういうアイデアをウェブでお金にするためにはどうしたらいい？」だとか「こういうビジネスプランがあるんだけどウェブで成功させるためにはどういった手順を踏めばいい？」と言うような質問に対して独創的な発想を邪魔する事のない広い知見と”物事を調べる力”で回答できるようになります。

これが出来れば世の中にたくさんいる「あんまりお金は出せないけどウェブサービスを運用してみたい」と言う企業とお話が出来るようになります。
もしくはあなたがこっそり考えているすばらしい企画やアイデアを実現できる力にもなります。
結局のところ一人でやればウェブサービスにかかるコストはあなた一人の人件費だけです。つまりほとんどが純益になるわけです。
そう考えると「自分ひとりでウェブサービスが開発できるならばそれだけで食っていける」とは思えませんか？ググレカスを究極的に昇華していくとこうなるのだと僕は思いますし、実際に今の僕がそういう状況です。

結果を知っている必要は無いんです。道具の使い方と先駆者の知識を手にする方法さえ理解していれば、それだけであなたの力は何倍にもなります。
「探したけど無かった」のではなく、見つけるのを諦めただけです。つまり「ググレカス」はあなたにとってのチャンスなのです。

さあググレカス！

間違ってたらご指摘頂けると助かります。

1. wp_enqueue_script() でバージョン指定するときに mktime() と書くと毎回ちゃんと更新されててよろしい。wp_enqueue_style() も然り。
2. プラグインファイルで直接メソッドや関数を呼び出さず、アクションにフックした方がいい。
3. plugin_loaded アクションが最初に呼び出される。URI の解析なんかよりも前に呼ばれる。
4. Wordpress コアの前処理が終わった後に実行されるのは init アクション。通常はこっちを使う。
5. admin_notices アクションで echo すると「投稿を保存しました。」みたいなメッセージ表示が出来る。div.error で括ればエラー表示が出来る。
6. Wordpress コアに標準搭載されてる jQuery よりも新しい jQuery が使いたいときは init アクションとかにフックして wp_deregister_script( ‘jquery’ ); をしてから wp_enqueue_script() で登録しなおす。
7. 管理画面のサイドバーに表示されてるメニューのサブメニューに項目追加したい場合は add_submenu_page() を使う。init アクションとかに無名関数をフックしてそこから呼び出すと無駄がない。
8. $wpdb->prepare() は sprintf() のラッパー。エスケープは addslashes() だけど UTF-8 だから問題ないと思う。
9. $wpdb->prepare() は %s と %d を拾って自動的にクォートしてくれる。%1$s とかじゃ駄目
10. MySQL 4.0.27 未満だと UTF-8 での LIKE 句の処理にバグがあるので 4.0.27 未満の MySQL で運用する Wordpress の日本語検索は正しい結果が返ってこない。
11. テスト環境とか似たような環境をいくつも用意する場合は mysqldump でデータベースコピーした方が早い。
12. 管理画面用の admin-ajax.php に POST リクエストするときに独自アクションを追加するなら ‘wp_ajax_’.$_POST['action'] にフックする。
13. admin-ajax.php を使うと最後に 0 が出力されるので、それがいやならばその前にスクリプトを停止させる。

たまったらまた書きます。

自作のプラグインで生成するページが既存のテンプレートにマッチしなかったり、ページの種類によってテンプレートを変えたいなーなんて事、ありますよね。
page.php などの中でさらに分岐させても良いのですが、それではロジックとビューが混在してしまうためロジックがプラグインだったりするとテーマとプラグインに依存関係が生まれて使い勝手が悪くなってしまってイマイチです。

そんなときはフィルタ関数で呼び出すテンプレートファイルを変えてしまいましょう。
大体こんな感じ。

<?php
function pageSnacher( $template ){
    if( preg_match( '/^\/hoge$/', getenv( 'REQUEST_URI' ) ) )
        $template = TEMPLATEPATH . '/hoge.php';
    return $template;
}
add_filter( 'page_template', 'pageSnatcher' );
?>

URI が /hoge だった場合にテーマのディレクトリにある hoge.php がテンプレートファイルとして読み込まれます。
page_template は wp-includes/template-loader.php で is_page() が true を返したときに呼び出されるフックです。
よって、init フックとかで add_filter() しても意味がなかったりしますので気をつけてください。
それぞれのテンプレートで呼び出されるフックは wp-includes/theme.php 辺りを読めば大体わかると思います。

ついこないだまで「もう夏も終わりなのかあ」と涼しさを満喫していたのに、ここ数日の暑さと言ったら半端ないですね。
僕などは打ち合わせの帰り道、余りにも暑すぎたので家につく頃には全裸で右肩にティッシュを一枚載せているだけの格好になっていました。

さて、つい先日友人からイベントのフライヤー制作を依頼されました。つい先日といっても火曜日。締め切りが金曜日。本来ならばこの時点でアウトなのですがそこはそれ、普段とてもお世話になっている人からの頼みだったし、自分としても世間に向けてのアッピール(割と大き目のイベントなので)ができると踏んで、快く引き受けました。が、フライヤーに描く DJ セットは実写でとのこと。これはキラーパス。そもそも DJ セットの写真なんてほとんど DJ 側の視点での素材しかなく、うーんと悩んでいたところひらめきました。

3DCG で実写っぽく描いてしまえばいいじゃないか。

正直 3DCG とか描いた事無いのでどのくらいで描けるのか、そもそも描けるのか？と言う心境ではありましたが、他に手段はない、金曜日まで約100時間あるしなんとかなるだろうくらいの軽い気持ちでいたのですが、そのまえに片付けておかなければならない別件や打ち合わせがいくつかあり、実際に作業を始めたのが水曜日の17時。これはマジでやばい。

やばいと思う時間的余裕もなかったので、とりあえずソフトをダウンロード。Blender を使うことに。CAD で図面ひくくらいは出来るので構造的なところは理解できるのだけど、いかんせん操作方法や用語的なところが全くわからない。と言うか左クリックと右クリックとホイールクリックなんかが独自の価値観をかもし出しててこれもやばい。

とりあえず wiki を読みまくってウェブで情報を収集しまくる事8時間。なんとか操作方法や用語も把握してきて、これならばなんとかなりそうだなと作ること3時間。ターンテーブルが出来ました。

　割と簡単に出来たので調子に乗ってミキサーも作り始めたのですが、朝5時を回った頃に急激に頭が回らなくなり作業停止。かなり特殊なキーバインドは一朝一夕では体になじむわけも無く、描きつつ次の操作のキーを頭の中で選択する必要があるのですが、それだけに頭が回らなくなると効率が落ちる。落ちるなんてもんじゃなくて今どのキーを押して次にどのキーを押せばいいのか把握できなくなってきたのでとりあえず一旦中止。

2時間ほど仮眠を取って作業再開。頭の回転もいい感じ。夕方までかかってしまったけどミキサーも完成して、なんとか DJ セットが出来上がりました。と、ここで満足しておけばいいものの、ここまで出来ると人間欲がでてきますね。調子に乗って全部 3DCG にしてしまえ！とさらに追加！追加！あれもこれもポリゴン！なんてやっているうちに23時。さすがに昨日の2時間だけでは体力が続かず、今日のところはここで店じまい。

「明日は残りを描いてレンダリングも色々と考えてみたいなあ」なんて歯を磨きつつウェブを検索していると、Blender には YafRay というフリーのレンダリングエンジンが内蔵されているという。全然気づかなかった。と言う事で「YafRay Blender」でイメージ検索してみたら凄い事に・・・

「これは・・・(ゴクリ)」みたいな状態でイメージ検索の結果を眺めていたらまたムラムラとしてきて、明日はレンダリング祭りだな、と決意も新たに床につきました。

僕は普段朝起きてご飯食べたらすぐに作業を開始するのですが、その日はいつもより心なしか急ぎ目でご飯をのどに押し込み、ワイフが掃除機をかけるのを傍目に残りの作業をはじめたわけです。

午後、ワイフの作ったお弁当を食べつつ全てのポリゴンを描き終わって配置も OK！あとはレンダリングですね！となってはみたものの、なんか暗い。

　全く意味がわからなかったのですが、よくよく考えてみるとあてていたのはスポットライトだけ。そもそもこの空間にはチリや埃が無いため光が拡散しない。スポットを当てたら純粋にオブジェクトの反射光しか見えない。Team-one のポリゴン番長 kappon に色々と聞いて、エロウェブデザイナーの wu-tang にも色々と聞いて、やっとこさライティングのなんたるかが、0.2%くらいわかってきたところで完成したのがこれ。

すごい！僕すごい！と言うか3日でこれだけの表現が出来るようになる Blender と YafRay が凄い！一気に 3DCG にはまりました。wu-tang は「modo 買って一緒にやろうよ」なんて言ってましたが、まだお金を出して楽しめるほどのレベルではないので、もうちょい Blender で遊んでみたいと思います。

反省点

最終的な使い道がわかっていたはずなのに、調子に乗って凄い細かいところまで描いていたので、次回からはここらへんをもうちょいゆるく作っていければと思いました。
凄い細かく描いたのに全然見えない！凄い残念＞＜

結構前からおっさんになったら油絵をやってみたいと考えていたのですが、油絵風の描き味が楽しめるペイントツール ArtRage2 をきりゅさんに教えてもらって無料体験版を試してみました。
ペンタブレットを持っていないので魅力の10%も感じられてはいないだろうと思ったけど、凄く楽しい！

一気にペンタブレット欲しい熱が上がりました。