Browse by Tags

All Tags » UX
Showing page 1 of 5 (115 total posts)
  • チャートと時間サイクル – Part 1

    原文 - Tim Brock - Charts and Cycles of Time - Part 1 チャートと時間サイクル - 前編 私たちの日々の生活はすべて時間に対する予測に依存しています。朝の準備にかかる時間を予測し、アラームを設定します。歩いているときは道路の反対側まで歩くにはどれぐらいの時間がかかるかを判断するとともに、近づいてくる車が横断地点に到達するまでの時間も考えます。このように、さまざまな場面が考えられます。 「道路を渡るのに車の半分の時間がかかる」など、予測は実際には相対的で、「朝の支度に 45 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on October 20, 2016
  • AngularJS アプリケーションに依存性 (Dependency) を注入 (Injection) するさまざまな方法

    原文 - Different ways of injecting dependency in an AngularJS Application AngularJS の特徴について読まれた方は、依存性の注入 (Dependency Injection, DI) という用語をご存じだと思います。これはアプリケーションに必要となる依存関係が AngularJS に注入されるという前提によるものです。開発者としての仕事はモジュールに依存を渡すことだけです。その他すべては AngularJS が処理します。 コントローラーを作成するにはモジュールのコントローラー機能に $scope オブジェクトおよび他の依存を渡します。たとえば、ProductController の作成には $scope ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 24, 2016
  • Angular JS フォームでユーザー入力を検証

    原文 - Validating User Input on a Form in Angular JS AngularJS のシングルページアプリケーションでのユーザー入力の検証はエントリ レベルの開発者には少々難しいかもしれません。そこで、このブログでは AngularJS の検証について簡単にご説明します! 以下の例を見てみましょう。以下の制限がある 3 つのフィールドから構成された登録フォームです。 名前: 必須項目。 メール: 必須項目。メール アドレス。 パスワード: 必須項目。最小 6 文字のパスワード。 上記の条件をクライアント側で検証します。AngularJS ベースのシングル ページ ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 22, 2016
  • データセットの側面 - パート 2

    原文 - Aspects of Datasets - Part 2 このブログはデータセットのキーとなる側面について詳しく紹介するブログのパート 2 となります。前回、関連性、正確性、精度についてお話ししましたが、ここでは一貫性、完成度、そしてサイズについて考察していきます。 一貫性 1999 年 9 月 23 日、NASA のマーズ・クライメイト・オービターが火星大気に入った直後に燃え尽きてしまいました。この 1億 2 千 5 百ドルの過ちは、サテライトを制御するソフトウェアの 2 つの異なる部分で使用する単位の不一致が原因でした。 マーズ・クライメイト・オービターは、単位を混乱した例 (もう 1 つは "Gimli Glider") ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 21, 2016
  • スロープグラフへの入門 - 後編

    原文 - An Introduction to Slopegraphs - Part 2 前編では、スロープグラフを用いて時間的推移を表す方法について説明しました。G20 先進国のうち 13 か国の 1960 年と 2013 年の人口の推移をデータを例に説明しました。スロープグラフは、カテゴリー タイプの変数の差異を表すためにも用いられています。同じように、13 ヶ国の人口データを使用して、2012 年の平均寿命を示しています (スロープグラフは、R で作成しましたが Excel ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 17, 2016
  • データセットの側面 - パート 1

    原文 - Aspects of Datasets - Part 1 コンパイルするデータセットが自分のデータであるか他人のデータであるかに関わらず、データが目的に合わなかった場合、時間とお金を無駄にする可能性が非常に高くなります。このブログはシリーズ最初の記事です。パート 1 では、関連度、正確度、精度、パート 2 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on August 16, 2016
  • ポイントを繋ぐ

    原文 - Connect the Dots 通常の散布図についてはすでにご存じだと思いますが、各 x 座標がある変数および各 y 座標が別の変数によって決定される、ポイントの選択です。以下は、その簡単な例です。1896 年アテネから 2012 年ロンドンで開催されたすべてのサマー オリンピック試合の総メダル数と 1 個以上のメダルを獲得した国の数です。データは Wikipedia のオリンピック メダル受賞数一覧 (1896 年オリンピック) の記事を基に作られています。 ご覧のとおり、メダル数とメダルを獲得した国の間の正の相関関係がわかります (ちなみに、相関係数は 0.95 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on July 20, 2016
  • 注釈を使ったデータ可視化のテクニック

    原文: Tim Brock » How to Improve Your Data Visualizations with Annotations Merriam Webster は、注釈 をテキスト、本、描画などにコメントや説明を追加するためのメモであると定義しています。チャートの注釈は、追加情報、重要な点の強調、あるいは明確化を目的に使用されます。ただし、グラフィックスを注釈で埋めるのはデータそのものの視覚的特徴に対する注意を妨げる可能性があります。チャートタイトル、軸ラベル、軸タイトルが注釈ではなく構造的なコンポーネントである場合、多くのチャートに注釈は必要ないということになります。 構造的な要素と注釈の間の線をまたぐのは、線とマーカー ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on March 8, 2016
  • スロープグラフへの入門 - 前編

    原文: Tim Brock » An Introduction to Slopegraphs - Part 1 スロープグラフの起源を語る際に、一般的に Edward Tufte 氏の 「The Visual Display of Quantitative Information」 がまず取り上げられます。Tufte 氏は 159 ページ (第二版) に、チャート、あるいは「表グラフィックス」を新しく紹介しています。そこでは、「垂直方向に、1970 年、そして 1979 年に徴収された税金を 15 か国でランキングで表示しています。国名はその金額のパーセンテージに応じた間隔で配置されています」。 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on March 1, 2016
  • データ密度に関する考察

    原文:Tim Brock » Some Thoughts on Data Density 以前、私のブログであるデータ可視化の 7 つのヒント を公開しましたが、そのブログで最初にご紹介した注意事項は、棒チャートを利用して「説明が十分に可能であればチャートは使用しない」というものでした。 ブログで述べたように、上記の棒チャートは、読者の理解を妨げずに、「製品 B を好む人はたった 112 人であるのに対し、237 人が製品 A を好むと回答しました。」などのシンプルな文で置き換えられます。 棒が 2 本だけの棒チャートをよく見かけますが、ポイントが 2 点しかない散布プロットはめったに見ることがありません。可能性の 1 ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on February 23, 2016
  • サンプル サイズに基づいたビジュアルの探究

    原文: Tim Brock » Visual Explorations of Sample Size 小さなサンプルに基づいて結果を導くと問題になる可能性が明らかに高いです。その一方でビッグ データが有名になることによって、組織が分析に実際どれぐらいのデータが必要かを論理的に考えるより、ランダムに可能な限りのデータを収集すようになるかどうかは疑問です。私はデータが足りないよりも必要なデータ量より少し多めのデータを使用する方を好みます。統計を使用してどれだけのデータが本当に必要なのかを判断できます。最近、サンプルサイズを増加させる効果をどのようにビジュアル化できるのかを考えてみました。 シンプルさを保持するために、正規分布の特定のインスタンスから random variates ...
    Posted to World Tech Talk in Japanese (Weblog) by mkobayashi on February 16, 2016
  • 折れ線 チャート: どこから始めるか?

    原文: Tim Brock - Line Charts: Where to Start? 棒チャートの棒が 0 から始まることの重要さを以前のブログでご説明しました。その理由は簡単です。値を比べる際に相対的な長さの棒を使用するからです。そのため棒を 0 から始めると誤った判断を招きます。一方、折れ線チャートはどうでしょうか。 以下は A、B および C の 3 つのデータセットの折れ線チャートです。これらのチャートから判断できることは: すべての年にわたって各線が 0 以上です; A は大体フラットです; B は 1980 年代の急上昇以外は下向きです; C は上向きです; 上記 1 番目の項目以外は y 軸が 0 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on December 21, 2015
  • ビッグ データ: オーバープロットの対処

    原文 - Tim Brock - Too Big Data: Coping with Overplotting 散布プロットは 2 変量データの (明白な) 関係を簡単に示すことができます。テーブルで大きいデータブロックの見えにくいパターンやクラスターが、すぐにページや画面でよく見えるようになります。最近はビッグ データが誇大宣伝されているため、多量のデータを持つことに利点があると考えるのは当然でしょう。ただし、散布プロットにデータポイントを追加すればする程、そのパターンとクラスターが見えにくくなります。この問題は、以下のアニメーションのようなオーバープロットが原因です。 上記のアニメーションのデータは、一組のシンプルな 2 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on December 8, 2015
  • 棒チャートとドットプロットの比較

    原文 - Tim Brock - Bar Charts versus Dot Plots 棒チャートを領域または角度調整が必要となるチャート形式と比べた場合、棒チャートには明白な利点があります。これは棒チャートを理解するために必要となるシンプルな知覚タスクを人間が得意とするためです。ただし、ドットプロットでもスケールにある位置を判断してデータを読み取ることができます。ではどちらを選んだらよいのでしょうか。 実際のデータセットを使用しているドットプロットと棒チャートを作成してみましょう。データは、世界保健機関 (WHO) の各国の平均寿命です。1990年、2000年、2012年の各年の出生時における男女を合わせた平均寿命を表します。データは一番近い年に反映しています。 1990 年から ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on November 11, 2015
  • [15.2] Indigo Studio 2015 Vol.2 新機能 [Indigo Studio]

    今回から Indigo Studio のネーミングルールが他のプラットフォーム コントロール同様に 年 + ボリュームとなりました。そのため、今回のリリースでは下記の製品名となっています。 Indigo Studio 2015 Vol.2 今回のリリースにおける機能拡張は下記のとおりになります。 プロトタイピングへのコメント コレクションを利用したプロトタイプの管理と共有 リッチテキスト サポート プロパティ パネルのドッキング UI ガイドの向上 indigodesigned.com で共有されているライブラリーのダウンロード FontAwesome アイコン アイコンの反転、回転 テキスト値をベースとしたインタラクション ...
    Posted to Daizen Ikehara (Weblog) by Daizen Ikehara on October 27, 2015
  • [15.2] Infragistics Ultimate 2015 Vol.2 提供開始! [Release]

    本日、デスクトップ、Web、モバイルなど様々な開発に対応する開発ツール、 Infragistics Ultimate の最新版である、2015 Vol.2 の提供を開始しました!! 2015 Vol.2 の概要についてはプレビューとして以前公開させていただいておりますが、より詳しい新機能のご紹介を下記にて行っております。 概要 Windows Forms WPF iOS & Android Ignite UI / ASP.NET MVCIndigo Studio   開発ツールについては下記よりダウンロードいただけます。 ぜひ、お試しください! また、最新機能をご紹介するオンラインセミナーを 2015 年 10 月 ...
    Posted to Daizen Ikehara (Weblog) by Daizen Ikehara on October 26, 2015
  • DataVis における慣例の役割

    原文 - Tim Brock - The Role of Convention in Dataviz 「サイエンスと知覚についての研究が効果的な可視化にいかに貢献できるか」ということが私の関心事であることを私の他のブログを読まれた方はご存じだと思います。読み手はすばやく重要なパターンを見出し、誤った加工データによって判断を誤ることはありません。ただし、だからといって可視化のデザインで完全に知覚に依存すべきではありません。外見上は恣意的な慣例を忘れてはいけません。以下の例を見てみましょう。 時間の慣例 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on September 29, 2015
  • 領域の認識:領域を使用した視覚化の問題点

    原文: Tim Brock - Area Judgements: Areal Problem 人間が領域を正確に認識できないという研究報告 (An experiment in graphical perception) があり、そして長さと位置の方が認識しやすいと考えられています。ブログ「円チャートと棒チャートどちらを使用するべきか?」ではすでに触れていますが、領域の認識はその他の一般的な表示方法でも必要になります。データを効果的に表示するには、長さおよび配置の認識を必要とする変換を優先すべきです。したがって、左の比例円よりも右の棒チャートを選択しなければなりません (またはドット ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on August 25, 2015
  • Ignite UI jQuery Map コントロールのテーマとカスタマイズ化

    原文: Mihail Mateev - Theming and Customizing of Ignite UI jQuery Map Control Ignite UI マップ コントロール (igMap) は、簡単に使用できるマップ ウィジェットです。 Ignite UI マップ (igMap) のベースとなるレンダリング エンジンはデータ チャートと同じです。さまざまなタイプのタイルソースへバインドし、数百万のデータ ポイントをマップで描画できます。Bing、CloudMade、OpenStreet、ESRI シェープ ファイル、およびカスタムタイルがサポートされます。 このブログは、igMap にスタイルを設定し、記号マーカー ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on August 18, 2015
  • チャートで二重軸 (複数軸) を使用する理由

    原文: Tim Brock - Should I Use a Dual-axis Chart? チャートのデザインを考える上で構成要素(チャート ラベルなど) の一部を取り除くことが役立つ場合があります。たとえば、下のチャートから何がわかるでしょうか (表示されていない垂直のスケールが直線で通常のように下から上へ伸びているとしましょう)。 たとえば、多少なりとも互いに依存性がありますが、以下のようなことがわかります。 A が時間の経過とともに直線状に上昇する傾向を示しています。 B が時間の経過とともに直線状に上昇する傾向を示しています。 A は常に B を上回ります。 A は B より急速に上昇しています。 A と B ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on August 11, 2015
  • 小さな変更でより洗練された外観を実現: 軸、目盛、目盛ラベル、グリッド線

    原文: Tim Brock - It's The Little Things That Matter: Axes, Tick Marks, Tick Labels, and Grid Lines 概要 チャート デザインの基本ではデータの正確かつ効果的な視覚表現が大変重要となりますが、副次的な構成要素 - 軸、目盛、目盛ラベル、グリッド線なども忘れてはなりません。これらの要素は、データの理解を妨げない程度に背景から際立たせることをお勧めします。 これには、グレー色を使用すると容易に実現します。軸、目盛、グリッド線に黒色使用するとチャートでは黒い線が目立つため、データから注意を逸らしてしまいます (左上) 。そのためグレー色の線を使用するとデータを効果的に強調表示します (右上) ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on July 28, 2015
  • NodeJS、Express、または Bower で AngularJS アプリを作る方法

    最近 ある人が「IDE に頼ってばかりいると無頓着になる。」というのを聞きました。この発言の背景には、.NET 開発者はもはや Visual Studio の向こう側に広がる世界について考えなくなっている。というものです。つまり、われわれ .NET 開発者は最新の技術に無頓着になり、背後にある複雑さに気をとめなくなることなのです。われわれは特定のプロジェクト テンプレートを選択してプロジェクトを作成し、NuGet パッケージ マネージャーを使って他の必要なパッケージを管理します。とてもシンプルだと思いますよね?実はそうでもないんです。 このブログでは、サーバーとクライアントで JavaScript を使用してアプリケーションを作成します。これには NodeJS ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on July 21, 2015
  • 円チャートと棒チャートどちらを使用するべきか?

    原文: Tim Brock - Should I Choose a Pie Chart or a Bar Chart? 全体を構成要素に分割したチャートを作成したいと仮定しましょう。通常は円チャートを使用すると思います。例えば、以下は香辛料の瓶の販売を示す、3 つのカテゴリーからなる円チャートです。 チャートからわかるように、クミンは総売り上げの 4 分の 1 にすぎません。 また生姜よりサフランのほうが多く売れたのも読み取れます。しかし、サフランと生姜の売り上げの差と生姜とクミンの売り上げの差は簡単に比較できません。これは人間が鋭角や鈍角より直線と直角を正確に認識できるためです(詳細についてはこちら (英語) ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on July 7, 2015
  • データ可視化の 7 つのヒント

    原文: Tim Brock - 7 Do's and Don'ts of DataViz viz.wtf などのサイトでは、データ可視化でありがちな問題について説明しています。また最適とは言えないデザインが一般的に多く使用されている例もあります。この投稿では、よくある 7 つの間違いとその解決方法について説明します。これは個人的な見解であり限定的なものではありません。データは、あくまで例でチャートラベルはプレースホルダーです。 説明で十分ならチャートは使用しない チャートのデザインでまず考える必要があるのは、「チャートが本当に必要かどうか?」です。データ可視化の主な利点は、数字を見ただけでは分かりにくいパターンを示すことです。左下のチャートのような場合、データ値が 2、3 ...
    Posted to World Tech Talk in Japanese (Weblog) by Daizen Ikehara on June 9, 2015
  • Build 2014 : Day 1-1 Windows Phone

    ついに今年の Build が始まります。まずは初日の Keynote です。いつものごとく DJ を呼んでかなりのボリュームで音楽を流し続けており、朝から盛り上がります!(個人的にはラスベガスでの MIX を思い出します。) Operating Systems Group の EVP である Terry Myerson が仕切り役となって始まりました。Keynote は day 1 と day 2 の2回がありますが、初日は Devices & Services / Mobile first, Cloud first といったビジョンステートメントでいうところの Devices / Mobile ...
    Posted to Ken Azuma (Weblog) by kazuma on April 3, 2014
1 2 3 4 5 Next >
Powered by Community Server (Commercial Edition), by Telligent Systems