fladdict » スマホのUI考 〜 ボタンについて
SuperPopCamとか作ったときに、体系的な資料欲しいなぁーとか思ってたことのまとめ。 色々と自分の中の考えをまとめるためのメモ。世の中のアプリは機能を半分にして、減った予算分をUIの練り込みにつぎ込んだ方が絶対よいアプリになると思う。 書いてる作業が一番考えまとまるので、ちょぼちょぼあげていこうかと、まずはボタンから。 指の大きさの制約を受ける ・Webとスマホを比較した場合、最大の違い。 ・ピクセル単位でクリック位置を制御できるマウスポインタと違い、指は大雑把にしかタップ位置を指定できない。 ・このためAppleはボタンの最小サイズとして44pxというガイドラインを作っている。 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 ・またこれに留まらず、ボタンとボタンの間のマージンは空けられるだけ空けた方が安全。 ・つまるところ「カッチリ」つめたボタンレイアウトのグラ
スマホのUI考２ 〜 フィードバックについて | fladdict
UIについて徒然と考える自分用メモ、２回目はフィードバック。ユーザーに「何かがおきたよ！」と如何に明解に知らせるか？１回目はこちら 随時増えたり減ったりするよ。自分の主観だから間違ってることもチラホラあるかもよ。 振り返ってみてTiltShiftGenでは、遷移系のフィードバックは少なめにして、情報系のフィードバックを多めに調整してたんだなぁとシミジミ。多分、ブラーの処理が重かったからだと思う。隙をみてバージョンアップしたい。 一般論 ・フィードバックとは？ ユーザーの操作に対して、結果を返すこと。操作の実感。 ・フィードバックのないアプリは痛覚の無い人間。 ・物理的なフィードバックもソフトウェア的フィードバックもなければ、ユーザーは何がおきているか知覚できない。 ・何かが起きたら必ずユーザーに通知する。 ・適切なフィードバックが行われるとユーザーは快感を感じる。 ・新雪に足跡をつけたり、
iphoneアプリを始めとした、モバイルのためのUIデザインパターン集「Mobile UI Patterns 」
TOP > WebDesign > iphoneアプリを始めとした、モバイルのためのUIデザインパターン集「Mobile UI Patterns 」 国内でも数多くの機種がリリースされ、普及の兆しを見せてきているスマートフォン。それに伴い多くのコンテンツが制作されてきています。今日紹介するのはそんなモバイルコンテンツの様々なパーツデザインを集めたUIデザインパターン集「Mobile UI Patterns 」。 スプラッシュ、フィード、ユーザープロフィールなどなどモバイルのアプリやWEBサイトに欠かせない、様々なデザインが収録されています。 詳しくは以下 ■Splash Screens 様々なアプリのスプラッシュがスクリーンショットで集められています。 ■Comment Detail ユーザーからのコメントも様々な見せ方があります。 ■Lists 多くのコンテンツを見せるときに利用
MS Office 2007以降の『リボンインターフェイス』はなぜ使いにくいのか？ - Awaresoft
Microsoft Office 2007以降では、従来からのメニューバーが廃止になり、『リボンインターフェイス』が採用されました。 初めてOffice 2007を使ったときは、とにかく、今まで使い慣れた機能が従来どおりに使えないことに非常にストレスを感じました。 「あれ？フォントのサイズはどうやって変えるんだ？」 「あれ？オートフィルタはどこにいっちゃったんだ？」 と、非常に基本的でそれまではほとんど無意識でこなしていたことでいちいちつまずいて、本来の作業に集中できません。 それでも、時代の変化、新しい流れについていくには、労力をかけてでも新しいものに慣れるように努力をしなければ、と前向きにとらえて、がんばって使ってきました。 確かに、使っているうちに、何がどこにあるかは少しずつ覚えてはきましたが・・・それでも、ひとつの操作をするのに、クリックをする回数が以前のOfficeよりも確実に増
iPhoneゲームでの仮想キーパッドUI - bopperjpの日記
最近フルタッチ端末のUIで悩んでいるので調査。 ソニック 一番素直なパターン。方向キーとボタンを付けました的なもの。 キーの反応エリアと、キーの見た目サイズが同じ。 ソニックが右端や左端に行かないので、キーは邪魔にはならない。 ゲームロフトのゲーム ゲームロフトのゲームは、方向キーの中心からスライドさせる方向キーUIと、ボタンの構成。 方向キーの周辺を押下しても、方向キーは反応しない。 方向キーを押そうとしたときに、中心を外すのか、反応しないときがある。イラッとする。 Hero of Sparta ターミネーター iFighterのUI iFighterは3つのUIが選べる 加速度センサーを使った、画面を傾けての移動 タップとフリックを使って、タップした点への移動 仮想キーパッドを使った移動 iFighterの開発者は、UIについてかなりよく考えていると思う。 どのUIもそこそこ使いやすい
「使える、使いやすい、使いたい」と思えるUIとは？ - @IT
最新トレンドやキーワードをわかりやすく解説 WCR Watch ［15］ 「使える、使いやすい、使いたい」 と思えるUIとは？ アドビシステムズ 上条 晃宏 2006/8/31 ここ数年、リッチクライアント技術としてFlashやFlexを採用する例が急速に増加している。この状況の背景としては、アプリケーション開発における“使いやすさ”の実現が重要な要件の1つとして認知されつつあることが挙げられるだろう。 しかし、単にFlash／Flexを使ったからといって使い勝手の良いユーザーインターフェイスができるわけではない。例えば、使いにくかった画面を“そのまま”Flexで置き換えたとしたら、従来からの問題点も再現することになる。これでは改善は望めない。画面設計を行う側にも使いやすさを実現するためのアプローチが求められるだろう。 ここで注目されるのがエクスペリエンスデザイン（XD）だ。エクスペリエン
iPadを4歳児に渡してみる - 日経エレクトロニクス - Tech-On！
iPad分解班の一員として，子供が「iPad」をどこまで操作できるか実験を試みた（iPad分解リンク集）。 我が家には，4歳（まーくん（仮名））と2歳（としくん（仮名））の男児がいる。週末の夕食を待つ時間帯に，二人に「好きなように使っていいよ」と，おもむろにiPadを手渡した。 果たして，どのように電源を入れるのか――。と思った瞬間，いきなり4歳児がホーム・ボタンを押して画面を表示させた。やはりボタンが一つしかないと，自然とそれを押すのだ。やるな米Apple, Inc.（やるな我が子）。 次の関門は“ロック解除”である。さすがにこれは難しいだろうと思った瞬間，これもあっさり解除。「ロック解除」の文字が点滅しており，自然と目がそこに向かう。ひらがな以外は読めないため，その隣の矢印マークに従って，矢印の方向に指で動かしたようだ。タッチ・パネルの機器は初体験だと思うが，ボタンが一つしかないので画
十字キーの権利はそれからどうなったのか - Timesteps
現在、自分の持っているブログで横井軍平さんのリスペクトキャンペーンをしているので、ここでも横井軍平さんに関わりの深いもので書いてみたいと思います。 ■関連：横井軍平さんの開発したものは『ドラえもん』にも影響を与えていた - 空気を読まない中杜カズサ ■関連：ゲームミュージックなブログ・SIDE B 横井軍平さんはある意味コンシューマギャルゲーの祖でもあるという話 横井軍平さんの開発した偉大なもの 横井軍平さんの開発した偉大なものはたくさんあります。それは「ウルトラハンド」、「ラブテスター」、「光線銃」、「ウルトラスコープ」といった玩具。ゲームでは「ゲーム＆ウォッチ」、「ゲームボーイ」などのハード、それに「ドンキーコング」、「バルーンファイト」、「マリオブラザーズ」「GUNPEY」といったソフトの開発に関わるなど、この人がいなければ現在のゲーム業界はなかったと言えるほど大きな存在です。
フリック、ピンチイン……アップルが新しい操作の呼称を提案
iPod touchの操作を紹介するアップルのWebサイト 米Appleが発売した携帯電話「iPhone」や音楽プレーヤー「iPod touch」に代表されるタッチパネルの操作について、アップルの日本法人は、ワールドワイドでの表現に揃える形で操作の呼称を統一していくことを明らかにした。 iPhoneなどのタッチパネルの操作では、指を2本使って押し広げるようにする操作など、これまでにない操作方法が採用されている。アップルは、米Appleが採用している「タップ」「ピンチ」といった呼称をそのままカタカナで表現し、今後は日本のアップルのサイトでも採用していく方針を明らかにした。 具体例として明らかにされた呼称は以下の7つ。 タップ……指で軽く叩く操作。マウスのクリックに相当 ダブルタップ……2回叩く操作。ダブルクリックに相当 ドラッグ……写真を移動する時に指をずらす操作 フリック……リストをスクロ
ユーザを混乱させない表組みのコツ (ユーザビリティ実践メモ)
ウェブサイト制作において、多くの情報をいかに整理してユーザに伝えるかは重要なポイントの1つです。よく使われる方法として表組みがありますが、今回は実際の事例をもとにしたケーススタディを通じて、ユーザを混乱させない表組みのコツをご紹介します。 表１はよく見かける表組みの例ですが、実際にユーザの立場に立ってこの表を使用してみると、いくつかの問題点があります。 同種の情報をユーザは区別できない 表1の問題点として、 日付という同種の情報を多く掲載しているため、ユーザには各情報が何の日付を意味しているのか区別できず、分かりにくい列数が多いために、セル内に折り返しが発生し、読みにくい ことが挙げられます。 特に、1つ目の問題点は、表が縦に長い場合にユーザを混乱させる要因の一つになります。なぜなら、画面サイズに収まりきらないほど表が縦に長い場合、下にスクロールしていくと「開催日」などの項目名が画面から消
Chromeはなぜ速いのか － ＠IT
Chromeの動作が圧倒的に速いように感じている。Chromeがリリースされた当初、それがなぜなのかよく分からなかった。グーグルだけにできて、ほかのWebブラウザ開発者にできないことなどあるように思えないが、それにしてはあまりに速いように感じたからだ。 その疑問のほとんどは、Chromeのオープンソースプロジェクト版「Chromium」の公式ブログの解説で氷解した。ブログを読んで分かったのはグーグルのエンジニアたちが信じられないほどのスピード狂であることと、そのスピードへのこだわりには2種類の“スピード”があることだ。 1つは処理速度、もう1つは応答速度だ。特に後者、ユーザーをできるだけ待たせない、イラつかせないということに対する徹底したこだわりは、すさまじい。その背後には「スピードとは、つまりお金だ」という洞察があるようだ。 0.5秒の遅延でユーザー離れ グーグル創業約1年後の1999年
ユーザーの6割以上が縦移動のみのFlashサイトを支持 【モバイルリサーチ】
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
スマートフォンが消し去ったもの - レジデント初期研修用資料
今さらなんだけれど、新しく購入したHT-03Aという携帯電話を、このところずっと使っている。 前使っていた携帯電話は、機能なんて何もついてない、文字通り「携帯できる電話」だったものだから、 スマートフォンのちょっとした機能に、いちいちびっくりする毎日。 Palm を使っていた 大学病院で働いていた頃は、Palm という携帯コンピューターを使っていて、 メモ代わりにしたり、患者さんの情報を入れておいたり、あるいはblog の原稿をちょこちょこ書いたりしていた。 Palm は面白くて、同業者の中でも、自分は相当熱心に使い込んでいたほうだと思うんだけれど、 職場が変わって「これでないと」という場面が減って、結局面倒くさくなった。 その面倒くささの根っこにあったのは、「同期」という操作だったのだと思う。 たとえば「今日時間があったときに読もう」なんて思った文章は、Palm でそれを読もうとしたら、
驚き最小の原則 - Wikipedia
驚き最小の原則（おどろきさいしょうのげんそく、Principle of least astonishment または Rule of least surprise）とは、ユーザインタフェースやプログラミング言語の設計および人間工学において、インタフェースの2つの要素が互いに矛盾あるいは不明瞭だったときに、その動作としては人間のユーザやプログラマが最も自然に思える（驚きが少ない）ものを選択すべきだとする考え方である。 例えば、あるユーザインタフェースでは ⎈ Ctrl+Q を押下することでプログラムを中止させるとする。同じユーザインタフェースにマクロを記録する機能（キーを押下した順序を記録して後で再利用できるようにするもの）があるとする。ユーザは Ctrl+Q を含むキーストロークをマクロとして記録したい場合もあるだろう。驚き最小の原則に従えば、マクロ記録中の Ctrl+Q はプログラムを中
使える GUI デザイン
EmptyPage.jp > Translations > 使える GUI デザイン 使える GUI デザイン: フリー／オープンソース・ソフトウェア開発者のための手引き 2004年11月28日 Benjamin Roe さんの、Usable GUI Design: A Quick Guide for F/OSS Developers の M.Shibata による日本語訳です。プロジェクト杉田玄白正式参加テキスト。 Update: この記事についてたくさんのコメントをいただいたので、FAQを作って、そのうちのいくつかについて回答することにしました（訳注: FAQ も翻訳しました！）。 イントロダクション オープンソース・ソフトウェアの世界は優れたソフトウェアでいっぱいです。ワードプロセッサから Web サービスにいたるまで、コンピュータでしたいと思うようなおおよそすべての作業において、高
どうしてフリー・ソフトウェアのユーザビリティはアレなのか
Why Free Software usability tends to suck 2005年12月25日 Matthew Thomas さんの2002年4月13日のブログエントリ、“Why Free Software usability tends to suck” の日本語訳です（現在はリンク切れになってますが、Internet Archive でアーカイブが読めます）。僕はこれを Joel on Software の 「5つの世界」で（正確には書籍のほうを読んで）知りました。このエントリはいろいろと論争を巻き起こした有名なもののようですが、どうやら当時の日本ではあんまり言及されてなかったみたいなので（≒ Google で見つからなかったってことですけど）、いまさらながら日本語にしてみました。 お知らせ: Matthew Thomas さんは 2008 年に、この記事の続編ともいえる、
fladdict.net blog: 「本当に素晴らしいデザイン」とは、PICASAの変なスクロールバーみたいなものを言う
お気に入り巡回先の、羨望は無知の「なぜ「デザイン」という行為、「デザイナー」という職業は誤解されるのか」や、分裂勘違い君劇場の「エンジニアの方が優れたユーザインタフェースデザインができる理由」、F's Garageの「エンジニアがダメなUIデザインをする原因」 のあたりのデザイン論が、あんまりデザインと縁のない人にデザインをわかりやすく説明してて面白い。面白いのだけどちょっと抽象的なんで、具体例の話とか書いてみるテスト。 最近、これらのエントリーで言及されるようなよいデザインを身をもって体験をした。それは画像管理ソフトPICASAのヘンテコなスクロールバー。 今まで気付かなかったけど、あのヘンなスクロールバーは単なるアヴァンギャルドやオシャレじゃあなかった。実は合理性に裏打ちされた素晴らしく美しいデザインだということに気付いた。 まずPICASAを知らない人に説明すると、このソフトのスクロ
Moo-t.blog - ■はてなのトッツキにくさ
なぜか「はてな」を使っていません。 なんとなーく、取っ付きにくい感じがする。 その原因は、画面デザインとインターフェイスにある となんとなーくは思っていたんだけど、↓この文 □naoyaのはてなダイアリー - インタフェースの話 はてなダイアリーのインタフェースの中心を作った id:jkondo 曰く「更新された画面にリダイレクトしてその画面が更新されたということが分かれば、メッセージでそれを教えなくても直感的に理解できる。それができる状況でメッセージを用いてそれを教えるのは冗長だ。」と言っていました。を読んで、なんか思いついたので、書いてみる。 このエントリーはこう続く…でもおそらくどんなに不慣れな人でも、更新直後の画面がそういう動きをするということを一回か二回経験すればそれは理解できると思うんです。取っ付き難さの原因を見つけた気がする…。 現在のブラウザを使ったNetサービスや
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
トップページ｜ポケモンずかん
青岛纪缺投资管理有限公司