Gadgets & Widgets UI Guidelines | blog / bookslope
Consistencyというエントリーを読んだところで、UIパーツとしてガジェットないしウィジェットのガイドライン系をまとめたものがほしいと思ったので、いろいろ探して整理してみた。 Google Wave Wave Gadgets – The Complete Guide to Google Wave: How to Use Google Wave iGoogle iGoogle Developer’s Guide – Home – Google CodeiGoogle デベロッパー ガイド – Google Code Google Desktop Welcome – Google Desktop APIs – Google Codeようこそ – Google Desktop API – Google Code Windows Desktop Windows Desktop Gadgets
サイトマップを描いてみよう (CSS Nite LP7 Redux 03) | blog / bookslope
事前課題にあげた「サイトマップ」については、当日間近 (8/29) にあった第24回Websig24/7会議「100人で考える、理想的なサイトマップの形と標準書式」を参考にしてそこで得た知識をなるべく話そうとしました。 決して、「サイトマップ (ページ)」のことを指しているわけではありませんので、あえて「ページ」をつけています。 サイトマップとは Webサイトに掲載する情報を組織化し、その論理的な構造をツリー図として表現した資 料。�画面遷移のフローチャートとして使用できるように情報が付加されることもある。 このブログのエントリーでも書きましたが、Websig24/7会議の模様は下記エントリーを参照してください。 第一部発表で紹介したサイトマップ(一部)公開 (WebSig24/7) グループワークで作成したサイトマップ公開 (WebSig24/7) ここでも提出させてもらったサンプルがあ
フッターサイトマップのデザイン | blog / bookslope
6 Things To Include for a User Friendly Footer | UX Booth 「Key Footer Information」として、フッターの情報として重要な6つを取り上げています。もうどのウェブサイトを見てもこれらの情報は掲載されていると思いますし、ある意味デフォルト (標準値) であるとも言えます。 フッターに置く重要な要素 About Us Link/リンク (について)Contact Us Link/お問い合わせ (連絡先)Terms of Service/サイトの利用方法 (利用規約)Privacy Policy/プライバシーポリシー (個人情報の取り扱い)Site Map/サイトマップAddress and Phone Number/住所や電話番号 ただし、このうち「サイトマップ」については、単にサイトマップページへのリンクを置くこともそ
効果的なプロトタイピングとデザインプロセス | blog / bookslope
「ワイヤーフレーム」「プロトタイピング」という言葉は仕事がら慣れ親しんだものではあるのですが、意外と突き詰めて考えると奥が深いことに驚きます。 先日参加してきた「IA Summit 2009」のワークショップセッション「Integrating Effective Prototyping into Your Design Process」でFred Beecher氏が「プロトタイプは2枚以上あって相互に行き来が可能なもの」と話されていました。たしかに「ワイヤーフレーム」と言うと1枚絵のようなものを想像する人も中にはいるかも知れません。 ワイヤーフレームを絵としてとらえるのか試作品としてとらえるのかで解釈の違いが発生します。これもずっとある課題ではあるのですが、Fred Beecher氏のセッションでは「Visual (絵)」と「Functional (機能)」の2軸で整理してありましたので参
Get Wireframing and Prototyping | blog / bookslope
Fred Beecher氏は「Axure」についてもワークショップを開いていたりするようですが、これに関係して「ワイヤーフレーム」や「プロトタイピング」に関するエントリーがあったのでご紹介します。 まず「Get Wireframing」という下記エントリーですが、すごいですね。よくまとめたなと感心してしまいます。 Get Wireframing: The All-In-One Guide | Hi, I’m Grace Smith 内容は下記のアウトラインになっているので、すべてがいいリファレンスになりますな。 「Article」などは個別に集めてたまに読む程度だったのですが、まとまっているのでいつでも参照できます。 TechniquesToolsWireframe ExamplesWireframing Articles of InterestPaper PrototypingUsefu
loftwork college: プロジェクトデザインから見るIA | blog / bookslope
少し前 (2/24) になりますが、ロフトワークの「loftwork college」でWebディレクションをされている方対象に、IAについてお話をさせていただきました。場所は「loftwork Ground」というスペースでした。 Webクリエイター必読！ 「プロジェクトデザインから見るIA」 坂本貴史 ｜ Features 特集 [loftwork.com] ロフトワークといえば、PMBOKをベースにした「Webプロジェクトマネジメント標準」の著書である林さんが社長をつとめている会社ですが、その林さんとその友人である浅野さんから今回の話をいただきました。話の内容は、それより前にSINAPさんでお話させていただいた、いわゆるWeb構築時におけるIA的視点のお話をしました。 いつも話のはじめに出すのは「The Elements of User Experience」と「The Nine P
[WebSig24/7] IA分科会 ライブIAとグループワーク | blog / bookslope
「ライブIA」をしたら面白いかも、というアイデアからはじめたこのIA分科会は、なんとか無事に終えることができました。WebSigの運営者や参加していただいた皆さん本当にありがとうございました。そしてお疲れさまでした。 思い返してみると、これまでのプレゼンはスライドをつくることにそれなりの時間を要して取り組んでいたのですが、今回はスライドはありませんでした。その場でブラウズする画面とクロッキー帳に手書きで描いた自分のヘタクソな字だけです。それがお客さんにとってベストプラクティスだったかどうかはわかりませんが、自分の考えていることを口に出して頭の中にある図を実際に描いてみることで、思考工程を可視化するにはちょうどよかったかと思います。 ということで、ちょっとだけ補足というかなにを伝えたかったのかを書き留めておきます。 第一部 本邦初公開! リアルタイムにIAの思考を追うライブIA お題は、「東
![[WebSig24/7] IA分科会 ライブIAとグループワーク | blog / bookslope](https://cdn-ak-scissors.b.st-hatena.com/image/square/aa5d186f87121e346835c298e8b224b734336344/height=288;version=1;width=512/https%3A%2F%2Fbookslope.jp%2Fblog%2Fwp-content%2Fuploads%2F2009%2F01%2F12_large-1.jpg)
Carousel | blog / bookslope
最近よく目にする、いくつかの要素がローテーションするナビゲーションのことですが、「カルーセル」という呼び名があります。 「回転木馬 (?)」という意味ですかね。もちろん「カルーセル麻紀」ではなく (なぞ)。 UIパターン系サイトでも同じように取り上げられているのでご紹介します。 Carrousel – Interaction Design Pattern Library – Welie.com Carousel – UI-patterns.com Carousel Pattern – Yahoo! Design Pattern Library 下記に詳しい説明が載っていました。 Carousel Design Pattern >> Yahoo! User Interface Blog Use When Use when the user’s mental model of a topic
Pencil Project | blog / bookslope
「Web情報アーキテクチャ（IA）とツール」の連載第二回を公開されました。 第2回 ワイヤーフレームと設計ツール これを書き終えたとき、「IxDA Discussion」を見ていたら面白いツールが紹介されていました。 Pencil Project これは、「open-source wireframing Firefox add-on」として紹介されていて、下記のリンクから見ることができます。 IxDA Discussion: Pencil: open-source wireframing Firefox add-on インストールしてみるとわかりますが、Firefoxのadd-onツールです。 つまり、Firefox上で簡単なGUIを作成することができるツールです。しかも無料です (って別に営業してるわけではないけど)。 メニューはもちろん英語なんですが、中のドキュメントとしては日本語も使
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
