タグ

インターフェイスに関するbunhikoのブックマーク (16)

  • 優れたユーザインタフェースを設計する際に考慮する8つのポイント

    ユーザーにとって有益なユーザインタフェースを設計する際に考慮する8つのポイントをUsability Postから紹介します。 8 Characteristics Of Successful User Interfaces 以下、その意訳です。 ユーザインターフェイスの設計時に、考慮する8つのポイントを紹介します。 Clear Concise Familiar Responsive Consistent Attractive Efficient Forgiving To conclude… 1. Clear 明快 明快であるというのは、最も重量な要素です。 ユーザインターフェイスデザインの目的は、ユーザーに意味と機能を伝え、利用するアプリケーションと相互につきあえるようにすることです。そのアプリケーションがどのように機能するのか、どこに進むべきか理解することができない時は、ユーザーは困惑しが

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

    UIUXガイドライン UIデザインガイドラインのまとめ デザインガイドラインは、実際同じようなガイドラインを作るときだけでなく、UIデザインを考える際にも役立つ貴重な資料です。今まで個別で紹介したことはありますが、今回は一挙にまとめてリストアップしてみました。 Introduction to Apple Human Interface Guidelines 個人的に UI デザインガイドラインといえばこれ。日語訳も大変便利です Apple User Experience Guides ソフトウェア開発向けですが、イントロダクションあたりは参考になります iPhones Human Interface Guidelines 会員登録すると見れる PDF 資料ですが、上記のリンクからブラウザ上で観覧することが出来ます Windows User Experience Interaction G

    UIデザインガイドラインのまとめ : could
  • [JS]jQueryで実装するiGoogle風のインターフェイス | コリス

    How to Mimic the iGoogle Interface demo iGoogle風のインターフェイスを実装にあたって、下記のポイントを実装してあります。 複数のウィジェットの実装。 ウィジェットの編集が可能。 ウィジェットは3カラムに配置され、ドラッグ&ドロップで移動可能。 ウィジェットの色・タイトルの編集が可能。 ウィジェットには、HTML、テキスト、画像、フラッシュなどを配置可能。 サイトでは、画像ファイルを含む、スクリプトやHTMLファイル一式をダウンロードできます。

  • Apple風のインターフェイスを実装するチュートリアル集

    当サイトではCookieを使用しています。引き続き当サイトを閲覧することにより、ポリシーを受け入れたものとみなされます。今後表示しない詳しく見る

  • ノート感覚で気軽にメモや日記が書ける『Penzu』 | 100SHIKI

    親しみやすいインターフェースの割にはしっかりした機能をもっているツールのご紹介。 Penzuはいわゆるオンラインのメモ帳である。リアルなメモ帳っぽいインターフェースが最大の特徴であろう。何をすればいいのかすぐわかる。 ただ、見た目はカジュアルだが、機能が充実している。画像をアップできたり、その画像にキャプションを付けられたり、文書にパスワードでロックをかけたりすることもできるようだ。 日語も通るし、かわいらしいツールなのでこれで日記を付け始めてもいいかもしれない。こうした「一目で何をすればいいかわかる」アプリはいいですね。 管理人の独り言 『がしがし』 最近ブログやイベントばっかりやっていて、サイトを作れなくなっているのでは・・・とひそかに恐れていたのだが、全然そんなことなかった。うし、作るぞ、と気合を入れて作り始めたらわりと調子よくカタチになっていった。こういう制作物はいいですな。あま

    ノート感覚で気軽にメモや日記が書ける『Penzu』 | 100SHIKI
  • Technologies for UI

    Technologies for UI List view Topics copyright livedoor 上下カーソルキーでスライドを切り替えられます。 表示されない場合はこちらから

  • キャズムを超えろ! - 団塊~シニア層向けのWeb設計 やっちゃいけない10のUI

    一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービスPCアプリケーションのUI設計における以下10のTIPSを公開してみたいと思う。...といってもたかだか10個で収まる簡単な話ではないので、思いついたら都度追加して行きたい。 ID,ニックネームを考えさせてはいけない。半角英字開始限定は論外 IDやニックネームが思いつかない方が多い。これはシニアに限らず、ITリテラシーがそれほど高くない若年層についても言えること。作る側の人間も「過去にWebで使ったID,Nicknameは全て使っちゃダメ。何か新しいのを考えて入れてみて。」と言われると結構悩んじゃうもの。それと同じ状態に陥ると思っていただけるとわかりやすい。「IDのかわりに電話番号でもいいですよ」というと結

    キャズムを超えろ! - 団塊~シニア層向けのWeb設計 やっちゃいけない10のUI
  • 壁一面が付せん紙になってメモができる「Pixelnotes」

    いわゆる付せん紙が壁紙になっており、メモしてぺりぺりとはがすことができるというなかなか面白いシロモノ。メモ帳を持ち歩いていなくてもこれならすぐにアイディアを思いついた途端にメモができるというわけ。付せん紙ははがせば剥がすほど下に行くにつれて色が変わっていくようになっているので、よく使われる場所なども分かります。 詳細は以下の通り。 Duncan Wilson - Pixelnotes こんな感じでメモメモ 書き終わったらペリペリとはがす 壁は段々とこうなっていき…… こうなる ほかにも紙コップの電話っぽいものとか、人の座った跡が残るソファとか、なんだかよくわからないものもあります。

    壁一面が付せん紙になってメモができる「Pixelnotes」
  • 「使える、使いやすい、使いたい」と思えるUIとは? - @IT

    最新トレンドやキーワードをわかりやすく解説 WCR Watch [15] 「使える、使いやすい、使いたい」 と思えるUIとは? アドビシステムズ 上条 晃宏 2006/8/31 ここ数年、リッチクライアント技術としてFlashやFlexを採用する例が急速に増加している。この状況の背景としては、アプリケーション開発における“使いやすさ”の実現が重要な要件の1つとして認知されつつあることが挙げられるだろう。 しかし、単にFlash/Flexを使ったからといって使い勝手の良いユーザーインターフェイスができるわけではない。例えば、使いにくかった画面を“そのまま”Flexで置き換えたとしたら、従来からの問題点も再現することになる。これでは改善は望めない。画面設計を行う側にも使いやすさを実現するためのアプローチが求められるだろう。 ここで注目されるのがエクスペリエンスデザイン(XD)だ。エクスペリエン

  • テキストエリアとかリサイズ可能にする JavaScript

    ■ テキストエリアとかリサイズ可能にする JavaScript 好評の、読み込ませるだけシリーズ の6番目。 このスクリプトを読み込ませるだけで、ウェブ上にある TEXTAREA とかその他色々好きな要素がリサイズ可能なやつに大変身。とりあえずサンプル見るのが手っ取り早いです。 実際の動作サンプル テキストエリアの右下にマウスカーソルを持っていくとカーソル形状がかわるので、そのままドラッグするとサイズも変わります。 自分はグリモンスクリプトで快適なんですが、サービス提供側でこういう機能を提供してくれたら幸せな人が増えるんじゃね?とか思ったので作ってみました。 実際のリサイズ方法に関しては、愛用している Changing <textarea> Size のコードが大変参考になりました。ありがとうございます。 コードは次の通りです。 メイン部分。 var ElementResizer = {

  • 多くのユーザーは一度に1本しかジュースを買わない ― @IT

    ユーザビリティのヒント(1) 多くのユーザーは 一度に1しかジュースを買わない 「自動販売機での不要な動作から考える」 ソシオメディア 上野 学 2006/6/2 Webアプリケーションのユーザーインターフェイスデザインに役立つさまざまなTips集。自動販売機でジュースを買うときの不要な動作から考える。(編集部) 今回からはWebアプリケーションのユーザーインターフェイスの続編の「Tips編」として、ウェブアプリケーションのユーザーインターフェイスをデザインするうえで役立つさまざまなヒントを、少し細かな視点から具体的に見ていきます。 複雑な構成物を作り上げるには、基となるコンセプトやアーキテクチャといった抽象度の高い部分から考えていくトップダウン式のアプローチと、構成要素の細部から考えていくボトムアップ式のアプローチの両方が必要になりますが、前回までの経験則編はどちらかといえばトップダ

  • 【インタビュー】アニメーションソフト「うるまでるびペイント」 - アーティスト製ソフトは職人の伝統"自分の道具は自分で作る" (1) コンピュータは描き手の試行錯誤を邪魔せず、アシス��

    自分にとって使いやすいアニメーション制作ソフトを求めて 自分がソフトに合わせるなんてイヤ! 自分と相性の合うソフトがないなら、自分好みの新しいアニメーション制作ソフトを作ろう。そんなクリエイターにとっては夢のようなことを、実際に行動に移しているアーティストがいる。アーティストのうるまでるび氏だ。「うるまでるび」とは2人のアーティストうるま氏とでるび氏のユニット名。イラストレーターを職業とするぼくは、この話を聞いて、さっそくおふたりに会いに行った。お話を聞きながら、ソフトを見せてもらうために。 うるまでるび氏は2人のアーティスト名。ソフトを操作するのはうるま氏、手前がでるび氏。 うるまでるび氏は、これまで多くのキャラクターやアニメーション制作を手がけている。また、それだけにとどまらず、自分で描いた絵が勝手に動き出す「びっくりマウス」などプレイステーションのソフトの製作、ニフティの「インターポ

  • [ThinkIT] 第1回:Ajaxとは (1/3)

    まずは、Ajaxが生まれた背景をおさえる必要がある。そのためにはAjaxとは切り離せないインタラクション・デザインに触れておかなければならない。 読者の皆様の中にも、Apple社の「iPod」で音楽を楽しんでいる方は多いと思う。 iPodのディスプレイの下のスクロールホイールを指で回すと、すぐに反応して画面上のカーソルが上下に動く。スクロールホイールを速く回すほど、カーソルの移動は速くなる。中央のボタンを押せば曲を選択できる。 実は、これはとても優れたインタラクション・デザインだ(少なくとも筆者はそう考えている)。 つまり、インタラクション・デザインとは、「人と操作対象との対話がスムーズに進むようにインタラクション(相互作用)をデザインする」ことだ。ユーザにとっては、インタラクション・デザイン自身が商品とも考えられる。

  • インタフェースの話 - naoyaのはてなダイアリー

    一つ前のインタフェースの話。いろいろフィードバックをいただきました。ありがとうございます。 >

    インタフェースの話 - naoyaのはてなダイアリー
  • 分裂勘違い君劇場 - 見た瞬間に使い方の分かるユーザインタフェース

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

    分裂勘違い君劇場 - 見た瞬間に使い方の分かるユーザインタフェース
  • RSSリーダーにもファッションセンスが必要: DESIGN IT! w/LOVE

    不確実な時代をクネクネ蛇行しながら道を切りひらく非線形型ブログ。人間の思考の形の変遷を探求することをライフワークに。 はてなについてずっと気になっていることがある。 ブログとオンライン型のRSSリーダーとソーシャルブックマークというサービスの組み合わせは最高だと思う。 だけど、なんであんなにセンス(端的にいえば、ファッションセンス)がないのだ!と。 たぶん、あのセンスのなさ(あるいは偏り)で、はてなは随分とターゲット層を狭めてしまっているはずだと思っている。実際、そのせいでいわゆるギーク寄りの人が集まる結果となってしまっているように見えるし、ブックマークで注目されるエントリーにもそちらの話題への偏りが見られる。 だから、僕はfeedpathに期待していたりもしていたわけだが、僕のその感覚はちょっとだけ正しかったらしく、feedpathの「最も使われるタグ」を見ていたりすると、よりマス的な言

  • 1