- 2007-08-27 (月)
- website
大阪、東京にある「ハーズ実験デザイン研究所」の Web サイト。お恥ずかしながら社名は初めて知ったのですが、掲載されている製品は AXIS 等のプロダクト系雑誌を開けば載っている類いのハイデザインなプロダクトばかり。自分は大学でプロダクト専攻だったりしたので、それだけで興味津々ですが、サイト自体も丁寧に作られていて、楽しい操作体験を楽しめました。
制作はいつもいろいろお世話になっている大阪の gd | genephics design,Inc. 様。尚、gdさんのサイトのロゴは、（って言っていいんでしたっけ？）
プロダクト写真という良素材が既にあるので、UI 周りはシンプルでモノトーンなパーツなのですが、デザインと機能面の両立ができていると気持ちがいいですね。
左にレイアウトされたサムネイルメニューは Mac でもマウスホイールでペチペチ（SE）ブラウジングできます。サムネイルのレイアウトの仕方もちょっと新鮮。
かつ、各プロダクトには、タイムラインというか再生時間みたいなものがあって、一定時間で次々再生させていくスライドショー形式。そのスライドショーとユーザーブラウジングが上手に統合されています。
その統合具合が、ユーザー側がちょっとその法則性を意識して見ないと把握できない感じの UI なんだけど、このサイトはデザイン＆プロダクト、しいては UI に興味がある人が訪れるサイト、「その法則性を探るのが楽しみ」みたいな人が多そうだし効果的。直感的かつ提案的な UI。海外ですと group94 さんがよく見せてくれるアプローチですね。
もちろん部外者なので裏側のことは分かりませんが、たぶん商品追加等、管理しやすい仕組みになっていたり、背景写真の明暗にあわせて文字の白黒の表示もされているし、製品ツアー以外のコンテンツのバックグラウンドは訪問ユーザー共有型だったり（今夜中なので僕一人、こないだ二人ぐらいいたような）、スクロールバーとか SE とか動的アドレスとか、とにかく丁寧に作られていてすごいなぁと。
ここから話は脱線します
FLASH でフォントの話
日本の FLASHer は２バイト文字のせいでだいぶ損をしてて、余計な作業、デザイン的妥協を強いられていると、FLASH やってる人と集まると嘆いています。かといって日本語フォントを埋め込んだ swf は現実的ではないので、Ming みたいにサーバー側に自由に置いて、動的に使える、権利的に完全フリーな、それなりのフォントを Adobe さんが提供してくれたら、Flash への愛はさらに深まり、ユーザーも増えるのではないかと、ふと思いました。いや、しらんけど。"_ゴシック"は正直しんどいです。
角Rの話
角Rの矩形を作るのは、静的ページよりも Flash の方が楽に作れることもあり、わりと気軽に使うのだけど、いざ自分がデザインする場合に、一体どれだけ丸めればいいのかいつも迷います。
一応画面全体を見ながら R の値を決めますが、正直僕には 3px と 5px の 角R の適切な使い分けができません。世間のデザイナーと呼ばれる人は、この使い分け＆説明ができる方々なんですか？僕はプログラマではないし、デザインにも興味があるので、できればデザイナーを名乗りたかったりするのですが、そういうスキルが全くないので、どうやったらそういう目を持てるのかを知りたいです。
で、僕は角を丸める時、最近ではどうしているかというと、ファーストオプションが「trick7 やし、7px で丸めとくか！」、で、画面デザイン的に要検討な場合「デザインには無関係やけど、とりあえず素数にしてみるか！」みたいなことをしてしまっています。あ〜あ、言っちゃった。
ただ、±0（プラスマイナスゼロ）のプロダクトは、角R を 2.5mm に統一されているそうなので（←深い考察の結果ですが）、僕も「trick7だし7px」でゴリ押ししてやろうかと、僕のダークサイドは囁いています。
- Newer: 今日は第6回「大阪てら子」ですね
- Older: ブログを更新する気になる１の方法
Comment:2
- makoche 2007-08-27 (月) 19:18
-
どうも、寺くん こんにちわ。
お久です。
東京生活も板についてきたみたいですね。＞尚、gdさんのサイトのロゴは、
全然気にしないでいいですよ。 - tera 2007-08-27 (月) 20:14
-
＞makoche様
お久しぶりです。ご本人様のコメント、ありがとうございます。
こちらのお仕事は、WebDesigningを何気なく読んでたら、クレジットのお名前が目に飛び込んで来て発見しました。＞東京生活も板について
エスカレーターは無意識的に左に並ぶように習慣付いてきましたw今後ともよろしくお願いします。
Trackback:0
- TrackBack URL for this entry
- http://www.trick7.com/blog/mt-tb.cgi/610
- Listed below are links to weblogs that reference
- hers design tour from trick7.com blog
![FLASH ActionScript 2.0入門完全ガイド+実践サンプル集 [CD-ROM付]](http://images.amazon.com/images/P/4881664573.01._SCTHUMBZZZ_.jpg)
