Tagged

UI

A collection of 74 posts

UI

変わりゆく「保存」の存在

アプリケーションに必ずあるコマンドのひとつに「保存」があります。このメタファーとしてフロッピーディスク [http://tinyurl.com/2xnvon] が長く採用されています。採用された当時は「フロッピーディスクのアイコンがあるから何かを記録するものだろう。よってこれは保存するという意味だ」と関連づけすることが出来たと思いますが今はその逆で「保存をするには、このアイコンをクリック」という認識になっているかと思います。 フロッピーディスクが姿を消してしばらく経ち、知らない人も多いのにも関わらず、このメタファが使われ続けられているのも、ひとつの理由として、アイコンが意味を示すものではなく、意味を示すためのアイコンになり、広く認知されているからかもしれません。 Office 2007 [http://www.amazon.co.jp/gp/product/B001GCUTW0?ie=UTF8&tag=could-22&linkCode=as2&camp=247&creative=7399&creativeASIN=B001GCUTW0]
UI

Canvas for OneNoteの感覚的な情報整理

Office Labs [http://www.officelabs.com/]では、Microsoft Officeの使い方を変えるかもしれない興味深いプロトタイプを幾つか公開しています。映像や画像だけのコンセプトもありますが、実際ダウンロードして使うことが出来るのもあります。情報の見せ方でありそうでなかったものが、 OneNote [http://www.amazon.co.jp/gp/product/B000JQJPUG?ie=UTF8&tag=could-22&link_code=as3&camp=767&creative=3999&creativeASIN=B000JQJPUG] 用のアドオンソフト「Canvas for OneNote [http://www.officelabs.com/projects/canvasforonenote/Pages/
IA

各プロトタイピングの長所・短所

ウェブサイト制作でもプロトタイプを作成する機会が増えてきたと思います。しかし、プロトタイプ一言でいっても様々な方法で作ることが出来ます。今まで 様々な種類のプロトタイピング [http://www.yasuhisa.com/could/?s=%E3%83%97%E3%83%AD%E3%83%88%E3%82%BF%E3%82%A4%E3%83%97] を紹介したことがありますが、どの方法を使った方が良いか迷うところです。短時間で作れるかどうかだけでなく、誰と共有するのか、変更がしやすいか、完成品とどれくらい近づけるのかなど考慮したい項目は幾つかあります。Adobe Dev Center の「Industry trends in prototyping [http://www.adobe.com/devnet/fireworks/articles/
UI

UIデザインガイドラインのまとめ

デザインガイドラインは、実際同じようなガイドラインを作るときだけでなく、UIデザインを考える際にも役立つ貴重な資料です。今まで個別で紹介したことはありますが、今回は一挙にまとめてリストアップしてみました。 Introduction to Apple Human Interface Guidelines [http://developer.apple.com/documentation/UserExperience/Conceptual/AppleHIGuidelines/XHIGIntro/chapter_1_section_1.html] 個人的に UI デザインガイドラインといえばこれ。日本語訳 [http://potting.syuriken.jp/potting_conv/XHIG_J/XHIGIntro/chapter_1.html]も大変便利です Apple User Experience Guides [http://developer.apple.com/
UI

10年以上前からあったライフストリーム

ライフストリーム [http://www.atmarkit.co.jp/fwcr/column/ore01/01.html] (Lifestream) といえば去年あたりからよく耳にするようになった言葉。様々な利用者のネット活動をリアルタイムに追うことが出来るライフストリーム。FriendFeed [http://friendfeed.com/yhassy]のようなサービスを使って複数の利用者の活動を観覧することも出来ますし、自分で作る [http://www.yasuhisa.com/is/lifestream/]ことも可能です。 最近出てきた情報の見せ方なのかと思っていましたが、10年以上前から「ライフストリーム」とい言葉は同じような意味合いで使われていたみたいです。イェール大学では、1996年に The Yale Lifestreams Project [http://cs-www.cs.yale.edu/homes/freeman/lifestreams.html] というプロジェクトを立ち上げています。「Lifestream とは」
UI

サイト制作に便利なOmniGraffleステンシル

制作メンバーの体勢やスケジュールによっては HTML でプロトタイプを作ることがありますが、そうでない場合はワイヤーフレームを OmniGraffle [http://www.omnigroup.com/applications/omnigraffle/] で作っています。 OmniGraffle では、オブジェクトを揃えたり調整が簡単ですし、マルチページにも対応しているのでクリックしたら別ページに移動といった効果も作れます。もちろん書き出した PDF もクリック可能なマルチページになっているので、他の方との共有した際もページの遷移がみえやすいです。レイヤーの表示・非表示といったアクションもオブジェクトに充てることが出来るので、ダイナミックなページも表現出来なくはないですが、レイヤーの表示・非表示は PDF に書き出した際になくなってしまうのが残念。Professional版 [http://www.omnigroup.com/applications/omnigraffle/provsstandard/] ではプレゼンテーションモードがあるので、出先で OmniGraffle を使
UI

iPhoneから学ぶユーザビリティの極意

iPhoneは、今までとは少し違った使い方や考え方を必要とするデバイスです。Appleらしい使いやすくするための工夫が随所見られますが、だからと言って万人受けするわけでもありませんし、僕のような Mac 使いとそうでない方とでは iPhone の捉え方は随分違います。Create with Context [http://createwithcontext.com/]はデザインリサーチを行っている会社で、iPhone 3G が発売された夏頃に iPhone のユーザーテストを行ったそうです。その結果は SlideShare に掲載されている「How people really use the iPhone [http://www.slideshare.net/createwithcontext/how-people-really-use-the-iphone-presentation/] 」で読むことが出来ます。 iPhoneを聞いたことあるけどほとんど触ったことない方や、聞いたことなくて初めて使う方など、僕のようなヘビーユーザー以外を対象に行われたこの調査。タスク別に調査やインタビ
UI

3D空間でブラウジングするツールいろいろ

TiltViewer [http://www.airtightinteractive.com/projects/tiltviewer/app/]Flickr の写真を 3D 空間にタイル状に並べる UI。マウスを動かすことによって角度を変えることが出来ます。Tag Galaxy [http://taggalaxy.de/]Flickr のデータを使ったサイト。タグに関連した写真を太陽系の惑星のように表示させることが出来ます。 NewsGlobe [http://next.yahoo.net/download/newsglobe/index.html]Yahoo! News の記事を 3D の地球上に表示させ、どの地域のニュースが多く取り上げられているかも分かるようになっています。Cooliris [http://www.cooliris.com/]フルスクリーンで膨大な量の写真を観覧可能にする Firefox のプラグインsearch-cube [http://www.search-cube.com/] 検索結果を立方体に表示させます。