yejy53/Editable-Design

何を解決するか

従来の画像生成は、局所的な変更を行うために画像全体を再生成する必要がある、平坦化された画像（flattened images）を生成することがよくあります。逆に、直接的なコーディングは構造を提供しますが、多くの場合、一貫した視覚的な洗練さに欠けています。Editable Visual Designは、ハイエンドな視覚的ディレクションと、編集可能なセマンティックレイヤーを組み合わせた構造化されたデザインアーティファクトを作成することで、このギャップを埋めます。

仕組み

このシステムは、コーディングエージェントを使用して、意図から最終的な修正まで、デザインプロセス全体を管理します。以下の3つのアプローチに従います：

1. Coding-Agent-Driven Design: 永続的なエージェントが構成を計画し、アセットを生成し、HTMLを実装し、観察に基づいて反復を行います。
2. Visual Prior: 画像モデルが初期のアートディレクション（構成、色、階層）を提供しますが、最終的な出力は、画像モデルからピクセルをそのまま出力するのではなく、クリーンなアセットとHTMLタイポグラフィを使用して再構築されます。
3. Quality-Gated Artifacts: 出力は、実際のテキスト、セマンティックなHTMLレイヤー、および編集、移動、エクスポートが可能な独立したアセットで構成されます。

対象者

ポスター、インフォグラフィック、フィールドガイドなど、完全に編集可能で、PowerPointなどの形式にエクスポートできる、高品質でアートディレクションされた視覚的アーティファクトを必要とするデザイナーやクリエイター。

ハイライト

• Editable Outputs: 平坦化された画像ではなく、実際のテキストと独立したアセットを持つアーティファクトを生成します。
• Agent Design Replay: 作成プロセスを可視化し、追跡可能にします。
• Multi-format Export: HTMLデザインを編集可能な .pptx ファイルに変換するツールが含まれています。
• Deterministic Checks: キャンバス、フォント、およびレイヤー契約（layer contracts）のチェックを通じて品質を保証します。