パスワードの入力ミスを防ぐテキストボックスがイケてる話 - ヤルキデナイズドだった
Mac のパスワード入力ボックスに capslock のアイコンが表示されたときも感動したもんですが、今日はそれを上回るテキストボックスに出会ったので紹介します。 tinygrab.com で使われているテキストボックスには、このように： 入力した文字列に対応して固有のパターンをもつ3色のバーが表示されます。自分のパスワードに対応する色の組み合わせを覚えておけば、打ち間違いにすぐ気づけるんですね。かっこいい。 ログインページで適当なパスワードを入れて試してみましょう。バーの色がくるくる変わって楽しいです。 マスコットキャラがいる web サービスなら、キャラの表情がモンタージュで変化するようにしてもいいかもしれません。自分のパスワードは涙目の半笑いで真紫な顔、とか。
「スマートフォンのインタラクションデザインに関するユーザビリティ調査」を発表～最も支持されるJavaScriptの表現方法とは～ / IMJモバイル
「スマートフォンのインタラクションデザインに関するユーザビリティ調査」を発表 ～最も支持されるJavaScriptの表現方法とは～ 株式会社アイ・エム・ジェイ（JASDAQ 4305）のグループ会社である株式会社IMJモバイル（本社：東京都目黒区 代表取締役社長：川合純一）は、「スマートフォンのインタラクションデザインに関するユーザビリティ調査」を実施いたしました。 調査期間は2011年9月14日～9月15日、有効回答数は412名から得られました。 調査結果概要 スマートフォンの普及に伴い、インタラクション性が高いサイトが求められています。 スマートフォンサイトを構築する際の効果的な表現方法としてJavaScriptの活用がありますが、実際にJavaScriptを使った表現方法がユーザーに与える印象について実例を用いた調査を行いました。 調査の結果、シンプルにわかりやすい表現方法はユーザ
サービス終了のお知らせ - NAVER まとめ
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
Disciples: Sacred Lands – 続・ゲーマーの為のUIデザイン(4)
寝食を忘れるほどに没頭。Disciplesのために長期休暇を取りたいくらいだ。 今日は敵の本拠地を攻め落とせるか挑戦してみた。本拠地はヒーローユニットと雑魚ユニットのパーティが防衛している。雑魚敵は弱いのだが、ヒーローユニットがとにかく強い。ヒーローユニットの性能はHPが900、攻撃力は全体ダメージ200。必ず先制攻撃してくるため、HPの低いキャラは即死し、戦士系のクラスも瀕死に陥る。 そこで対策を練る。まず、周りの雑魚ユニットが邪魔。こいつらが前線にいるせいで、近接職はヒーローユニットに攻撃できない。雑魚ユニットを片付け、ヒーローユニットだけの状態にするのが理想的だ。相手のターンに移ると、雑魚ユニットが補充されてしまうので勝負は一ターンのみ。 そこで雑魚ユニットはシーフの毒攻撃で瀕死にする（ただし、毒攻撃はヒーローユニットには効かない）。シーフの毒攻撃成功率は30％。失敗すると死んでしま
完・ゲーマーの為のUIデザイン
今回は前回、前々回のエントリーで書き足りなかった部分の補足を行いたい。一気に書けばよかったのだが、時間的都合でブツ切りになってしまった。申し訳ない。 ●拡張性の高いUIデザインMMORPGのウィンドウはユーザーの好きな位置に配置できる。OSのウィンドウのように、ステータスウィンドウはこっち、スキルウィンドウはこっちという風にだ。これはMMORPGが効率重視なゲーム性だからではないかと考える。 どんな配置が見やすいかはユーザーの慣習に左右されるため、ステータスウィンドウは上にあった方が見やすいという人もいるだろうし、その逆の人もいるだろう。なので、ウィンドウの配置はユーザーでいじれた方が効率性は増す。 また、ウィンドウデザイン自体をカスタマイズ可能なMMORPGなどもある。今はプレイしていないので現状は分からないが、βテスト時代のラグナロクオンラインでは、ユーザーがウィンドウデザインのカスタ
Disciples: Sacred Lands – ゲーマーの為のUIデザイン(3)
未だチャプター2。ただし、敵勢力を壊滅状態まで追い込んだ。私は勝ち目のない勝負は挑まないため、準備万端にしてからでないと攻められない主義。それゆえ攻略に時間が掛かる。 このゲームはいつでもセーブ可能なので、こまめにセーブしておいた方がいいだろう。トライ＆エラーを繰り返すと、だんだん光明が見えてくるはず。 本作のインターフェースは直感的に操作できるように簡略化されていて、使いやすいデザインだと思う。ただ、資源とマップの表示がバッティングしていて、いちいち切り替えないと確認できないのは問題だ。こういうのは一画面で確認できた方がよい。 とことで、今回はユーザインターフェース（UI）のお話。Disciplesのゲーム内容とはあまり関係のない話なので、興味の無い人は続きを読まなくていい。 ストラテジーゲーム（STR）ではゲーム画面、資源、メッセージウィンドウ、全体マップ、操作ボタン、勢力がメイン画面
『人間中心設計のプロセスを採用したリニューアル』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 こんにちは、Amebaでデザイナーをしております植田（@uuepoo）です。 2011年8月9日にリニューアルしたAmebaプレゼントについて、Amebaプレゼントとはデジタルアイテムを贈り合えるサービスです。 プレゼントのほかに、プレゼントの周りを装飾できるフレームや、プレゼントを包むラッピングも一緒に選べます。 プレゼントは有料のもの、無料のものと両方あり、 種類も好きな文字を入れることが出来るものや、自分のピグが入るもの、動くプレゼントがあったりと様々です。 プロジェクトの流れユーザーアンケートの実施 RN前のサイトを使ったユーザビリティテスト
iPhoneやAndroidのUIパターンを収集するシンプルで見やすいギャラリーサイト・Patterns of Design
いくつか同じようなギャラリーサイトは ありますが、こちらもなかなか見やすか ったのでメモ。スマートフォンのUIの パターンギャラリーサイトです。スマー トフォンに限らず、通常のWebサイトの パーツデザインの参考にもなりそうです。 特にスマートフォンのUIは細かい部分のこだわりが見られてとても参考になりますので見ておいて損は無いかと思います。 シンプルな作りです。パーツはカテゴリで分けられていて探しやすいです。ちょっと重いかな・・ 例えばこちらはグリッドのカテゴリ。同じ幅、同じ高さという限られた空間の中で、様々な工夫が見られます。 クリックするとその場でLightbox風にポップアップします。iTuneへのリンクもあるので確認しやすいですね。 同じようなギャラリーサイト似たようなサイトは沢山あるので合わせてチェックしてみてはいかがでしょう。 Mobile UI Patternspttrns
Official Usability, UX & UI Guidelines From Companies | Usability Geek
You are here: Home / UX Guidelines / Official Usability, User Experience & User Interface Guidelines From Companies Official Usability, User Experience & User Interface Guidelines From Companies By Justin Mifsud Guidelines are considered to be the best resource that designers and developer can use to ensure that the applications and web sites they produce are usable. Operating systems, devices, an
WEBデザイナー向け☆iPhoneアプリのUIデザイン
どーもキンモクセイぷんぷん香る自由が丘からaoizmです。 秋満開！スマートフォンまっさかり！(強引) KAYACでもiphoneアプリ制作のお仕事が増えてきております。 WEBデザイナーがiphoneアプリのデザインをする際に、やっぱり気になるのがWEBとの違い。 画面サイズが小さく持ち歩けるデバイスiphoneは、デスクトップ上のアプリやWEBサイトとは 使用環境もその操作方法も異なるため、WEBとは違ったインターフェイスが求められます。 その違いを認識した上で、違いを活かしたデザインをするためには？ iPhoneアプリのUIデザインまとめてみました。 WEBサイトとiphoneアプリの違い 状況 持ち歩けるがゆえそのシチュエーションもさまざま 「会議で」「合コンで」「移動時」「就寝時」... 状態 そのときユーザーはなにをしている？ 「歩きながら」「話しながら」「運動しながら」...
Mobile App Gallery｜tappgala.com
Mobile App Galleryは各種アプリのデザインギャラリーサイトです。カテゴリごと、色ごとに分けて分かりやすく表示しています。
Webサイトにおけるユーザービリティの復習をしたので、よくチェックするポイントをリスト化した
ユーザービリティに関して少し復習したので メモっておきます。初心忘れるべからずという 事で・・・Webサイトは基本的にユーザビリティ を考慮したレイアウトやコンテンツが理想です。 もちろんケースバイケースではありますが、 これは全共通して言える、という事を忘れない ようにメモ書き。 というわけで、申し訳ないですけど目新しい事は何一つ無い内容です。 そもそもこのブログ自体ユーザビリティを考慮した設計とは言えません（「やっちゃダメなこと」もしています）ので全然説得力ない感じです。 いろいろとテスト&エラーをして行きたいのでご了承下さい。 はじめに正しいユーザビリティはコンテンツによってケースバイケースだと思いますが基本的には僕はヤコブ・ニールセンの考えに従っています。 全ての項目は「すべてが正しい」ものではありません。100のサイトがあれば100通りのユーザビリティが考えられるはずです。場合に
スマホのUI考２ 〜 フィードバックについて | fladdict
UIについて徒然と考える自分用メモ、２回目はフィードバック。ユーザーに「何かがおきたよ！」と如何に明解に知らせるか？１回目はこちら 随時増えたり減ったりするよ。自分の主観だから間違ってることもチラホラあるかもよ。 振り返ってみてTiltShiftGenでは、遷移系のフィードバックは少なめにして、情報系のフィードバックを多めに調整してたんだなぁとシミジミ。多分、ブラーの処理が重かったからだと思う。隙をみてバージョンアップしたい。 一般論 ・フィードバックとは？ ユーザーの操作に対して、結果を返すこと。操作の実感。 ・フィードバックのないアプリは痛覚の無い人間。 ・物理的なフィードバックもソフトウェア的フィードバックもなければ、ユーザーは何がおきているか知覚できない。 ・何かが起きたら必ずユーザーに通知する。 ・適切なフィードバックが行われるとユーザーは快感を感じる。 ・新雪に足跡をつけたり、
スマートフォンサイト運用と今後のスマートフォン市場の展望 : LINE Corporation ディレクターブログ
スマートフォングループの藤村です。2か月前まで、モバイルで、livedoorトップ・デコメサイトの運用を担当していました。 10月から新しい部署のスマートフォングループに所属し、すでに、スマートフォン版のlivedoorトップ＆ニュース他の運用を開始しています。実際に運用してみると、モバイルとの共通性が多く、モバイルサイトの運用経験が生きる領域だと実感しました。 まだまだ運用の初期フェーズの段階ですが、今回は、実際にスマートフォンサイトを運用してみて気づいた点及び、今後のスマートフォン市場の展開予想について書いてみようと思います。 ファーストビューの重要性 スマートフォンのサイトを運用してみて、まず一番最初に改修を入れたのが、ファーストビューです。ファーストビューとはユーザーがモバイル端末でアクセスして、一番最初に表示される画面のことを言います。 モバイルサイト運用経験者の方には常識かと思
iPhone／Androidブラウザのアドレスバーを隠す方法 | alt
これはスマートフォンに限定した話になってしまうかもしれませんが、 コンテンツの領域が端末の縦幅より長いときってフリックやスワイプ操作でスクロールしますよね。 iPhoneやAndroidのブラウザで横向きにしたときは ファーストビューのエリアが狭いのでアドレスバーがすごく邪魔でちょっと不親切。 ユーザビリティを考慮したサイトには必ずといっていいほど、 初期時にブラウザのアドレスバーを隠してあげる工夫がされています。 やることは単純。 window.onloadか、jQuery使ってれば$(document).readyとかで1px移動しておくと、 ブラウザの仕様でバーの高さ分引っ込めてくれます。 人のやつ参考にしてみたけど、こんなんでいいのかな。。 iPhoneは読み込み遅延のせいでsetTimeout使わないとうまく反映されなかったです。 一応、両OSで動くのは確認
ここ1年くらいで見られた素晴らしいインターフェイスデザイン 12選
Tweet 『fastcodesign.com』に見ているだけで楽しくなる記事が出ていたのでご紹介。 2010年に出てきたプロダクトのうち、インターフェイスのデザインが素晴らしかったものを12個ほどピックアップしてくれています。 以下、ちょっとづつ解説をば。 1. FLUD まず1番最初に紹介されていたのは、iPhoneアプリ、『FLUD』。素晴らしくデザインされたRSSリーダーアプリです。アイコンもイケてます。 2. Cortex 『Cortex』はChromeで機能するExtension。Facebook, Twitter, Tumblr, or Instapaperにマウスジェスチャーだけで瞬時に投稿できるスグレモノです。 3. IOBR 『IOBR』は幼児のためのソーシャルメディア。（というよりはコミュニケーションツールですが。）幼児は上のように、ボックスに三角や四角のブロックを入
デザインどや！？｜海外カジノ オンラインのWEB作成
Webページレイアウト、ナビゲーションプラグイン、フォーム、スライダー＆カルーセルプラグイン、チャート＆グラフプラグイン、イメージエフェクトプラグイン、ビデオプラグインなど。チェックしておきたいです。海外カジノ オンラインサイトの制作はワードプレスのプラグインを利用して様々な機能を付け加えて完成させることができます。2012年のjQueryプラグインまとめでは、デザインの一新や個別のカスタムにも対応した国際的で魅力的なサイト作成に役立つ情報を紹介しています。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Rotating wheel control for mobile webkit (iPhone/iPod touch)
Yahoo Developer Network
「INFOBAR A01」インタビュー iidaの世界を体現するUI、シリーズ初のスマートフォン - ケータイ Watch