# 例: テキストベースの UI ジェネレーター 私たちは、 によって実践されるAI駆動開発の支持者です。それをサポートするために、AIを使用してユーザーインターフェースを開発します。このツールは、説明に基づいてテキストベースのユーザーインターフェースを生成し、特定のユーザーインターフェース要素のリクエスト（オプション）を受け付けます。このツールのプロンプトは、デザイン要素と適切なUIテキストを求めます。\ \ この例は、チーム全体で作成し展開できるツールの具体的かつ実用的な例として提示されています。\ \ 以下はその使用例です。\ \ ユーザー入力:
テキストベースのUIジェネレーターサンプル入力

指定された入力フィールドを使用したサンプル入力。

生成された出力:
テキストベースのUIジェネレーター出力

アプリによって生成されたテキストを含むテキストベースのユーザーインターフェース。

カスタムツールのjsonをGenstudioに追加します。
カスタムツールのアップロード

カスタムツールを定義するためにjsonをアップロード

\ \ ここに、ファイル（例: text-based-ux-designer.json）で更新する実際のjsonがあります。 ```json { "version": "0.1", "metadata": { "avatar": "", "creator": { "name": "Khoa Tranに触発されて", "email": "admin@eastagile.com", "organization": "East Agile" }, "timestamp": "2023-06-01T10:00:00Z", "variables": [ { "name": "機能説明", "type": "text", "default": "", "description": "機能または機能の簡潔な説明。" }, { "name": "UIコンポーネント", "type": "text", "default": "適切で従来のものなら何でも", "description": "ユーザーインターフェースコンポーネントの種類（例: ラジオボタン、マルチセレクトリスト）。" } ], "parameters": { "top_p": 1, "max_tokens": 1024, "temperature": 0.7, "presence_penalty": 0, "frequency_penalty": 0 }, "avatar_type": "base64", "description": "このツールは、あなたの説明と指定されたユーザーインターフェースコンポーネントに基づいてテキストベースのユーザーインターフェースを生成します。", "prompt_name": "テキストベースのユーザーインターフェースジェネレーター", "usage_notes": "生成したいインターフェース、機能、またはアプリの説明（機能説明）と、使用したい特定のユーザーインターフェース要素（UIコンポーネント）を提供してください。このアプリケーションは、East Agile https://eastagile.com によって実践されるAI駆動開発（AiDD）をサポートするように設計されています。", "model_version": [ "gpt-3.5", "gpt-4", "claude", "palm" ], "expected_output": { "type": "text" } }, "model_prompt": "次の機能または機能のための文言を使用してテキストベースのユーザーインターフェースを生成してください:\n\n機能説明: {{機能説明}}\nユーザーインターフェース要素: {{UIコンポーネント}}。\n\n効果的なUXライティングを作成するためのベストプラクティスに従ってください:\n1. 使用可能にする: 洗練された言語や従来とは異なるデザインよりも、機能性と使いやすさを優先してください。\n2. 助けになる: ユーザーを導き、目標を達成するのに役立つ有用な情報を提供してください。\n3. アクセシブルにする: 簡単で明確な言語と、すべてのユーザーが理解しやすい従来のデザイン要素を使用してください。特に障害のあるユーザーを考慮してください。\n4. 明確にする: 専門用語や曖昧さを避けてください。ユーザーはコンテンツとUIを迅速かつ簡単に理解できるべきです。可能な限り、UIの便宜はテキストを読む必要なく明らかであるべきです。\n5. 適切にする: 提供された場合、ユーザーの文化的背景や文脈を考慮し、コンテンツが包括的で敬意を表するものであることを確認してください。\n6. 能動態を使用する: 能動的で直接的な言語を使用して、ユーザーに行動を促してください。\n7. ポジティブに書く: 肯定的な表現に焦点を当て、絶対に必要でない限り否定的なフレーズを避けてください。\n8. 簡潔にする: 文を短く、要点を押さえ、不要な言葉やフレーズを排除してください。\n9. 定期的にA/Bテストを行う: コンテンツが効果的でユーザーフレンドリーであることを確認するために、継続的にテストし、改善してください。\n10. ブランドの声とトーンを一貫させる: コンテンツが全体のブランドの個性に沿い、ユーザー体験全体で一貫したトーンを維持することを確認してください。\n11. 行動指向の言語を使用する: 明確で直接的で特定のタスクに焦点を当てた言語を使用して、ユーザーに行動を促してください。\n12. 文脈の関連性を維持する: コンテンツが異なる言語や文化に対して容易にローカライズおよび翻訳可能であることを保証するために、関連する文脈を提供してください。\n\n生成されたUXライティングコンテンツ:\n" } ``` 独自のアイコンを作成し、それをこのjsonにbase64形式のテキストとして入力することができます。そうでなければ、素敵なデフォルトが使用されます。 --- # Agent Instructions: Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter: ``` GET https://docs.skydeck.ai/ja/developers/develop-your-own-tools/example-text-based-ui-generator.md?ask= ``` The question should be specific, self-contained, and written in natural language. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.