タグ

webdesignとUIに関するjazzanovaのブックマーク (10)

  • Design Explorations by 37signals

    A series of design explorations across 37signals products By Jason Zimdars, designer at 37signals One of the first projects for me as a new designer at 37signals is to take a fresh look at a series of features and screens in the company’s applications. These individual pieces are ones that we know can be better but haven’t made it onto anyone’s plate yet. Much like the Highrise Contacts exploratio

  • メガメニューはサイトナビゲーションに効果あり

    大きな二次元のドロップダウンパネルは、ナビゲーションの選択肢をグループ化することでスクロールの必要性を無くし、タイポグラフィやアイコン、ツールチップを使うことで、ユーザの選択できる内容をわかりやすく提示してくれる。 Mega Menus Work Well for Site Navigation by Jakob Nielsen on March 23, 2009 もうすぐ開催予定のナビゲーションデザインセミナーに向け、我々は様々なナビゲーション機能についてのユーザスタディを実施している。いつものことだが、中にはひどい結果が出てしまった機能もあるし、これまた、いつものことだが、今、流行のようになっている機能(今回の場合はタグクラウド)にはユーザビリティ上の大きな課題が見つかった。 幸いにも、他のウェブトレンドは質的にユーザビリティに優れており、ユーザの行動やゴールによく合っているというこ

    メガメニューはサイトナビゲーションに効果あり
  • The Tabbed Breadcrumb Navigation

  • CMSとモバイルとフィードと四畳半社長: ajaxとユーザーインターフェースデザイン

    東京都文京区郷でとあるCMS開発会社を営む社長のブログ。さっきまで「越後のCMS問屋」だったのですが、会社が新潟に移転したと勘違いされたようなので変えました。 モバイル、ゲーム、フィード、Ajax、Flash、ハイテクグッズあたりのはやりモノが好きです。 最新作「メルルーの秘宝」がドワンゴから提供中 週刊アスキーで「2045年の週刊アスキーをつくる」連載中 先日、RSSリーダーをもっと使った方がいい、いや、使うべきだ、みたいな話を(もの凄くイマサラなんですけど)、某所で行った際、とりあえずインストールもいらなくて便利なRSSリーダーといえばlivedoor Readerでしょうとハイテク好きな小娘にレコメンドしてみたりしたのです。当ブログの読者様も、LDRユーザーはかなり多いみたいですしね。MacならSafariに入ってるRSSリーダーが必要にして十分快適なんですけどね。 live

  • 第18回 ユーザー・インタフェース作りに必要なマーケティング感覚

    Webアプリケーションを開発する際に,対象ユーザーを考慮することの大切さについて見てきました。今回は,ユーザー・インタフェース(UI)設計にも,マーケティング感覚が必要なことを考えてみましょう。 UIの問題点を改善していく手順 例によって航空券の予約をサンプルに使います。下記の画面をご覧ください。このWebアプリケーションには,様々なオプションを付け加えることができます。しかし,必要最小限の情報は,「搭乗日」と「出発地」と「到着地」の三項目だけです。このUIに,どこか問題はないでしょうか。 (1) 日付部分への改良 まず注目してほしいのは,搭乗日という日付情報をユーザーにすべて入力させている点です。日付情報をユーザーにまかせ切ってしまうと,表記が統一されず,結局のところシステムでそれを補う処理が発生してしまいます(たとえ「2006/08/02」などと「例」を明記しても,半角文字と倍角文字と

    第18回 ユーザー・インタフェース作りに必要なマーケティング感覚
  • Webデザイン エンジニアリング 第16回 ボタンを押させるテクニック:ITpro

    対象とするユーザーの“慣れや知識”によって,画面の構成を変えたほうが伝わりやすいとするならば,画面上の「ユーザー・インタフェース(UI)部品」の色や形状も,ユーザーに応じて変えるべきでしょう。今回は,代表的なUI部品でありながら,なかなか作り手の思うように押してくれない「ボタン」について考えます。 わかりやすいボタンの形状はユーザーによって違う まず,前回とほぼ同じ絵を用います。Webシステムの操作方法への「熟知度(PCリテラシ)」を縦軸,「提供したいサービスに対する知識」を横軸とします。そして,それぞれの「軸」に対して,受け入れやすいと思われる「ボタン」の形状を例記しました。 上図の【A】や【B】のタイプに当てはまるPCリテラシの高いユーザーは,ボタンの“ラベル”に「submit」と書かれていようが「GO」と書かれていようが,ボタンを認識することはさほど苦ではありません。 しかし,PC

    Webデザイン エンジニアリング 第16回 ボタンを押させるテクニック:ITpro
  • ホイールを回すと写真がぱらぱら (モイモラ)

    ホイールを回すと写真がぱらぱら切り替わります これリクルートのマッシュアップ・コンテスト経由で知った作品です。ちょっと面白くないですか?僕は声にして笑っちゃいましたよ。取りためた定点観測の写真群(坊主~長髪への進化)をコレで実装したい。 ちなみマッシュアップ・コンテストは諦めました。かなり考えたのですが、IFを工夫したいだけのとか、ただの串刺し検索で終っちゃってるのとか、その程度のモノばかりなので・・・。アイディアで勝負したかったです。そういう意味じゃ結果発表が楽しみです。どんなんが優勝するんだ?どきどき。僕も参加賞のマウスが欲しいので作りかけを今月中に提出しますぞ。

  • ウェブページを見る目の動きは「F」パターン - GIGAZINE

    つまり人間はページを見る場合、「F」の字を描きながらページ全体を見ているというわけ。 これは232人の被験者を対象に行われたもので、大体1ページから重要なコンテンツを見つけるために2秒から3秒というものすごい短時間に驚異的な速度でページを見ていくそうで。 で、その視線の経路をビジュアル化したのがこの画像。全部で3段階のステップを踏んでおり、各段階を踏んでいった結果、「F」の字を描くというわけ。大体どのユーザーも一貫してこのパターンを踏んでいるらしい。以下がその全3段階の説明。どういうレイアウトが効果的なのかが分かります。 F-Shaped Pattern For Reading Web Content (Jakob Nielsen's Alertbox) http://www.useit.com/alertbox/reading_pattern.html 第1段階: 訪問者は最初にページの

    ウェブページを見る目の動きは「F」パターン - GIGAZINE
  • うつわとしての Design

  • 分裂勘違い君劇場 - 見た瞬間に使い方の分かるユーザインタフェース

    「初心者にわかりやすいGUI」については、この記事のid:naoya氏の気持ちは、分かる気がします。 まず、プロのGUIデザイナーと実プロダクトの仕様について議論すると、ほとんど必ずと言っていいほど議題に上がるのが、「とっつきやすや」と「機能性」のトレードオフ。 よく、回すべきなのかスライドべきさせるのか、押すんだか引くんだかよく分からないドアというのがある。ドアのどちら側を押すべきなのかも分かりにくいことも多い。それは、ユーザインタフェースが、self explanatory(自己説明的)じゃないからだ。これは、よくユーザインタフェースの設計ミスの事例としてやり玉にあげられるんだけど、ぼくは、それはそんなに単純な話じゃないと思うのだ。 たとえば、丸い取っ手のあるドアは、見た瞬間、「ああ、これはドアノブを回して引くんだな」ということが、直感的に分かる。つまり、そのドアノブは、「機能」を提供

    分裂勘違い君劇場 - 見た瞬間に使い方の分かるユーザインタフェース
  • 1