技術に縛られること

何かを作ろうとするとき、
私たちはときおり、技術の中からものごとを見ようとします。

「Flashでプロモーションサイトを作ります」
「このサイトはWeb標準で作ります」

けれど、技術は道具に過ぎません。
インタラクティブで印象的なサイトを作りたいから、Flashを使うわけです。
アクセシビリティやSEOに配慮すると、Web標準での制作になるわけです。

新しい技術なら、技術をウリに、結論にするのもいいのかもしれません。
でも私は、技術は過程だと思っています。
あるコンセプトを叶えるために、生かすために使うものだと思うのです。

クライアントが望むのは、使う技術のレベルではない。
クライアントが望むのは、指示通りの、またはそれ以上のクオリティを持つコンテンツ。

学生の甘いところはやっぱりそこで、
Web標準が何であるかも説明しないくせに
「Web標準準拠でサイトを作ります」なんてことを平気で口走る。

Web標準が悪いわけではありません。
Web標準でサイトを作ることを、わざわざアピールする意味があるのかということ。
業界ではほぼ「標準」になりつつあるのに。
技術をアピールしたいなら、その技術がどういった利点をもたらすものかを説明する必要があるでしょう。

技術は、とても大事で価値のあるもの。でも、
技術は誇示すべきものではない、と私は思う。

自己反省なんですけどね。

Firefox3とFirefox2の同時起動

別にFirefox3に嫌気がさしたわけではないのですが、
Firefox2とForefox3でレンダリングに差異があった場合
私のFirefox3じゃサポートしきれないなと思いまして、
Firefox3とFirefox2の共存・同時起動ができないかと思って探したところ、
以下のすばらしいサイトを発見しました！

Firefox2と3を共存させて同時起動
このページを見ればばっちりインストールが可能です。

注意点としては、

1. ここでは、Firefox3が入っている人が、後からFirefox2を入れたい場合の解説をしています。
2. このサイトを参考にFirefox2のインストールを進める際は、Firefox以外のブラウザでこのサイトを見ることをオススメします。（Firefoxをシャットダウンする必要があるため）
3. デスクトップにFirefox3のショートカットがある場合、Firefox2のショートカットに上書きされるようです。 Firefox3用のショートカットは別途作ってください。（Program Filesからいそいそと持ってくる感じです）
4. 英語の部分のつづりを間違いやすいので気をつけてください。

こんなところでしょうか。

まだFirefox2だけどFirefox3をインストールしたいという方は、
Firefox2とFirefox3を同時に使う
こちらを見てみるといいかもしれません。
(私は検証してません、ごめんなさい！)

いろんなエフェクトが実装できるjRails

http://coliss.com/様のアーカイブから見つけてきた、jRails。

jRails
http://ennerchi.com/projects/jrails

またまた本家が英語で申し訳ないんですが、
それほど新しいモノではないと思うので、知っている方も多いと思います。

jRailsはjQueryと一緒に使うライブラリで、
Prototype/script.aculo.us にも Railsというライブラリがあるらしく、
その jQuery版といったところらしいです。
（らしいばっかですみません･･･。）

この本家サイトの真ん中にある動作サムネイルがすごくかわいいんですよ！

Javascriptに関しては全くのかけだしなので、
いろんなライブラリがあって勉強になりますね。

---

2010/7/11追記
jRailsの本家デモがなくなってたので、簡易版を作ってみました。

ペーパープロトタイピング

Webデザイン関連のRSSから、ペーパープロトタイピングの記事を発見したのでメモ。

ペーパープロトタイプとは、Webサイトを紙の上で再現したもの。
ボタンのクリックやページ遷移のたびに紙芝居のように手動で紙を切り替えていく、
アナログ的な手法です。

本番のWebサイトを作る前にこういった手順を踏んでおくと、
分かりにくさやエラーが見つかりやすくなります。

研究室にあった2004年あたりのWebDesigningに
ペーパープロトタイプについての説明がちらっとあったので気になっていたのですが、
下記のサイトで動画付きで紹介されていたので、ぜひご覧下さい。
英語サイトですが、動画を見ればペーパープロトタイピングがどんなものかすぐわかるはずです。
The Paper Version of the Web
(ページの中盤くらいに、Youtubeビデオがあります)

Web屋さんではないけれど、Webサイトを作りたい！と思っている方がいるなら、
ペーパープロトタイプを作ることから始めてみてはどうでしょうか。
既存のサイトのプロトタイプを作って、構造の勉強をするのもいいかも。
(本来のペーパープロトタイプの用途とは違うかもしれませんが…)

やっぱり、手を動かすということは、とても素敵なことだと思います。
手で作ったものって、やっぱり個性が出ますし、
自分で書いたぶん愛着もわきますしね。
私なんかは、既存のWebサイトでさえ、
紙に印刷されているだけで愛着度がかなり増します。
本当に不思議ですね。

ペーパープロトタイプ、作ってみると面白いと思います。

わたしはもともとアナログ的なものが好きで、
今回紹介した「紙でWebサイトを作る」ペーパープロトタイプにはとても興味があったのですが、
今年のWebデザイントレンドもヴィンテージ風、手書き風のサイトがピックアップされており、嬉しい限りです！
2008 Design Trends(英語)

以上、アナログメモでした。

---

8月18日追記

ペーパープロトタイプに関する動画のまとめ

画面切り替えの効果２

Flashにおける画面切り替え表現のメモ。

パワーポイントとは違う表現の特殊な効果だけを書き出しています。

１．アイリス

指定した方向から、指定した形で次の画面が現れる表現。
目を開けたときに、視界が広がるイメージ。
中の階層を拡大表示するイメージ。
パワーポイントでいうと「ボックスワイプアウト」に近い。

２．フライ

スライドしながら次画面を表示させる手法。
動作確認が上手くできないので明言はできないが、おそらくスライドイン（紙芝居）と同じ見え方。

３．ズーム

次画面がだんだん大きくなって表示される。
アイリスとの違いは、画面全体の縮小版が、だんだんと大きくなっていく点。

ムービーメーカーにおける画面切り替え表現のメモ。

Windowsムービーメーカーにおける、基本的または変わった効果だけを書き出しています。

１．アイリス

Flashと同じ。

２．スライド

スライドして画面外に移動する、パワーポイントのスライドインと同じ。

３．フェード

緩やかに画面が切り替わる。

４．プッシュ

パワーポイントで言うところの「ワイプ」。

５．ワイプ

ムービーメーカーにおけるワイプは、
プッシュの前画面と次画面の切り替えの切れ目にぼかしが入れてあり、
画面の切り替えがより自然になっている。

６．ページカール

ページをめくるように画面遷移を行う手法。
Flashにも、Dynamic Page Flip
といって本をめくるようなアニメーションがありますよね。

お役立ちリンク

Mac、Keynoteの画面切替えエフェクト一覧
画面切替エフェクトの有効性

調査だけは順調ですね。
今日のメモ終わり。