UIのお作法。28個の「〇〇できそう感」をまとめました。｜maiokamoto
UIデザインにおいて「〇〇できそうな感」を出すことは、非常に大切です。予測される動作や意味が、自然に理解できれば、ユーザーにとって優しいデザインになるんじゃないかと思います。アイコン、大きさ、色などなど、デザインは細かい要素の積み重ね。すでに多くのユーザーに浸透し、習慣化されていそうな「〇〇できそう感」を28個まとめました。 １、進めそう感 ２、戻れそう感 ３、進めそう＆戻れそう感 ４、開きそう感（ドロップダウン） ５、開きそう感（アコーディオン） ６、開きそう感（モーダル１） ７、開きそう感（モーダル２） ８、カレンダーが開きそう感 ９、メニューが開きそう感（ハンバーガー） １０、検索できそう感 １１、入力できそう感 １２、検索できそう ＋ 入力できそう感 １３、パスワード入力できそう感 １４、パスワード感（強め） １５、間違えた感（エラー） １６、合ってる感（OK） １７、電話かかる感
メガメニュー | Accessible & Usable
公開日 : 2014年5月12日 カテゴリー : アクセシビリティ / ユーザビリティ 「メガメニュー (Mega Menu または Mega Dropdown Menu)」と呼ばれる、面積の広いドロップダウンメニューがあります。情報量の多い大規模サイトを中心に、時折見ることができます。 メガメニューの例 : スターバックス (starbucks.com) メガメニューの例 : MoMA (www.moma.org) メガメニューの例 : LG (lg.com) JavaScript によるドロップダウンメニュー自体は昔からありましたが、それに比べると、メガメニューは以下のような特長があり、ファインダビリティの面で優れていると言えます。 サブメニューを二次元的に (縦だけでなく横にも) 展開できるので、たくさんのメニュー項目を、一度ですべて見渡せるように表示できる。 広い面積を活かして、情
[JS]実装は簡単で高性能、ロード無しでページを次々に表示するスクリプト -Navi.js
複数のページをブラウザのロード無しで、アニメーションで次々に表示するjQueryのプラグインを紹介します。 これ系のスクリプトはいくつか紹介してきましたが、ページタイトルの設定やネスト、戻る・次へボタンの対応など、使い勝手もなかなかです。 Navi.js Navi.js -GitHub Navi.jsの特徴 Navi.jsのデモ Navi.jsの使い方 Navi.jsの特徴 Navi.jsの仕組みは一つのファイルに複数のページのコンテンツを配置し、それをページごとに遷移するように表示します。 タブ、ナビゲーション、カルーセル、ページネーション、パンくずをサポート コンテンツにあったページタイトルを表示 戻る・次へボタンのサポート コンテンツのネストをサポート スライドアップ、スライドレフト、スライドアップ・レフト、フェードのエフェクトを用意 AJAXサポート Google Analytic
Finger-Friendly Design: Ideal Mobile Touch Target Sizes
In darts, the bulls-eye is harder to hit than any other part of the dartboard. This is because the bullseye is the smallest target. The same principle also applies to touch targets on mobile devices. Smaller touch targets are harder for users to hit than larger ones. When you’re designing mobile interfaces, it’s best to make your targets big so that they’re easy for users to tap. But exactly how b
【スマートフォン向け開発】ユーザビリティチェックリストを作ってみた
最近はスマートフォン系の開発から離れてしまっているので、感覚が鈍らないうちに（備忘録も兼ねて）スマートフォン向け開発（主にネイティブアプリ開発）におけるユーザビリティチェックリストを作ってみました。 ちなみに、このチェックリストは以下が前提となっていますのでご了承ください。 ・独自性を生み出すようなものではない ⇒現在のスマートフォンアプリのメインストリームの中で、アプリの印象をより洗練されたものにするためのポイントです。 ・案件の内容に関わらず意識すべきポイント ⇒ある程度汎用性の高いチェックリストになっているとは思います。 それでは、全てベーシックな内容ではありますが、その中でも特に基本的なものから説明していきます。 ※僕がiPhoneユーザーということもありiPhoneの画面イメージばかりが並んでいますが、全てAndroidでも使えるチェック項目です。 小さくし過ぎない、詰め込み過ぎ
BBC GEL | Homepage
New here? Please allow us to introduce ourselves.Welcome to BBC UX&D. We do the layer between people and technology. Every day, we focus on the stuff that makes things special, as well as the stuff that makes things happen. The Futures Bazaar: A Public Imagination ToolkitExpand horizons, explore new ideas, and transform everyday objects into things from the future. Download your toolkit here.
初心者に教えるときに留意している10のこと - シニア現場の隅っこ。was使いやすさを考えてみる。(アクティブシニア・シルバー層の現場から)
よく、初心者に教えるくらいは簡単でしょう、と言われるが 実は、初心者ほど教えるのが難しい。 初心者の方は、パソコンに関して慣れている人と 同じ概念を共有していないので、 何を考えているのかわからないからだ。 たとえば、クリックという言葉一つとっても 慣れた人には当たり前のようにわかる、 人差し指でポン。も、初心者の方にとっては 全てが新しい言葉であり、「覚えるべき知識」だと思っているから なかなか頭に入らない。 初心者に教えるにはちょっとしたコツがいる。 特に大人を教えるときにはプライドもあるし、 忘れっぽくなるので、とても気を遣う。 私が初心者に教えるときに留意していることを書き出してみよう。 1.相手の理解度を知る 相手がどのくらい理解しているのか、誤解しているのかを とにかく質問して知る。細かくステップを確認する。 どこまで解っているのか、解っていないのかを把握する。 2.相手が何を
» 日本語限定 UI、UXガイドラインとその他まとめ | Webnoborder
インターネット上に様々なガイドラインが公開されていますが、その中でもUI、UX、ユーザビリティについて言及している日本語限定の情報を集めてみました。 有志で翻訳されたガイドラインもあります。感謝です！ Apple 超が付くほど有名なガイドラインターネット上に様々なガイドラインが公開されていますが、その中でもUI、UX、ユーザビリティについて言及している日本語限定の情報を集めてみました。 有志で翻訳されたガイドラインもあります。感謝です！ Apple 超が付くほど有名なガイドラインです。これを抑えておけば他は必要ないかも？ アップル ヒューマンインタフェースガイドライン iOS ヒューマン インターフェイス ガイドライン(PDF) iPadヒューマンインターフェイスガイド ライン(PDF) Google AndroidアプリはiPhoneと同じUIで良いんんじゃない？と思っている方は、開発す
勝手にリデザイン：新宿高層ビルの館内施設案内板
勝手にリデザイン：新宿高層ビルの館内施設案内板 新宿のとある高層ビルの館内案内標識が話題に。後学のために、仕様・問題点を整理、改善案の作成を行ってみました time2011/09/08 hatenabookmark- Twitterで、あるサイン（案内板）のことが話題になっていました。新宿のあるビルの案内図のようですが、わかりづらいことが問題になっているようです。 …確かにこれはわかりません。トイレを探している時に遭遇したら結構辛いと思いますね。でも、なぜわかりにくいのか、どういう改善案が考えられるのか、もう少し考えてみることにしました。 仕様 まず、この図から読み取れる情報だけでは何が「正解」かわからないので、実際の現場に足を運んでみました。 そして、館内をぐるっと見学してみて、大体の施設の配置を把握してきました。（ちなみに、ビルの中をウロウロしてると普通に不審者だと思うので、警備員の方
ソシオメディア | iアプリの「ユーザビリティガイドライン」を作成 [株式会社NTTドコモ様]
ソシオメディアは株式会社NTTドコモ様の「ユーザビリティガイドライン」の作成に協力しました。 このガイドラインは、ドコモマーケット向け iアプリをはじめとする携帯電話向けコンテンツ一般の設計や開発に必要なユーザビリティを検討する際に参考となる資料です。 具体策として各種デザインパターンを示しており、サービスを設計する際にはこの各種デザインパターンを参考にできます。 NTTドコモ様のウェブサイトからPDFをダウンロードできます。 ○ドコモマーケット iアプリ提供者向け情報 / 技術情報 「ユーザビリティガイドライン」 URLが変更されました（2011年12月15日）。PDFファイルが開きます。 http://www.nttdocomo.co.jp/binary/pdf/service/developer/make/dmarket/technical_data/dmarket_usabilit
![ソシオメディア | iアプリの「ユーザビリティガイドライン」を作成 [株式会社NTTドコモ様]](https://cdn-ak-scissors.b.st-hatena.com/image/square/e11d055c532eb11f8bbb63026659c1df83d74011/height=288;version=1;width=512/https%3A%2F%2Fwww.sociomedia.co.jp%2Fassets%2Fimages%2Fsociomedia-logo-default-ogimage.png){kind=logo}
Av-jyo.com
The domain av-jyo.com maybe for sale. Click here for more information. Av-jyo.com Related Searches: Cloud Service Providers Secure Internet Browser Computer Internet Security Web Designing Courses AVI DVD Player Online Data Protection MatchMaking Services Related Searches: Cloud Service Providers Secure Internet Browser Computer Internet Security Privacy Policy
ラインアップ｜au NEW SELECTION｜au
auスマホを新規に購入・乗り換え（MNP）・機種変更した場合の月額利用料金の目安をシミュレーターでご確認・比較いただけます。
『iOSヒューマンインターフェイスガイドライン』はUI解説書の枠を越えている ：国内・海外情報から見える『企業のWEB活用法』：ITmedia オルタナティブ・ブログ
中小企業がITを活用して売り上げにつなげるにはどうしたらいいか？WEBマーケティングとWEB戦略コンサル実績350社50業種以上の実績とノウハウで、海外の最先端情報を中心に、噛み砕いてご紹介。 作成者：中山陽平 iOS、実質的にはiPhoneのアプリケーションを作る際に参照してくださいと言う事で配布されている「iOSヒューマンインターフェイスガイドライン（以下iOS_HIG）」 弊社のシステムを真剣にスマートフォン対応にするために読み始めたのですが、この内容が、ただのインターフェイスのガイドラインだけではなく、さらに踏み込んだ内容になっていて驚きました。 Appleのサードパーティアプリに対する姿勢、サードパーティアプリケーションがiPhoneの大きな魅力であるという認識が、このガイドラインからはにじみ出ています。 App開発者以外もぜひ見ておくべき これはぜひ、WEBに関わる方は見て頂き
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Create a Cool 3D Tilted Layout with Tilted Page Scroll
Quick Tip: Spare a Thought for Vertical Break Points | Envato Tuts+
unwrongest.com
https://www.func09.com/wordpress/archives/1668
http://www.moyashist.com/
サイン計画入門 - Aboc社
http://blog.e-riverstyle.com/2011/01/rolewaiaria.html
