AB
AB
AiBoss

すべてのカテゴリ

project

FlowGram - ByteDanceのオープンソースのビジュアルワークフロー構築エンジン

FlowGramは、ByteDanceが開発したオープンソースのノードベースのビジュアルワークフロー構築エンジンです。開発者は、固定レイアウトまたは自由に接続されたレイアウトでワークフローを迅速に構築できます。2つのレイアウトモードをサポートしており、固定レイアウトはシーケンシャルなワークフローに適しています。

FlowGramとは何ですか？

FlowGramは、ByteDanceが開発したオープンソースのノード編集可能なビジュアルワークフロー構築エンジンです。開発者は、固定レイアウトまたは自由接続レイアウトでワークフローを迅速に構築できます。FlowGramは2つのレイアウトモードをサポートしています。1つは固定レイアウトで、階層構造と柔軟な分岐および複合ノードを提供し、シーケンシャルワークフローや意思決定ツリーに適しています。もう1つは自由レイアウトで、ノードの自由な配置と手動接続をサポートし、ネットワーク図やマインドマップに適しており、整列や自動レイアウトなどの機能もサポートしています。FlowGramは、アニメーション遷移、ジェスチャーズーム、元に戻す/やり直しなどの豊富なインタラクティブ機能を提供し、ワークフローを画像またはコードとしてエクスポートできます。

FlowGramの主な機能

  • デュアルレイアウトモード
    • 固定レイアウトノードはあらかじめ設定されたグリッド内に配置されるため、企業承認や注文処理など、標準化されたプロセスと明確な階層構造を持つシナリオに適しています。また、コードの骨組みを自動生成することも可能です。
    • 無料レイアウトノードの位置がより柔軟で、接続線も自由なので、マインドマップやアルゴリズムのプロトタイプ作成などのシナリオに適しています。フローチャートとコード間のリアルタイム双方向同期を実現できます。
  • 対話型機能
    • ノード間の遷移を可能にするモーションアニメーションを提供します。
    • モジュール性をサポートし、グループ化やブランチの折りたたみを可能にする。
    • 選択やドラッグ、一括コピー＆ペーストなどの一括操作が可能です。
    • 水平／垂直モード切り替えを含む、レイアウト切り替えに対応しています。
    • レイアウト支援機能（ガイド、スナップ位置合わせ、自動整理、サムネイルなど）。
  • AIによるエンパワーメント
    • データクレンジングを実行する際に、次に実行すべき手順を提案するなど、インテリジェントな提案機能を備えています。
    • プロセステスト段階において、リスク予測を行い、タイプエラーの最大83%、潜在的な無限ループリスクの64%を未然に防ぐことができる。
    • プロセスが設定されると、ドキュメントは自動的に生成されます。
  • 拡張性
    • キャンバスエンジン、ノードエンジン、変数エンジンなどのコアコンポーネントを提供し、開発者はこれらの上に独自のビジネスロジックやカスタムノードを構築できます。
    • キャンバスのインタラクティブなレイヤーを拡張し、IOC依存性注入を実装することで、開発者は依存性注入を通じて必要なノードデータを監視できるようになります。
    • 変数エンジンはスコープ制約機能を備えており、その内部機能の多くはプラグインとして利用可能です。
  • エクスポート機能ワークフローは画像またはコードとしてエクスポートできます。

FlowGramの技術原理

  • Canvas Engine: ドキュメント管理、ノードレンダリング、ドラッグアンドドロップやズームなどのユーザーインタラクションを担当し、固定レイアウトと自由レイアウトの基盤を提供する。
  • ノードエンジンノードデータの管理、フォームレンダリング、検証、動的フォームレンダリングのサポート、および複雑なノード構成の有効化。
  • 可変エンジンスコープと型管理を使用してノード間のデータフローを管理し、抽象構文木（AST）を使用して変数とその関係を表現します。
  • プラグインシステムエディタの機能はモジュール式のアーキテクチャによって拡張でき、異なるレイアウトタイプに応じて異なるプラグインを登録できます。
  • Canvasをベースに独自開発したレンダリングエンジンフローチャートに最適化されており、多数のノード（200ノード以上で60FPSを維持）をサポートし、ECSと同様のデータパーティショニングとMobXの応答メカニズムを採用することで、効率的なレンダリングを実現しています。
  • Web Workerの並列化時間のかかる計算処理をバックグラウンドスレッドに移動することで、メインスレッドのブロックを回避し、UIの応答性を維持します。
  • スマートキャッシング読み込み速度を40%向上させ、大規模プロジェクトも迅速に開くことができるようになります。
  • ECSアーキテクチャエンティティコンポーネントシステム（ECS）アーキテクチャを採用することで、データ（コンポーネント）とエンティティを分離し、パフォーマンスとスケーラビリティを向上させています。
  • 依存性注入（IOC）Inversifyは依存性注入を実装するために使用され、動的なサービス登録をサポートし、プラグインアーキテクチャとコンポーネントの分離を容易にします。

FlowGramプロジェクトのアドレス

FlowGramの応用シナリオ

  • プロジェクト管理企業承認プロセスや受注処理プロセスなど、標準化された業務プロセスに適しています。固定レイアウトにより、各タスクの手順と分担が明確に表示され、プロセスの標準化と一貫性が確保されます。
  • ソフトウェア開発アルゴリズムのプロトタイプ作成やコードフローチャートの作成といったシナリオに適しています。ノードは任意に配置でき、接続も自由に描画できます。また、フローチャートとコード間のリアルタイム双方向同期にも対応しています。
  • 教育デモンストレーション教師はノードベースのワークフローを使用して、アルゴリズムの論理やデータ処理の流れといった複雑な概念を説明し、フローチャートをエクスポートして生徒と共有することで、生徒の理解と学習を促進することができます。
  • エンタープライズプロセス自動化企業においては、固定レイアウトを用いることで、意思決定ツリーの構築、タスクの自動化、手作業によるエラー率の低減、処理速度の向上などが可能となる。
  • 人工知能と機械学習複雑なAIボットの対話ロジックやツール呼び出しフローなどの構築に適しています。柔軟なレイアウトにより、複数のモデルの組み合わせを含む複雑な呼び出しにも対応できます。
戻る