ウェブ Archive

CSS Gallery – Showcase – Inspiration – CssDsgn.

CSSサイトデザインギャラリー。

うつくすぃ。

Desktopography 2009 exhibition released! – Nature’s design on your desktop.

Exhibition 5 – 2009 がリリース。

相変わらずとっても高品質な壁紙たち。

Safari、高速化Tips – apple source.

Terminalで「defaults write com.apple.Safari WebKitInitialTimedLayoutDelay 0.25」と入力するだけ。

これでSafariが読み込んだデータを画面にレイアウトするまでのディレイを減らすことができるらしい。上のコマンドはデフォルトで1秒に設定されているのを、0.25秒に変更している。

Arpel ®2009

ぬるぬる動く1枚のサイト。

40 Great Adobe AIR Applications for Designers and Developers | Webdesigner Depot.

海外では結構色々作られていそうなAirアプリ。デザイナ、開発者向けのが40個紹介されている。会社PCがもっと快適なら色々試して環境構築したい……重すぎだ今のPC。

それにしてもAirはもっと流行っていいと思うんだけどなー。いまいち浸透していない。ブラウザゲームの流行に乗って、Airで動くゲームが出てきたりして欲しい、ってか機会があれば企画制作してみたい（笑）

株式会社ミクシィ

これまでmixi（SNSの方）とほとんど同じだったコーポレートサイトが会社サイトっぽくリニューアル。ソースを覗いてみると、wp-contentとか書いてあったので、どうやらWordPressを使ったらしい。

日本でも採用事例が増えてきたなー、WordPress。

デザインという言葉でひとくくりにしてしまうと、人によってこの言葉に対する考えが微妙に異なっていることがよくある。

「Design」とは

1. 〔製造物｛せいぞう ぶつ｝や建造物｛けんぞうぶつ｝の〕下絵｛したえ｝、略図｛りゃくず｝、見取り図｛みとりず｝、設計図｛せっけいず｝
・Look at the design of a 101-story building on the wall. : 壁に貼ってある101階建ての建物の見取り図を見てください。
2. 〔部品｛ぶひん｝などの〕配置｛はいち｝、構造｛こうぞう｝
・The mechanical design of the memory module is defined by the organization. : メモリ・モジュールの機械的な構造はその組織により定められている。
3. 設計｛せっけい｝［デザイン］技法｛ぎほう｝［すること］
・I learned interior design at home. : インテリア・デザインを自宅で学習しました。
4. 図柄｛ずがら｝、模様｛もよう｝、デザイン、意匠｛いしょう｝
・I don’t like the design of the postcard. : そのはがきのデザインが気に入らない。
5. 〔基本的｛きほん てき｝な〕様式｛ようしき｝、型
・The basic design of all music has not been changed for about 300 years. : すべての音楽の基本的な様式は300年ほど変わっていない。
6. 案、計画｛けいかく｝、企画｛きかく｝
・I do the design of a trip in much the same way as a painter paints a picture. : 私は画家が絵を描くのとほとんど同じように旅行の企画を作る。
7. 意図｛いと｝、ねらい
・It was not my design to conceal my faults. : 自分の欠点を隠そうとする意図はなかった。
8. 《designs》たくらみ、陰謀｛いんぼう｝
・His designs against you were unearthed. : あなたに対する彼の陰謀が明らかになった。

引用元：“design”の検索結果（3635 件）：英辞郎 on the Web：スペースアルク

とまぁ、日本人が考える一般的な意味よりも幅が広い。

ものづくりをする上ではこれらを一緒くたに扱ってはいけない。分解して適切な言葉とし、それぞれのデザインについて作業を進める必要があると思っている。

ボクは下記のように考えている。

Grand Design（Master Plan）
目標・コンセプト。計画・構想。

Base Design
目標を達成するため、問題解決のための設計。

Expression Design
表現のデザイン。
かっこよくするため、使いやすいUIのための手段。

Engineering Design
機能のデザイン。
具体的な動作を実現するため、求める性能のための手段。

まずはGrand Design、次にBase Design。その後Base Designに従ってExpression Design、Engineering Designへと進んでいく。そしてこの4種のデザインそれぞれに最適な手法というものを「つくろうとしているもの」に合わせて的確に取捨選択をしていく。

例えばウェブサイトだと下記のような感じ。

Grand Design（Master Plan）
PVや登録数の向上、売上の向上。商品の紹介をもっとリッチに。大量の文章を見つけやすくしたい。

などなど、単純に利益に直結するような目標や、もっとああしたいこうしたいという要望になってくると思う。

この段階で必要なのはきっちりとしたブレーンストーミングやミーティング、ヒアリングだろう。そしてGrand Designを明確にビシッと決めて、後々プロジェクトメンバ全員での共有を目指す。

Base Design
次はベースとなるデザイン。具体的な設計段階へと進んでいく。Grand Designを実現するためにはどうしたらよいかを考える。ウェブサイト全体の情報アーキテクチャをしっかりと組むと共に、役割分担、スケジューリングなどプロジェクト運用についての具体的な準備も行う。

Expression Design
情報アーキテクチャを元に表現を検討・実現する。グラフィックデザインはもちろん、見つけやすさなども考慮する。他のスタッフが将来的にアサインされる可能性も考慮し、HTMLやCSSの可読性、汎用性を損なわないように気をつける。Grand Design、Base Designに応じたバランス感覚が大事。

Engineering Design
Base Designを元にシステムの設計・制作を行う。Expression Designと同様、プログラムの可読性、汎用性、バランス感覚は重要。

また、Expression DesignとEnginnering Designは密接に関係してくる。定期的なミーティング等、情報共有が必ず必要になってくる。

「デザイン」についてただ漠然としていてはダメ。目的、状況、手段、人などなど、それぞれに対して適切な「デザイン」を用いられるように心がけたい。

……まぁ、言葉で言うのは簡単で、現実はそんなうまくいかないんだけどね（涙）

We Choose the Moon- Pre-launch

40周年を記念してウェブとTwitterでミッションをリアルタイム中継するそうだ。

ずらっと今年の100冊。

amazonのダンボール箱でつくるA4ファイルケース【マゴクラ】ダンボールインテリア生活.

Aamazonから送られてくる商品を包んでいるダンボール。あれがどうにも過剰包装というか、今風に言うとエコじゃないというか、とにかく何となくもったいない気がしてしょうがない。と、同意してくれる人もいると思う。

そんなAmazonダンボールの有効活用。A4ファイルケースに大変身。

よく考えてあるなーすごい。

そのうち、Amazonで商品買ったら、組み立て説明書も同梱されるようになるんじゃないか（笑）

情報提供いただいた、対策版を入れてみた。
ちゃんと動いてるー。

WordPress › Support » [Plugin: WordPress Flickr Manager] Alternative to WordPress Flickr Manager?

しかし……なんだか妙なものが挿入されてるので削除。
それの対策版も有志によって作られている様子。

Update WordPress Plugins… profit! « fwaggle.org

後で試してみるかな。

Progressive Enhancement とは？日本語で訳してみました。　- Web制作系　867867.com.

0.まず、コンテンツを決める。文章？動画？音声？プログラム？なんでもいい。

1.それを配置する。テキストを書く？画像を設置する？動画を再生する？プログラムを動かす？

2.配置したもの装飾する。全体的なレイアウトは？文字の色、サイズは？画像に枠をつける？メニューはプルダウン？

3.最後にコンテンツと装飾を繋げる。画像表示でフェードインアウト効果つける？メニューはアニメーションさせる？XMLデータを同期的に扱う？

1.はHTML、2.はCSS、3.はJavaScriptといった感じ。もちろんこれらに加えてPHPとかFlashとかも入ってくるだろう。

とてもシンプル。だけどこういうのを意識するのとしないのとでは、クオリティはもちろん、完成後の可汎性に大きく影響する。計画的にデザインしよう。

A List Apart: Articles: Understanding Progressive Enhancement

これまでgTLD(*)は「.com」「.net」「.biz」など21種に限定されておりましたが、全世界のインターネットの監督する機関であるICANN(*2)によりgTLD自由化が認可され、例えば「.社名(.interlink)」や「.人名(.yokoyama)」、「地名(.tokyo)」などの名前が申請できるようになりました。

本コンテストでは、そのgTLD名を世界から募集し見事１位！に輝いたドメインは弊社インターリンクから正式にICANNへ認可申請を行い、その立案者には賞金及び、ドメインが１つ売れる度に弊社から報酬をお支払します。

引用元: WDC-ワールド ドメイン カップ開催！ | INTERLINK.

賞金10,000ドル。

1ドメイン売れるごとに1ドルが支払われる。

いくつか思い浮かんだけれど、応募は一人1つのみ。

ちなみに、

複数のお客様から同一の採用ネーミングでのご応募があった場合、賞金及び報奨金は有効な応募者全員での均等分配となります。

とのこと。

Google Translator Toolkit

これ、なかなかよさげ。

Webページの翻訳ができるのは当たり前としても、翻訳前と翻訳後を2ペインで表示して見比べることができる。どっちの言語でもテキストを選択するとそこにきちんと移動する。しかもうれしいのがローカルファイルをアップロード可能で、それを翻訳してくれる。

いやーこれで海外サイト読みやすくなるなー（笑）

デザイニング・ウェブナビゲーションが欲しい。

ウェブのナビゲーションについて、単発的なテクニックとかチュートリアルみたいな記事はよく見ているけれど、包括的に、体系的に学べるような情報はあまり無かった。なんとなくは分かっているけれど言葉に変換できないもどかしさ。これを言語化しデザインに落とし込んでいるような本、らしい。

うーむ、ついったったーの何人かに聞いてみたらなかなか良さげだし、注文してしまうかなー。

うーん、ちょっと困った。
これが無いと画像の公開が至極めんどい。
アップデート待つしかないかなぁ……（涙）

07/13/2009追記:
情報提供いただいたFlickr Manager WordPress 2.8対策版を試してみました。

最強のTODO管理(タスク管理)ツールとして話題の「Remember The Milk」 を徹底解剖！！Ajaxを駆使した神秘的とも言える脅威のインタフェースを備える操作性、atomフィード・rssフィード・iCalなどのアウトプット や公開APIを利用した他Webサービスとのマッシュアップなど、拡張性に富んでいるところも、今後の発展を期待させます。特に「Google Calendar(カレンダー)」や「Gmail」との連携はスケジュール、タスク管理を飛躍的に効率アップしてくれます。さらに、昨今ストレスフリーの仕事術(life-hack)で注目されている GTD(Getting Things Done)にも最適なツールなのです。そんな Remember The Milk の魅力をより多くの人に知ってもらうため、徹底的に掘り下げて紹介します。

引用元: Remember The Milk を徹底的に使い倒す！！ — Forgot the Milk.

前に登録して複雑そうだったからって敬遠していたけれど、なかなか便利だねRTM。

A showcase of sites using html5 markup

引用元: html5 Gallery | A showcase of sites using html5 markup.

先を見据えて今からチェックチェック！

どこでもいっしょ公式チャンネル 「とろ… – ニコニコチャンネル＆コミュニティ.

プレミアム会員を本気で考えたくなった。

ひろゆき＆夏野コンビが語る「日本のITよ、自信を持て」 (1/6) – ITmedia News.

うーむ……。

共感できるような話もあり、「なんだこいつら？」と思ってしまう面もあり。

喉に何か引っかかったような変な感じだ。