life x web Technology Design » デザイン http://www.lifexweb.com/tech コミュニケーションとテクノロジーを考えるブログ Fri, 18 Nov 2011 00:59:56 +0000 ja hourly 1 http://wordpress.org/?v=3.2.1 [デザイン]IDEO HCD(Human Centered Design)が公開されています！ http://www.lifexweb.com/tech/2010/01/%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3ideo-hcdhuman-centered-design%e3%81%8c%e5%85%ac%e9%96%8b%e3%81%95%e3%82%8c%e3%81%a6%e3%81%84%e3%81%be%e3%81%99%ef%bc%81/ http://www.lifexweb.com/tech/2010/01/%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3ideo-hcdhuman-centered-design%e3%81%8c%e5%85%ac%e9%96%8b%e3%81%95%e3%82%8c%e3%81%a6%e3%81%84%e3%81%be%e3%81%99%ef%bc%81/#comments Wed, 13 Jan 2010 01:45:41 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=387 hdc
有名なデザインの会社であるIDEOがIDEO HCD(Human Centered Design)というユーザー中心設計に関するドキュメントを公開しています。

http://www.ideo.com/work/item/human-centered-design-toolkit/

90ドルでハードカバー（50ドルでソフトカバー）が買えるのですがPDF版に関してはメールアドレスを登録するだけでダウンロードが可能です。

これはハンズオンでユーザー中心設計実現する手引書と、それに利用される用紙やカードなどの「ツールキット」からなります。

昔ユーザビリティのことについて仕事で関わっていたことがあるのですが、こういうのってTipsレベルの積み重ねで済む話ではなくて、ちゃんと人として人の事を考えられているかどうか、そしてそれを実践出来ているかどうかなんですよね。

社内でも共有したいと思います。

]]> http://www.lifexweb.com/tech/2010/01/%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3ideo-hcdhuman-centered-design%e3%81%8c%e5%85%ac%e9%96%8b%e3%81%95%e3%82%8c%e3%81%a6%e3%81%84%e3%81%be%e3%81%99%ef%bc%81/feed/ 0 手品とインターフェイスの共通点 http://www.lifexweb.com/tech/2009/10/%e6%89%8b%e5%93%81%e3%81%a8%e3%82%a4%e3%83%b3%e3%82%bf%e3%83%bc%e3%83%95%e3%82%a7%e3%82%a4%e3%82%b9%e3%81%ae%e5%85%b1%e9%80%9a%e7%82%b9/ http://www.lifexweb.com/tech/2009/10/%e6%89%8b%e5%93%81%e3%81%a8%e3%82%a4%e3%83%b3%e3%82%bf%e3%83%bc%e3%83%95%e3%82%a7%e3%82%a4%e3%82%b9%e3%81%ae%e5%85%b1%e9%80%9a%e7%82%b9/#comments Fri, 16 Oct 2009 00:58:47 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=355 「インターフェイス」といえばアプリケーションなどで実際にユーザーの目に触れる、サービスの重要な要素のひとつです。

僕も少しの間画面設計やユーザビリティのコンサルタントのお仕事をさせていただいていた期間があるのでちょっと使いづらかったりすると解決法を考えちゃったりします。

（実際には裏側の概念まで指しますが）インターフェイスというと目に見える部分が多く、サービスの質を左右するので設計者はプロとして腕の見せ所なんですが、意外にも「手品」の概念が似ている、とのことです。

勘違いをしやすいという点は、逆に考えるとイリュージョンを見る能力があるという長所だと考えることもできます。計算機システムの入出力が多少いい加減だとしても、人間のこの「長所」のおかげでそれなりに使えているものは多いでしょう。例えばマウスでカーソルを動かすとき、カーソルの位置は離散的にしか動きませんが、人間の目にはなめらかに動くように見えます。（中略）

GUI をはじめとする計算機のインタフェースは完全に手品的なものであり、ユーザが積極的に騙されることによって、わかったような気になって計算機を利用することができるようになっているというわけです。表示されているアイコンとハードディスク内のデータはどういう関係なのだろう？などといちいち悩んでいたらパソコンで仕事など不可能でしょう。（第36回 手品とインタフェース／増井俊之の「界面潮流」）

現在僕自身もプログラミングをメモリの０と１から勉強しなおしていますが、実際に利用するユーザーはそんなことを意識することは無くて、長い年月をかけて高度に構築されたイリュージョンの上で利用しています。

もちろんそのイリュージョンが最終的にユーザーの感覚に依存しすぎてしまったり、中身が出すぎてしまったりしていれば予期しない動きや使いづらさにつながってしまうのでイリュージョンの設計から学ぶことは多そうです。

]]> http://www.lifexweb.com/tech/2009/10/%e6%89%8b%e5%93%81%e3%81%a8%e3%82%a4%e3%83%b3%e3%82%bf%e3%83%bc%e3%83%95%e3%82%a7%e3%82%a4%e3%82%b9%e3%81%ae%e5%85%b1%e9%80%9a%e7%82%b9/feed/ 0 WPtouch導入しました http://www.lifexweb.com/tech/2009/10/wptouch%e5%b0%8e%e5%85%a5%e3%81%97%e3%81%be%e3%81%97%e3%81%9f/ http://www.lifexweb.com/tech/2009/10/wptouch%e5%b0%8e%e5%85%a5%e3%81%97%e3%81%be%e3%81%97%e3%81%9f/#comments Sat, 10 Oct 2009 12:54:09 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=350 このサイトはWordPressを利用しているのですが、iPhoneも買ったのでiPhone/iPod touchに対応させました！

wptouch
WPtouchというプラグインを使っています。
インストールするだけなので簡単です。

WPtouch iPhone Theme

]]> http://www.lifexweb.com/tech/2009/10/wptouch%e5%b0%8e%e5%85%a5%e3%81%97%e3%81%be%e3%81%97%e3%81%9f/feed/ 0 iPhoneアプリ開発に便利なもの３つ http://www.lifexweb.com/tech/2009/10/iphone%e3%82%a2%e3%83%97%e3%83%aa%e9%96%8b%e7%99%ba%e3%81%ab%e4%be%bf%e5%88%a9%e3%81%aa%e3%82%82%e3%81%ae%ef%bc%93%e3%81%a4/ http://www.lifexweb.com/tech/2009/10/iphone%e3%82%a2%e3%83%97%e3%83%aa%e9%96%8b%e7%99%ba%e3%81%ab%e4%be%bf%e5%88%a9%e3%81%aa%e3%82%82%e3%81%ae%ef%bc%93%e3%81%a4/#comments Sat, 03 Oct 2009 09:40:08 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=339 iPhoneアプリの開発って夢がありますよね。技術的にも金銭的にもw

そこでiPhoneアプリの開発に役立ちそうなもの3つご紹介。

1. iPhoneステンシル

iphonee382b9e38386e383b3e382b7e383ab
iPhone Stencil (アクト・ツー)

簡単に言うとiPhoneの画面イメージの裸婦を描く事ができる定規、なんだけど、すごくスタイリッシュで便利そう。残念ながら現在売り切れ中なので足しげく通って次の入荷を期待しましょう。

2. iPhoneアプリ開発に欠かせないノート；Notepod

iphone2
iPhone用のノート：Notepod(http://notepod.net/)

iPhoneのインターフェイスをしたメモパッド。

画面の開発などに便利そうですね。

最後は開発するためのモックアップをつくるためのテンプレート

３．モックアップテンプレート；MockApp

iphonemockapp
モックアップ作成に便利ですね。

PowerPoint版とKeynote版があります。

フリーではなくtwitter等で紹介するコントリビュートウェアなので利用する場合は是非協力を。

]]> http://www.lifexweb.com/tech/2009/10/iphone%e3%82%a2%e3%83%97%e3%83%aa%e9%96%8b%e7%99%ba%e3%81%ab%e4%be%bf%e5%88%a9%e3%81%aa%e3%82%82%e3%81%ae%ef%bc%93%e3%81%a4/feed/ 0 クリエイターとクライアントをシームレスにつなぐテクノロジー http://www.lifexweb.com/tech/2009/09/%e3%82%af%e3%83%aa%e3%82%a8%e3%82%a4%e3%82%bf%e3%83%bc%e3%81%a8%e3%82%af%e3%83%a9%e3%82%a4%e3%82%a2%e3%83%b3%e3%83%88%e3%82%92%e3%82%b7%e3%83%bc%e3%83%a0%e3%83%ac%e3%82%b9%e3%81%ab%e3%81%a4%e3%81%aa/ http://www.lifexweb.com/tech/2009/09/%e3%82%af%e3%83%aa%e3%82%a8%e3%82%a4%e3%82%bf%e3%83%bc%e3%81%a8%e3%82%af%e3%83%a9%e3%82%a4%e3%82%a2%e3%83%b3%e3%83%88%e3%82%92%e3%82%b7%e3%83%bc%e3%83%a0%e3%83%ac%e3%82%b9%e3%81%ab%e3%81%a4%e3%81%aa/#comments Tue, 29 Sep 2009 08:04:11 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=327 どの時代になってもクリエイティブは人の手によって生み出されますが、商業クリエイターの場合、必ず依頼主がいて、コミュニケーションをとりながら作成していきます。

クリエイターとクライアントは通常であればメールなどでやりとりをすると思いますが、今年のTechCrunch50にノミネートされた「Clientshow」はそれをずっとリッチなインターフェイスで置き換えています。


サービスはいくつかのモジュールに分割されている。1つはすべての作品をアップロードするためのもので、もう1つはユーザーが作品を確認して、コメント や承認を含めメモを残すためのものだ。3つめのモジュールはプレゼンテーションモードで、クライアントにファイルをそのままデモして見せることができる。 （CNET Japan）

ウェブアプリケーションの開発進捗確認などのテクノロジーも今後出てくるとおもしろいですね。

]]> http://www.lifexweb.com/tech/2009/09/%e3%82%af%e3%83%aa%e3%82%a8%e3%82%a4%e3%82%bf%e3%83%bc%e3%81%a8%e3%82%af%e3%83%a9%e3%82%a4%e3%82%a2%e3%83%b3%e3%83%88%e3%82%92%e3%82%b7%e3%83%bc%e3%83%a0%e3%83%ac%e3%82%b9%e3%81%ab%e3%81%a4%e3%81%aa/feed/ 0 twitter風のロゴ作成-twitlogo http://www.lifexweb.com/tech/2009/08/twitter%e9%a2%a8%e3%81%ae%e3%83%ad%e3%82%b4%e4%bd%9c%e6%88%90-twitlogo/ http://www.lifexweb.com/tech/2009/08/twitter%e9%a2%a8%e3%81%ae%e3%83%ad%e3%82%b4%e4%bd%9c%e6%88%90-twitlogo/#comments Sun, 09 Aug 2009 13:05:31 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=299 twitlogo
最近更新できていないので軽めのエントリー。

勉強のつもりでプログラムの本を開いてウェブサービスなんかをポチポチつくっていると、完成するんだけどなんだか味気ないのっぺりとした画面になりがち。

せめてロゴだけでもテンションあげよう、という事で最近ハマっているのがtwitter風のロゴがつくれる「twitlogo」。

twitterと同じフォントでロゴをつくってくれます。かわいいので一気に雰囲気が変わります。

大きさや色をオプションで指定する事もでき、最後はpngでダウンロード。

いまいちシンプルな画面でしっくり来ない方は是非。

twitlogo
http://www.twitlogo.com/

]]> http://www.lifexweb.com/tech/2009/08/twitter%e9%a2%a8%e3%81%ae%e3%83%ad%e3%82%b4%e4%bd%9c%e6%88%90-twitlogo/feed/ 0 GooglePageCreator→GoogleSites http://www.lifexweb.com/tech/2009/06/googlepagecreator%e2%86%92googlesites/ http://www.lifexweb.com/tech/2009/06/googlepagecreator%e2%86%92googlesites/#comments Thu, 04 Jun 2009 05:50:46 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=286 googlesites
だいぶ前からアナウンスありましたが、GooglePageCreator
がなくなってGoogleSitesに統合されるらしいです。

たまには使ってみようかな、、、？

]]> http://www.lifexweb.com/tech/2009/06/googlepagecreator%e2%86%92googlesites/feed/ 0 パッケージデザインとテクノジーの共通点 http://www.lifexweb.com/tech/2009/05/%e3%83%91%e3%83%83%e3%82%b1%e3%83%bc%e3%82%b8%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3%e3%81%a8%e3%83%86%e3%82%af%e3%83%8e%e3%82%b8%e3%83%bc%e3%81%ae%e5%85%b1%e9%80%9a%e7%82%b9/ http://www.lifexweb.com/tech/2009/05/%e3%83%91%e3%83%83%e3%82%b1%e3%83%bc%e3%82%b8%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3%e3%81%a8%e3%83%86%e3%82%af%e3%83%8e%e3%82%b8%e3%83%bc%e3%81%ae%e5%85%b1%e9%80%9a%e7%82%b9/#comments Mon, 11 May 2009 04:46:53 +0000 Hideya Kato http://www.lifexweb.com/tech/?p=255 たまに海外ネタ（これでも英語できます、、、苦笑）

突然なんですが僕はパッケージデザインが大好きです。

webdesigner depotに
「きれいかつ効果的なパッケージデザイン50」
が紹介されていました。

>>50 Beautiful and Effective Package Designs (webdesigner depot)

package1
package2
package3
たまに商品を買ったときのパッケージがすごく
ユーザーのこと考えつつすごく理にかなった仕組みに
なっていたりすると興奮しちゃいます。

機能的かつシンボリックな形でものを表現すること

これってテクノロジーでもそうじゃないですか？

]]> http://www.lifexweb.com/tech/2009/05/%e3%83%91%e3%83%83%e3%82%b1%e3%83%bc%e3%82%b8%e3%83%87%e3%82%b6%e3%82%a4%e3%83%b3%e3%81%a8%e3%83%86%e3%82%af%e3%83%8e%e3%82%b8%e3%83%bc%e3%81%ae%e5%85%b1%e9%80%9a%e7%82%b9/feed/ 0