概要 昨今、プログラムの開発において、UI設計の基本はないがしろにされる傾向があります。デザイン優先、利用者を考えない操作の強要などといった事例が珍しくもありません。アプリの開発スピードが驚くほど短縮され、不具合は発覚してから直すものと開発者でさえ考えるようになった現在でも、一方では真っ当なプログラムが特にビジネスでは依然として必要という切迫した事情があります。利用者はどのようなときに間違えやすいか、どうしたら誤操作を防げるのかなど、本書は、基本に立ち返って「使いやすいUIとは何か」を実例とともに詳細に解説します。 目次 Introduction これからのUIの教科書 ―ユーザーインターフェース設計入門 前書きに代えて 本書のポリシー Part1 前 提 Chapter1 UIデザインに必要な“デザイナー”とは違うスキル 1.1 デザイナー好みの製品のUIが良いとは限らない Chapte
UI/UXは進歩の激しい領域のために、時に前例なしの設計が求められることがあります。たとえば近年の例では、スマートフォンやタブレットが急速に普及し、まだノウハウのない中でこれらのデバイスに特化したUI/UXが求められました。これからも誰も触れたことないデバイスや状況でも、的確な設計を行うことが求められます。 そういった未踏の領域では、先端の研究領域に注意を向ける一方、UI/UXの原点を学ぶ必要があります。本コラムではインタラクションの研究者という立場から、これまでのUI/UXにおいて何が本質であるかを知るのと同時に、これから向かう未来を見据えながら、今何を学ぶべきかを分析、考察していきます。そしてUI/UXに携わる人に少しでもUI/UX設計の「なぜ」に答える材料になればと思います。 効率だけでは語れない道具の設計 スマートフォンやタブレットなど、高性能な端末を持ち歩く時代となりました。ネッ
こんにちは、ディレクターのほうの谷口です（余談ですが、ライブドアには3名の谷口がいて、私はプログラマーじゃないほうの谷口です）。今回は、ユーザーテストについてお話したいと思います。 ユーザーテストは、ウェブサイトの新規立ち上げやリニューアルの際、ユーザーがウェブサイトやプロトタイプを実際に操作してもらう様子を目の当たりにすることで、問題点を発見する方法です。 ライブドアのサービスは、作る側とユーザー像が近いことが多かったので、頻繁にはユーザーテストをしてきませんでした。しかし、今後は自分たちと違うユーザー像も対象としていきたいことから、ユーザーテストの数を増やしていきたいと思っています。 ユーザーテストの専門会社に頼むという手もあり、そうすることで厳密に調査をしてくれます。しかし、ポイントをしぼって外注せずにすむ方法もあるので、ここに紹介します。 1. 被験者は友人か知り合いでいい 専門会
プログラミング教育や社員の健康をサポートする「CHO室」の取り組みなど、DeNAのCSRに関する情報を発信するブログ
2chまとめ、面白いですよね。 コンテンツそのものが面白いというのはもちろんなのですが、上の例ではUIによってその面白さが増幅されていると思います。 試しに、これをこんなUIにしてみました。 どうでしょうか？冒頭の例と比べるとスレッドの臨場感が薄くなってしまった印象があると思います。 今回のケースにおいて冒頭に挙げたUIが優れていると思う理由としては、 ・投稿テキストの文字サイズを大きくし、かつテキスト周りに余白を大きく取ることでユーザーの書き込み1つ1つが際立っている ・各投稿の間に余白を大きく確保することで一覧性が悪くなり、次の展開が見えずにドキドキしながらスレッドを読み進めるという独特のリズムが形成されている こんなところでしょうか？ UIといっても今回は文字サイズと余白の調整だけですが、これだけでも世界は変わるということです。
こんにちは、だいきです。 海外のUIデザインに関する記事「14 Golden Eggs of Good UI Design（直訳: 優れたUIデザインの14の金の卵）」で書かれていたUIデザインに関するTipsがとても勉強になったので、その中からいくつか抜粋したものを翻訳しました！ （この記事はJohannes Thönesというブログの14 Golden Eggs of Good UI Designという記事の抜粋翻訳ブログです。） 1, 先進的な技術を使う理由 photo credit: Carlos Varela via photopin cc HTML5が新しい技術だからといって、それを使う必要性はありません。 新しい技術を使うことが目的になってはいけません。 ユーザーとユーザーが期待している事を考えてください。 どんなUX（ユーザーエクスペリエンス）をユーザーに与えたいですか？
昨日ブログで取り上げた、変わったUIを持つATM端末だが、コメント欄で教えていただいたのが正解に近いと思う。 TAMOさんが次のようにおっしゃっている。 初めて見るので私の仮説ですが,左上詰め,左下詰め,今回のパターン,右下詰めの4パターンがあり,スキマーが取り付けられたATMで暗唱（ママ）番号入力をビデオカメラで盗撮された場合に数字の判別を困難にする為ではないかと思います. つまり、以下の4パターンがランダムに出現するのではないかということだ。 はてなブックマークのコメントでも指摘されたが、キーパッドの右隣りになにやらそのようなこと（「覗き見」「の配列」、「0は全」、「有効です」）が書いてある。気づかなかった。フォルスアラームをしてしまって申し訳ない。まぁ、ガイドなどは誰も読まないという話もあるくらいなので、勘弁して欲しい。 システムを構築する側からすると、配列をずらすだけなので楽だとは
と、いうわけで転職しました 本来の職種は相変わらず 「前例の無い事をなんとか形にして」をなんとかするデベロッパとしてですが、 「UX Developer として組織的に UX とかそういうの強くして」というのも兼任しております で、入社して1週間経って、早々と「じゃあ、出来る UX デザイナー/ディレクター/エンジニア を社外から引っ張るとか、採用募るとか、属人性の高い他力本願にしないで、組織として体制を整える方向で行きましょうよ」ということで作ったのがこのスライドです このスライドについて 昨今、割とどのソフトウェア・Webサービス開発の現場でも「UI/UX デザイナーを募集します」と求人出しています。 しかし、求人出してるところって、そもそもそういう人材が不在で、受け入れ態勢整ってない事多いのが実情です。 そして、その後どうなるかというと、その人の属人性に大きく依存した働きのみが期待さ
jQueryでDrag & DropやDialogを使用したい場合、jQuery UIを使用すればよさそうです。 まずは、ダウンロードとHTMLページへの設定方法を調べてみます。 http://jqueryui.com/ このサイトの右上にある「Build custom download」をクリック。 使用したいコンポーネントを選択すると、必要なメソッドを集めたjsファイルを 生成してくれるようです。 とりあえず、全部試してみたいので全てチェックがついた状態でダウンロード。 また、右側にあるテーマ名を変更すると雰囲気の異なるテーマでダウンロード可能です。 ダウンロードを実行すると、jquery-ui-1.8.2.custom.zipというファイルが取得できます。 解凍すると、「css」「development-bundle」「js」という3つのフォルダと、 「index.html」というフ
Visual Basicの父とも言われるAlan Cooperが立ち上げたCooperに所属するGolden Krishnaが数日前に書いたブログ記事が面白いので、ざっと抄訳してみた。 "The best interface is no interface"と題されたこの記事の中で、彼は「最良のインターフェイスとはインターフェイスを持たないことだ」と主張する。 インターフェイス前提の社会 AppleのLisaは、DOSのようなCUI（キャラクターユーザーインターフェイス）から、GUIの世界にデザインを一変させた。そして、Palm Pilotから現在に至る情報機器はマウスさえ必要なく、タッチで操作できる世界を実現させた。この流れが現在のデザインの問題をすべて解決することになった。 では、良い自動車を作るにはどうするだろう？ そうだ、インターフェイスをそこに載せよう*1。 良い冷蔵庫を作るには
なんか突然東京行きたくなったので、ひょひょいと行ってきた。 たまたま立ち寄ったクックパッドっていう会社でクックパッド流UIの作り方という勉強会してたので、偶然持ち合わせていたはてなステッカー渡したりおいしい料理いただいたりした。 UI/UXのためのSass 池田さん / サービスデザイン部 Sass / Haml (エンジニア・デザイナー問わずに) Github デザイナーもpull req 一つのサービスを複数チームで開発 各デバイスで速いサイクルでの開発 Sassとは → ぐぐれ 全体のデザインを束ねる → デザインガイドライン ガイドライン Sassで統一的なものを提供する 画像を使わずにCSSでデザインするメリット mixinをつかって統一できる 画像編集がいらない プロパティの変更によってデザインに幅をもたせる事ができる mixinの中身は応用がきくような仕組みにしておく 検証を
デオシークの特徴 加齢臭も撃退 強烈な足のニオイも撃退 ワキ、足など全身のニオイをシャットアウト デオシークは厚生労働省が認可した医薬部外品で、殺菌効果や消臭効果がきちんと認められた有効成分が配合されている商品です。 市販されているデオドラントクリームと比べると、医薬部外品は入っている成分が違いますので、消臭効果が高いです。 デオシークは、デオドラントクリーム単品でも消臭効果が期待できますが、ボディソープとのセットを使用することでさらなる消臭効果が期待できます。 ワキガや加齢臭などのような頑固な臭いによる悩みは深いですが、デオシークによって悩みから解放される人が増えています。 博士有効成分は消臭効果や殺菌効果が認められている成分なんだ 頑固な臭いはデオシークで一発なんだ もう怖くないんだ 価格 3,380円（定期コース） 6,980円（単品購入） 有効成分 パラフェノールスルホン酸亜鉛、イ
jQuery UI の Sortable プラグインを使い、ドラッグ＆ドロップで並べ替えた順番を、送信する方法。 「この並び順を送信」ボタンを押すと、「この順番でよろしいですか？」という確認ダイアログが出現し、「OK」を選択した場合、項目IDを送信する。 実装例（サンプル） 項目名 A (項目ID:1) 項目名 B (項目ID:2) 項目名 C (項目ID:3) 項目名 D (項目ID:4) 項目名 E (項目ID:5) 実装例の動作について 「項目名 A」をドラッグして、下へ動かし、「項目名 B」の上に持ってくると、「項目名 B」が上へ移動し、「項目名 B」と「項目名 C」の間にスペースができる。そのスペースへドロップすると、「項目名 A」と「項目名 B」が入れ替わり、「項目名 B」「項目名 A」「項目名 C」…の順番になる。 「この並び順を送信」ボタンを押すと、 項目名 B (項目ID
「Ubuntu 12.04」がリリースされ、Ubuntuの状況がどうなっているか知りたがっている好奇心の強い人たちから、多くの質問が出てきている。「Ubuntu 11.04」がリリースされた際には、熱狂的なUbuntuファンさえ、Ubuntu Unityのひどさに憤慨した。バグが多く、ユーザーに優しいとは到底言えないこのリリースは、それまでのデフォルトデスクトップである「GNOME」に手間と時間をかけていたユーザーを、侮辱しているように見えた。 それも昔の話だ。現在はまた状況が違っており、大きく改善されユーザーにも優しくなっている。しかし、他のデスクトップからUnityに新たに移行してきた人には、この新しいUIについて少し警告が必要かもしれない。この記事では、出たばかりの「Precise Pangolin」（知らない人のために念のために書いておくと、これはUbuntu 12.04のことだ）
ユーザーの視点に立ってデザインされていないインターフェースは、エンドユーザーに受け入れてもらえないはずだ。そこで本記事では、UIデザイナーが念頭に置いておくべきユーザーの習慣や考え方について焦点を当てる。 つい最近、「Ubuntu Unity」はUbuntuに正式搭載されてから1周年を迎えた。また、「Windows 8」はリリースを間近に控えている。こういった状況のなか、すべてのユーザーインターフェース（UI）は同じように作られていないという事実が明らかになってきている。実際のところ、コンピュータの使い方に革命的な変化をもたらすような素晴らしいUIデザインもあり得るだろうが、エンドユーザーを念頭に置いていないものは、その素晴らしさを証明する間もなく失敗作という烙印を押されてしまうはずだ。 筆者は長年に渡るコンピュータ経験のなかで、ほとんどすべてのLinuxデスクトップと、あらゆるバージョン
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
