デベロッパー

Looker コンポーネントにより従来のダッシュボードを超えたパラダイムを実現

※この投稿は米国時間 2021 年 11 月 9 日に、Google Cloud blog に投稿されたものの抄訳です。

今日では、従来型のビジネス インテリジェンス(BI)が進化しているという認識が一般的になりました。分析機能が組み込まれることが増えたため、全世界のエンタープライズは自社の日常業務のワークフローをリアルタイムの知見によって改善する機会を探し始めています。このようなデータで強化されたワークフローを、Looker では「データ エクスペリエンス」と呼びます。

これらのエクスペリエンスの中には直感的で、実装も簡単なものがあります。既存の SaaS アプリケーションである Salesforce や Zendesk に分析ダッシュボードを埋め込むだけのものもあれば、自社のプロダクト内に Looker ダッシュボードを組み入れ、ユーザーにとってプロダクトの価値を高めることで、自社の分析を収益化するというアプローチもあります。

一方で、ナレッジ ワーカーが決定を行う時点で知見を参照できるよう、より深いレベルでデータをアプリケーションに組み込むことによって得られる改善の機会もまた存在します。Looker は、このような深いタイプのエクスペリエンスにおいて、真にプラットフォームとしての真価を発揮します。

Looker で組み込み分析に使用する手法は、Google のお客様が自社の業務ワークフローにデータをさらに深く統合し、自社独自のデータ エクスペリエンスの構築、適応、拡張を簡単に続けられるようにすることです。また Google は、開発者向けに有意義で柔軟な抽象化機能を作成し、より多くのお客様がこうしたカスタム データ エクスペリエンスを構築できるようにすることも望んでいます。

再利用可能コンポーネントとしての分析

Looker ダッシュボードはプロダクトに組み込まれており、データの表示や操作を行い、深く掘り下げるための強力なインターフェースとなります。

しかし実際のところ、ダッシュボードでのデータの使用は、データの使用例の一つにすぎません。Looker プラットフォームには他にもデータ探索、ナビゲーション、データのキュレーションなどのデータ エクスペリエンスがあり、データに基づいてアクションを起こすこともできますが、お客様による構築についてはさらなる簡素化の余地があります。

従来は、このようなエクスペリエンスを構築するのは困難でした。主な理由は、これらのエクスペリエンスのほとんどにおいて、完全にカスタムのフロントエンドを一から構築する必要があったためです。さらに場合によっては、Google の API 上でカスタム フロントエンドを構築するために必要な時間とリソースがあまりに多すぎ、現実的ではありませんでした。

Looker Time to Value

Google は、Looker コンポーネントを使用することで、Looker の API 上で完全カスタムのフロントエンドを構築するよりも簡単で、モノリシックな iframe 組み込みダッシュボードよりも柔軟に使用できる、データ組み込みにおける第 3 の方法を実現できることを期待しています。

そして、Google では Looker のダッシュボード自体にある再利用可能なパターンを特定し、それらを公開することで、第 3 の方法を実現しようとしています。

コンポジションとしてのダッシュボード

ダッシュボードをモノリシックな機能と考えず、各種のコンポーネントとパターンから構成され、すべての構成要素が連携して統合エクスペリエンスを作り上げているコンポジションと考えてみてください。

Looker のダッシュボードは主に 3 つのコンポーネントで構成されます。

  • 可視化: データベースからのクエリを、ユーザーの使いやすい形式で表示します。

  • フィルタ: ダッシュボードの既存のクエリとのインタラクションを行い、クエリを操作するインターフェースとなります。

  • レイアウト: ダッシュボードの可視化のサイズをユーザーが調整できるようにします。

Dashboard

開発者が自分たちの Looker ダッシュボードからこれらの強力なパターンを抽出し、独自のアプリケーションに使用できれば、大いに役立つでしょう。

新機能: 可視化コンポーネント

Google は本日、Looker の可視化コンポーネントを公開します。これは、Looker からのデータをアプリケーション内で表示する新しい方法です。

Looker の可視化コンポーネントはオープンソースのパッケージです。3 つの高レベル コンポーネントにより、任意の React アプリケーションでデータ エクスペリエンスを簡単に構築できます。

  • Query: データの取得を処理し、応答をコンテキストに読み込みます。

  • Visualization: クエリから返されたデータを受け付け、構成アダプタを使用して、適切にカスタマイズされたグラフをページにレンダリングします。

  • QueryFormatter: クエリデータをカスタム可視化に渡すため、軽量なデータのクリーンアップと正規化を行います。

Looker の SDK を使用すると、Query および Visualization コンポーネントでクエリデータを要求して Google の可視化アダプタで応答を解析することにより、Google が用意しているさまざまな標準グラフのレンダリングを行うことができます。標準搭載機能を拡張してカスタムの可視化を実現するには、QueryFormatter コンポーネントを使用して、Looker のクエリ応答をクリーンアップしてから、フォーマットされたデータを独自に構築されたカスタム可視化に送信します。

Looker に用意されている他の組み込み方法とは異なり、可視化コンポーネントには iframe の必要がなく、アプリケーションのクライアントサイドでレンダリングを行います。Looker でカスタム フロントエンド エクスペリエンスを構築するにあたり、開発者は vis ライブラリの選択や、新しい vis フレームワークの学習に悩む必要がなくなります。

Looker Visualization Components

本日より、一部の可視化を Google のパッケージで提供開始します。まず最初に Scatter、Line、Area、Sparlkine、Table を提供します。これらの可視化は、中核の Looker プロダクト内で使用できるものとは完全に独立した可視化レイヤです。Looker の可視化メニューに含まれている多くのオプションと互換性はありますが、今のところ Looker のネイティブ可視化と完全に同等ではありません。

Google のチームは、長い期間にわたってこれらのコンポーネントに情熱を注いできました。お客様のアプリケーションで可視化コンポーネントが広く活用されるのを楽しみにしております。

新機能: フィルタ コンポーネント

Looker の外部で独自の可視化を宣言できるようにする有意義な改善とともに、任意のアプリケーションや Looker 拡張機能に Looker ダッシュボード フィルタを埋め込んで使用できるようにしました。

Looker のダッシュボード エクスペリエンスが非常に強力であることの大きな理由に、12 種類のフィルタを使用してデータをフィルタリングできることが挙げられます。フィルタ エクスペリエンスを利用することで、ダッシュボードのユーザーは単純かつ合理的な方法で Looker でより複雑なクエリを構築できます。

現在のところ、フィルタ コンポーネントを使用する最良の方法は、組み込みの Looker ダッシュボードですが、近い将来にはフィルタ コンポーネントと可視化コンポーネントとを簡単に組み合わせられるパターンを導入する予定です。

  import {
  ComponentsProvider,
  DashboardFilter,

} from '@looker/filter-components'

export const FiltersSection = ({ filters, filterValues, updateFilters }) => {
  return (
    <ComponentsProvider>
      {filters.map((filter) => (
        <DashboardFilter
          key={filter.id}
          filter={filter}
          expression={filterValues[filter.name]}
          onChange={(expression) => updateFilters(filter.name, expression)}
        />
      ))}
    </ComponentsProvider>
  )
}

組み込みダッシュボードでのフィルタ コンポーネントの使用

Looker の組み込み SDK により、独自のアプリケーションでフィルタ コンポーネントを宣言し、該当するダッシュボード ID をコンポーネントに渡すことができます。それを受けてコンポーネントは、ダッシュボードから表示されるフィールドをレンダリングします。

Looker Components with Embeddable Dashaboards

Looker のフィルタ コンポーネントの特長の一つは、ライブの Looker ダッシュボードと同期していることです。つまり、アプリケーションでフィルタ コンポーネントを宣言し、Looker ダッシュボードにリンクすると、Looker ダッシュボードでフィルタに加えられた変更は、カスタム アプリケーションのフィルタ コンポーネントへ自動的に反映されます。

これにより、開発者は自分たちの組み込みアプリケーションでフィルタを宣言してから、その管理を SME やアナリストに委託できるため、非常に便利です。手動での更新や、フィルタ エクスペリエンスへの変更に時間を費やす必要はなくなります。

Looker のフィルタ コンポーネントは、プロダクトの開発と密接に関われるようにするという点でアナリストにも有用です。アナリストは、開発者がフィルタに変更を実装するのを待つのではなく、その変更を自ら Looker ダッシュボードに実装し、カスタム アプリケーションに反映させることができます。これは、アナリストや SME が Looker で作成された組み込みアプリケーションをより細かくコントロールできるようにするという Google のイニシアチブの一部です。

今回のリリースにより、Looker 上に構築されたすべてのデータ エクスペリエンスが、Looker ダッシュボードの要となる機能である、強力で柔軟、かつ美しいユーザー エクスペリエンスの恩恵を受けられるようになりました。Looker をアプリケーションに組み込んで利用されるお客様向けにフィルタリング エクスペリエンスを開放することは、こうしたアプリケーションを使用するすべてのユーザーにとって、データとのインタラクションが強化されることにつながりました。

コンポーネントによるコンポジションの構築

Google のフィルタおよび可視化コンポーネントは Looker プラットフォームにおける魅力的なステップで、Looker データを多くの既存のデータ エクスペリエンスに埋め込むことを可能にします。

また、Google の開発者コミュニティが Google の 150 を超える UI コンポーネントを使用し、Looker の拡張機能フレームワーク上や、自分たちのカスタム アプリケーション内にまったく新しいエクスペリエンスを構築する可能性についても大きく期待しています。

Compositions with Components

Looker コンポーネントでまったく新しいコンポジションを構築することで発揮される創造性は、エンタープライズで構成可能な分析の価値を解放するための次のステップとなるでしょう。コンポーネントを使用して、データ エクスペリエンスによりビジネスを成長させる方法について詳しくは、この JOIN 2021 セッションをご覧ください。

- Looker プロダクト マネージャー Kenneth Cunanan