AI Stream Companion Widget

Thanks for downloading our AI Stream Companion Widget!

This guide will take you through the setup process, explore all the features and customization options, and explain everything you need to know to get your widget up and running.


⚠️ Take note: This widget is hosted on StreamElements — make sure you have a StreamElements account before setting it up!

Before We Begin (Important!)

Before we dive into setting up your AI Stream Companion Widget, let's cover a few essentials.

First, you'll need an OpenAI API account, which is different from a ChatGPT account. The OpenAI API powers the AI capabilities of your widget, allowing it to generate responses and interact with your audience.

While the OpenAI API is a paid service, and the minimum amount of credits you can purchase is $5, it's very cost-effective. Typically, one interaction with your AI companion will cost around $0.0001. For example, if your AI responds to 1,000 chat messages in a stream, it will cost you approximately $0.10.

Alternatively, your widget can operate without an OpenAI API account at no extra cost, but it will only function as a TTS companion that reads out messages triggered by a command without generating its own responses.

We will provide a detailed explanation of usage costs and how to manage them later in this guide.

Setting Up Your OpenAI API Account

  1. Visit the OpenAI API page and click the "Sign Up" button.
  2. Fill out the signup form with your name, email address, and password. Submit the form to create your account.
  3. OpenAI will send a verification email to the address you provided. Locate this email in your inbox and click the verification link to confirm your email address.
  4. Once your email is verified, you can log in to your OpenAI account.
  5. Navigate to the dashboard and verify your phone number. Without this step, you won’t be able to create an API key in the future.
  6. Open your profile and proceed to the billing tab of your organization.
  7. Click on “Add Payment Details,” choose “Individual,” and enter your billing information.
  8. Once your billing address is added, you can purchase credits. The minimum purchase amount is 5$.

Take a note! If you don’t want your balance to recharge automatically, please uncheck this option

9. Confirm Payment and we’re ready for the next step.

Getting Your Personal OpenAI API Key

  1. Navigate to your Dashboard
  2. Open the “API Keys” tab
  3. Press “Create New Secret Key”
  4. Give it a name and click “Create Secret Key”
  5. Copy your secret key to a secure location and finally click “Done”.

StreamElements Widget Setup

  1. Log in to StreamElements with your Youtube or Twitch account
  2. Go to the “2. Widget” folder in the package you’ve downloaded
  3. Pick the file that corresponds to your streaming platform (Twitch or YouTube) and double-click to install it.
  4. Now click the Edit button on the widget you just installed.
  5. Select the AI Companion layer and click settings.
  6. Go to the AI Model settings.
  7. Paste your OpenAI API Key into the corresponding field.
  8. Click “Save” in the top right corner
  9. Your widget should now be up and ready to be customized!

Widget Customization

Now it’s time to make the widget look, sound and behave how you want. In this section we'll explain how to adjust each setting to personalize your own AI Stream Companion.

While it may seem that there are too many settings, don’t worry — all of them are straightforward and fairly easy to tweak. Let’s dive in!


⚠️IMPORTANT

For all of your customizations to take effect, you need to press "Save" in the top right corner of the editor before adding the widget to your streaming software!

https://d33v4339jhl8k0.cloudfront.net/docs/assets/606af262068dbf2f4446817f/images/65805fd675eb4a5f70498ded/file-5fLVaVmCX8.png

AI Model Settings

The AI Model Settings are essential for customizing the responses, behavior and operation costs of your AI Companion. This section will guide you through various settings and provide detailed explanations to help you optimize them for your needs.

GPT Model

You can choose between two AI models for your widget:

  • GPT-4o Mini: This model is designed for advanced interactions within your stream. It provides sophisticated responses that can handle complex viewer questions, participate in detailed chat conversations, and offer real-time feedback. Its cost-effectiveness makes it a great option for streamers who want a reliable AI companion without incurring high usage costs.
  • GPT-4o: The most advanced model, GPT-4o, offers superior capabilities and a deeper understanding of context, which is perfect for more complex and nuanced interactions. This model excels at creating engaging and dynamic responses that can enhance viewer interaction significantly. Due to its advanced features, GPT-4o is, unfortunately, much more expensive, making it a better choice for streamers who require a higher level of interaction quality and are willing to invest in premium performance.

Cost Comparison:

  • GPT-4o Mini: ±$0.00038 per 1,000 tokens
  • GPT-4o: ±$0.030 per 1,000 tokens

Choosing the right model depends on your specific needs and budget. If you need sophisticated interactions and don't mind the extra cost, GPT-4o is the best choice. For general use, GPT-4o Mini should be sufficient.


Max Response Tokens

Tokens are a way to measure the length of text in OpenAI's API. Think of them as groups of characters. Most of the time, a token corresponds to a word, but it can also consist of characters, parts of words or multiple words. Each token represents a small chunk of text, so longer sentences and complex words will use more tokens.


Why Tokens Matter:

Tokens are important because they determine how much text your AI can process and how much it will cost. A short response uses fewer tokens, which costs less, while a detailed response uses more tokens, which costs more.


What Counts Towards Token Usage:

When your AI responds, several factors contribute to the total token usage:

  1. Personality Prefix: The initial setup that defines your AI's character and style.
  2. Chat Messages: The messages your viewers send in the chat.
  3. Generated Responses: The replies your AI creates based on the chat messages.
  4. Message History: If you choose to keep a conversation history, past messages are included in the token count.

These four factors are added together, and their sum defines your total token usage. There's no need to worry about big costs because, even with all of these factors enabled, if your widget is using the GPT-4o Mini model, the usage will be minimal. However, with GPT-4o, costs can rise quickly, so we generally recommend sticking to GPT-4o for most users.


Optimal Setting: We recommend setting the maximum tokens per response to 100. This strikes a balance between providing detailed responses and keeping costs manageable.

We'll have a detailed token usage guide further down with useful links, in-depth explanations, and specific examples to help you manage and optimize your token usage effectively.

Personality Prefix

The Personality Prefix allows you to set a predefined character or style for your AI companion. This setting is crucial for shaping the tone, behavior, and interaction style of your AI, making the responses more engaging and aligned with your stream's theme.

How It Works:

You provide a short prompt that defines the personality of your AI. This prompt guides the AI on how to respond to chat messages, ensuring consistency in character and tone. To manage token usage and prevent responses from being cut off, add specific instructions to limit the length of responses.


Examples:

  • Friendly Gamer: "You are a cheerful gamer who loves sharing tips and tricks for popular games."
  • Sarcastic Bot: "You are a sarcastic bot who gives witty and humorous responses to questions."
  • Knowledgeable Tutor: "You are a knowledgeable tutor who provides clear and detailed explanations on various topics."
  • Sherlock Holmes: "You are Sherlock Holmes, the brilliant detective, who analyzes chat messages with keen observation and provides insightful responses."
  • Tony Stark (Iron Man): "You are Tony Stark, a witty and charismatic genius, who responds to questions with confidence and a touch of humor."
  • Gandalf the Grey: "You are Gandalf the Grey, a wise and powerful wizard, who offers sage advice and mystical insights."
  • Friendly Dog: "You are a friendly and helpful dog. Answer questions politely. Reply with 2 sentences max."
  • Cute Cat: "You are a cute little cat that loves everyone. Reply with 10 words max."

We'll have a separate block with tips and tricks to create effective personality prompts down below, helping you get the best possible interactions from your AI companion. These tips will include ways to refine your prompts for more specific behaviors, how to adjust the tone to match your stream's atmosphere and much more.


Conversation History

The Conversation History feature enhances your AI Stream Companion Widget by allowing it to remember past interactions. This capability helps create more dynamic and engaging experiences for your viewers.


How Conversation History Works: There are three main functions to consider when setting up conversation history:

  1. Enable Conversation History: Enabling this feature allows the AI to retain information from previous interactions. This means the AI can reference past messages, creating a more coherent and context-aware conversation. While this feature can significantly enrich interactions, it also increases token usage since more data needs to be processed.
  2. Setting History Length: You can adjust the number of past messages the AI remembers. A good starting point is setting the history length to about three past messages. This setting is flexible and can be tailored to your needs, but keep in mind that a longer history will increase token usage and, consequently, costs. Adjusting the history length allows you to balance the depth of interactions with budget considerations.
  3. Global History (Checkmark): The global history option allows all users to share the same conversation history. This means that the AI can draw on interactions from multiple users, providing a more collective experience. However, this option significantly increases token usage because it involves sending and processing a larger amount of data.

Cost Implications: Using conversation history can enhance your AI's responses by making them more contextually relevant, but it comes at a cost. As more tokens are needed to process and retain the conversation history, the overall usage and expenses increase. Therefore, it’s crucial to balance the desired level of interaction depth with your budget. If minimizing costs is a priority, starting with a shorter history length or disabling conversation history might be the best approach.


Practical Example:

  • Without Conversation History: A viewer asks, "What’s your favorite game?" The AI responds based solely on the personality prefix, "I love playing adventure games!"
  • With Conversation History: If another viewer later asks, "Do you prefer RPGs or adventure games?" the AI can reference the past interaction and respond more contextually, "I mentioned earlier that I love adventure games, but RPGs are also great for their storytelling!"

AI Model (Advanced) Settings

The advanced settings provide additional control over how your AI companion generates responses without affecting token usage, ensuring you can create engaging and unique interactions for your viewers. Below, we'll explain each setting and provide examples to illustrate their effects.

Creativity controls how imaginative the AI's responses are. Lower values make the output more predictable and straightforward, while higher values introduce more creativity and variety.

Low Creativity (e.g., 0.2): The AI will produce more consistent and focused responses, ideal for clear and factual answers.

  • Example:
    • Viewer: "What's the capital of France?"
    • AI Response: "The capital of France is Paris."

High Creativity (e.g., 0.8): The AI will generate more varied and imaginative responses, making interactions more engaging and fun.

  • Example:
    • Viewer: "Tell me something interesting about France."
    • AI Response: "France is home to the Eiffel Tower, one of the most iconic landmarks in the world. Did you know it's repainted every seven years?"

Response Variety controls how diverse the AI's responses are. It sets the range of possible responses the AI can choose from, with lower values resulting in more focused responses and higher values allowing for more diverse answers.

Low Response Variety (e.g., 0.1): The AI will choose from the most likely responses, making the output more predictable.

  • Example:
    • Viewer: "What's your favorite movie?"
    • AI Response: "My favorite movie is Inception."

High Response Variety (e.g., 0.9): The AI will consider a broader range of responses, leading to more creative and diverse answers.

Example:

  • Viewer: "What's your favorite movie?"
  • AI Response: "I love many movies, but one that stands out is The Matrix for its groundbreaking effects and story."

Repetition Avoidance discourages the AI from repeating words or phrases it has already used, promoting more varied and dynamic responses. The higher the setting, the less likely the AI is to repeat itself.

  • Low Repetition Avoidance (e.g., 0): The AI might repeat information or phrases, which can be useful for reinforcing key points.
    • Example:
      • Viewer: "What games do you like?"
      • AI Response: "I like adventure games. Adventure games are exciting and fun."
  • High Repetition Avoidance (e.g., 1.0): The AI will avoid repeating itself, leading to more diverse and engaging interactions.
    • Example:
      • Viewer: "What games do you like?"
      • AI Response: "I enjoy a variety of games, especially those with intricate plots and challenging gameplay."

By adjusting these settings, you can fine-tune your AI companion to better match your stream’s style and audience preferences. Experimenting with different values will help you find the perfect balance for your needs.

Detailed Token Usage Guide

Understanding token usage is essential for managing costs and optimizing your AI Stream Companion Widget’s performance. In this section, we’ll break down how tokens are used, provide specific examples of token usage in different contexts, and share practical tips to help you control costs.

Token Costs:

  • GPT-4o Mini: ±$0.00038 per 1,000 tokens
  • GPT-4o: ±$0.030 per 1,000 tokens

Components of Token Usage:

  1. Personality Prefix: This is the initial setup that defines your AI's character and style. It typically uses a small number of tokens (e.g., 10-20 tokens).
  2. Chat Messages: These are the messages your viewers send in the chat. Each character in a chat message counts as one token. For example, a 100-character message uses approximately 23 tokens.
  3. Generated Responses: These are the replies your AI creates based on the chat messages. The length of the response directly impacts token usage. For instance, a 50-token response is concise, while a 100-token response is more detailed. The AI chooses the length of its responses on its own within the maximum token limit you set. So, if you've set a max token usage at 100, it can generate a response anywhere between 5 and 100 tokens. To better control its behavior and minimize token usage, you can add a specific instruction to the end of your personality prefix. For example: "*your main personality prefix*. Reply with 2 sentences max."
  4. Message History: If you choose to keep a conversation history, past messages are included in the token count. The more history you keep, the higher the token usage.

These components are added together to determine your total token usage per interaction. Let's go through some specific examples to illustrate how this works.

Example Scenarios:

  1. Detailed Interaction (GPT-4o Mini)
    • Personality Prefix: 15 tokens
    • Chat Message: "What's your favorite movie?" (6 tokens)
    • Generated Response: "I love watching sci-fi movies!" (7 tokens)
    • Total Tokens: 15 + 6 + 7 = 28 tokens
    • Cost: 28 tokens * $0.00038/1,000 = $0.00001064
  2. Detailed Interaction (GPT-4o)
    • Personality Prefix: 15 tokens
    • Chat Message: "Can you give me tips for improving my gameplay?" (10 tokens)
    • Generated Response: "Sure! Focus on your aim by practicing daily, learn the maps to understand key areas, and always communicate with your team for better coordination and strategy." (28 tokens)
    • Total Tokens: 15 + 10 + 28 = 53 tokens
    • Cost: 53 tokens * $0.030/1,000 = $0.00159
  3. With Conversation History (GPT-4o Mini)
    • Personality Prefix: 15 tokens
    • Chat Message: "Do you prefer RPGs or adventure games?" (8 tokens)
    • Previous Message: "I love playing adventure games!" (7 tokens)
    • Generated Response: "I mentioned earlier that I love adventure games, but RPGs are also great for their storytelling." (19 tokens)
    • Total Tokens: 15 + 8 + 7 + 19 = 49 tokens
    • Cost: 49 tokens * $0.00038/1,000 = $0.00001862
  4. With Extended Conversation History (GPT-4o Mini)
      • Personality Prefix: 15 tokens
      • Chat Messages:
        • "What's your favorite game?" (6 tokens)
        • "Do you prefer RPGs or adventure games?" (8 tokens)
        • "Why do you like adventure games?" (7 tokens)
      • Previous Messages:
        • "I love playing adventure games!" (7 tokens)
        • "I mentioned earlier that I love adventure games, but RPGs are also great for their storytelling." (19 tokens)
      • Generated Response: "Adventure games have exciting plots and challenging puzzles that I really enjoy!" (15 tokens)
      • Total Tokens: 15 (prefix) + 6 + 8 + 7 + 7 (previous) + 19 (previous) + 15 (response) = 77 tokens
      • Cost: 77 tokens * $0.00038/1,000 = $0.00002926

Real-World Example: During our development phase, we tested the widget on streams for a few hours each day. For instance, 14 hours of continuous streaming and interaction with the AI companion cost us less than 50 cents using both GPT 4o Mini and 4o models. This highlights how cost-effective the usage can be, especially with regular, concise interactions.


Cost Estimate for 1,000 Interactions:

  • GPT-4o Mini: Assuming an average of 50 tokens per interaction:
    • 1,000 interactions * 50 tokens = 50,000 tokens
    • Cost: 50,000 tokens * $0.00038/1,000 = $0.019
  • GPT-4o: Assuming an average of 50 tokens per interaction:
    • 1,000 interactions * 50 tokens = 50,000 tokens
    • Cost: 50,000 tokens * $0.030/1,000 = $1.50

Cost Management Tips:

  • Monitor Usage: Keep an eye on your token usage regularly. OpenAI provides dashboards and tools to track this.
  • Set Limits: Use the max response tokens setting to control the length of responses.
  • Adjust History Length: If using conversation history, start with a shorter length and increase only if necessary.
  • Choose the Right Model: For most interactions, GPT-4o Mini offers a good balance of performance and cost. Reserve GPT-4o for more complex and high-value interactions.

To better understand how tokens work and to see how many tokens your text will use, you can use OpenAI's official tokenizer tool: OpenAI Tokenizer. This tool helps visualize token usage, making it easier to manage and optimize your settings.

Voice Settings

The Voice Settings section allows you to customize the Text-to-Speech (TTS) capabilities of your AI Stream Companion Widget. These settings enable you to control whether the AI uses voice, which voice it uses, and the volume of the voice. Below, we’ll explain each parameter in detail to help you optimize the audio experience for your viewers.

Use Voice

  • Enable/Disable Voice: This setting allows you to turn the TTS feature on or off. When enabled, your AI companion will speak responses aloud, adding an auditory element to interactions. When disabled, the AI will only provide text responses.

TTS Voice

  • Select Voice for TTS: This setting allows you to choose from a wide range of voices for your AI companion. The widget currently supports 206 different voices in 69 languages. This variety ensures that you can find a voice that matches your stream’s style and the preferences of your audience.

Voice Volume

  • Set Volume of Voice: This setting controls the volume of the AI’s voice. You can adjust it to ensure the TTS audio is clear and appropriately balanced with other sounds on your stream. Setting the right volume level ensures that your viewers can hear the AI’s responses clearly without being too loud or too soft.

Text Box Settings

The Text Box Settings section allows you to customize the appearance and behavior of the text box that displays your widget's answers. This feature is essential for ensuring that the AI's responses are visually appealing and easy for your viewers to read. You can adjust various aspects of the text box to match your stream's theme and layout, creating a seamless and engaging viewer experience.

Name Description
Show Textbox Enable or disable the text box display.
Textbox Scale Direction Choose whether new lines should be added from the top or the bottom of the text box.
X Position Adjust the horizontal position of the text box on the screen.
Y Position Adjust the vertical position of the text box on the screen.
Max Width Set the maximum width of the text box as a percentage of the screen width.
Google Font Select any Google Font for the text displayed in the text box.
Font Weight Choose the weight of the font, affecting the thickness of the text.
Text Color Set the color of the text.
Box Background Color Choose the background color of the text box.
Box Border Color Set the color of the text box border.
Box Border Size Define the width of the text box border.
Box Corner Roundness Adjust the roundness of the text box corners.

Character Settings

The Character Settings section allows you to customize the visual representation of your AI companion. This feature is highly versatile, enabling you to use premade characters, upload your own images or gifs, and configure animation settings to bring your AI companion to life.


How It Works

  1. Premade Characters: You have three premade characters available that you can use immediately. These characters come with preset animations and are ready to integrate into your stream without any additional setup.
  2. Custom Characters: If you prefer a more personalized touch, you can upload your own images or gifs. This allows for greater flexibility and creativity, ensuring your AI companion matches your stream's theme perfectly.
  3. Disable Images: If you choose, you can disable the character images altogether. To do this, select the custom character option and make both the idle and talking image slots empty. This will ensure that the widget operates without displaying any character images.

Uploading a Custom Character

Custom characters in our widget work similarly to "pngtubers," with two slots for images or gifs:

  • Idle State: This image is displayed when your character is not speaking. It represents the character in a neutral or resting pose.
  • Talking State: This image is shown when your character is speaking. It typically features an open mouth or other indicators of speech.

You can opt to use only one image if you prefer simplicity, but using two distinct images for idle and talking states provides the best visual effect. We’ll have a more detailed tips & tricks guide on how to prepare your custom characters later in this guide.


Steps to Upload a Custom Character:

  1. Select the custom character option in the widget settings.
  2. Upload your idle state image.
  3. Upload your talking state image.
  4. Adjust the transform points and animation settings to fine-tune your character’s movements.
  5. To disable character images entirely, leave both the idle and talking image slots empty.

Animation Settings

The animation settings control how your character moves and reacts during interactions. These settings allow you to create a more dynamic and engaging visual experience.

  • Transform Point: This defines the pivot point around which your character will move. You can adjust both the horizontal and vertical positions to ensure the movement looks natural.
  • Image Open Threshold: This setting determines when to switch from the idle image to the talking image. A higher threshold means the talking image will be shown less frequently.
  • Scale Animation Multipliers: These multipliers control the intensity of the character's animation along the X and Y axes. Adjusting these settings can make the character's movements more exaggerated or subtle.

Commands Settings

The Command Settings section allows you to configure the specific commands that your viewers can use to interact with your AI Stream Companion Widget. There are two main types of commands:

  1. Chat Interaction Commands: These commands allow your chat to interact directly with the AI widget. By default, the command to trigger this interaction is !ask . Viewers can use this command to ask questions or engage in conversations with the AI.
  2. Text-to-Speech (TTS) Commands: These commands are used to make announcements or say anything you’d like through the widget’s TTS functionality. By default, the command to trigger this is !say .

These commands help streamline interactions and ensure that your stream remains engaging and dynamic. Below, we’ll provide an overview of the various parameters you can adjust to customize these commands.


Overview of Command Parameters:

  • Command Prefix: This sets the character(s) that must be used at the beginning of a command. For example, using ! as the prefix means commands will start with an exclamation mark, like !ask and !say .
  • Time Between Commands (Seconds): This parameter sets a cooldown period between commands, preventing spamming and ensuring the AI has time to respond appropriately.
  • Cooldown Skip Auth Level: This setting determines who can bypass the cooldown period. It is recommended to set this to "Moderator or higher" to maintain control over command usage.
  • Priority Auth Level (Skip Queue): This parameter specifies who can skip the command queue and have their command processed immediately. Again, setting this to "Moderator or higher" is advisable.
  • Ask Command Trigger: This sets the command name for the ask function. By default, this is !ask , but you can customize it to fit your stream’s style.
  • Ask Command Auth Level: This determines who is allowed to use the ask command. Setting appropriate permissions ensures only trusted or subscribed users can interact with the AI.
  • Say Command Trigger: This sets the command name for the say function. By default, this is !say , but it can be changed as needed.
  • Say Command Auth Level: This sets who can use the say command. It’s important to control this to prevent misuse and ensure that announcements are made appropriately.

Shadow Settings

The Shadow Settings section allows you to add and customize shadow effects for your AI companion's text box. These settings enhance the visual appeal and readability of the text box by adding depth and contrast, making it stand out more effectively on your stream.

Below, we provide an overview of the various parameters you can adjust to fine-tune the shadow effects:

Overview of Shadow Parameters:

  • Enable Shadow: This option allows you to enable or disable the shadow effect. Enabling the shadow can improve the text box's visibility and aesthetic appeal.
  • Offset X: This parameter sets the horizontal offset of the shadow in pixels. Adjusting this value shifts the shadow left or right, creating a dynamic effect.
  • Offset Y: This parameter sets the vertical offset of the shadow in pixels. Adjusting this value moves the shadow up or down, adding to the depth effect.
  • Blur: This controls the amount of blur applied to the shadow. Increasing the blur creates a softer, more diffused shadow, while decreasing it results in a sharper, more defined shadow.
  • Color: This parameter allows you to select the color of the shadow. Choosing a contrasting color can enhance readability and make the text box more visually appealing.

⚠️ IMPORTANT

For all of your customizations to take effect, you need to press "Save" in the top right corner of the editor before adding the widget to your streaming software!

https://d33v4339jhl8k0.cloudfront.net/docs/assets/606af262068dbf2f4446817f/images/65805fd675eb4a5f70498ded/file-5fLVaVmCX8.png

Adding the Widget to Your Streaming Software

OBS Studio

  1. Copy the URL of your Widget from the StreamElements dashboard
  2. Open OBS Studio
  3. Click “Add Source” (plus icon) in the Sources section.
  4. Add a “Browser” source, give it a name, and press “Ok”
  5. Paste the URL you’ve copied
  6. Set the width to 1920 and the height to 1080
  7. Click on the “Control Audio via OBS” checkbox and and press “Ok”
  8. To enable monitoring for audio of your widget navigate to the “Advanced Audio Properties” at the bottom left corner of the Audio Mixer section.
  9. Set the “Audio Monitoring” for your Browser Source to “Monitor and Output”.
  10. Click “Close”

Streamlabs Desktop

  1. Copy the URL of your Widget from the StreamElements dashboard
  2. Open Streamlabs Desktop
  3. Click “Add a new Source” (plus icon) in the Sources section.
  4. Choose “Browser Source”, give it a name, and press “Add Source”.
  5. Paste the URL you’ve copied previously
  6. Set the width to 1920 and the height to 1080
  7. Click on the “Control Audio via Streamlabs Desktop” checkbox
  8. To enable monitoring for audio of your widget navigate to the “Advanced Audio Settings” in the Mixer section.
  9. Open your Browser Source audio parameters
  10. Set the “Audio Monitoring” to “Monitor and Output”.
  11. Close the Advanced Audio Settings tab and you’re done!

Testing The Widget

Testing your AI Stream Companion Widget is a crucial step to ensure everything functions smoothly and meets your expectations. Proper testing helps you identify any issues and fine-tune settings for optimal performance. Here’s a step-by-step guide to effectively test your widget:


1. Setting Up for Testing

Using Your Streaming Software:

  • OBS Studio or Streamlabs: Add the widget as a browser source in your streaming software. This allows you to monitor and test the widget’s functionality in an environment similar to your actual streams.
  • Enable Audio Monitoring: Ensure that the browser source’s audio monitoring is enabled in your software. This allows you to hear the TTS responses directly, making it easier to verify the accuracy and quality of the audio output.

2. Testing in Twitch Chat

Offline Mode Testing:

  • Access Twitch Chat Offline: You don’t need to be live to test the widget. Access your Twitch channel’s chat in offline mode and send messages using the commands you’ve set up.
  • Send Test Commands: Use the chat interaction command (e.g., !ask ) and the TTS command (e.g., !say ) to see how the widget responds. This helps you ensure that the AI generates appropriate responses and that the TTS function works correctly.

3. Testing Different Features

Voice Settings:

  • Test Various Voices: Cycle through different TTS voices to find the one that best fits your stream’s style. Adjust the voice volume to ensure it’s clear and appropriately balanced with other audio sources.

Text Box Settings:

  • Check Visibility and Readability: Send messages to see how the text box displays responses. Adjust the position, size, and font settings to ensure the text is readable and visually appealing.

Character Settings:

  • Character Animations: If you’re using custom character images or gifs, test the idle and talking states to ensure they transition smoothly. Adjust animation settings as needed to create a lively and engaging visual effect.
  • Disable Images: If you’ve chosen to operate without character images, confirm that leaving the idle and talking image slots empty results in the desired behavior.

Command Settings:

  • Cooldowns and Permissions: Verify that command cooldowns and permissions are set correctly. Ensure that only authorized users can bypass cooldowns or skip the command queue.

Shadow Settings:

  • Visual Enhancements: Test different shadow settings to enhance the text box’s visibility and integration with your stream layout. Adjust offsets, blur, and color to achieve the best visual effect.

4. Fine-Tuning

Adjust Settings Based on Feedback:

  • Iterative Testing: Make incremental adjustments based on what you observe during testing. This could include tweaking the personality prefix, modifying token limits, or changing visual settings.
  • Viewer Feedback: If possible, involve some of your regular viewers in testing. Their feedback can provide valuable insights into how the widget performs in a real-world context.

Advanced Personality Prompting Guide

Creating a compelling personality for your AI Stream Companion Widget involves more than just basic instructions. By mastering advanced prompting techniques, you can ensure your AI delivers engaging, contextually appropriate, and consistently high-quality interactions. This guide covers advanced tips and tricks to elevate your personality prompts, making them more efficient and effective.


Manage Response Length

If your widget's responses are being cut off abruptly, it’s likely due to hitting the token usage limit. While you can increase the token limit, this will also increase costs. A more efficient way to manage this is by refining your personality prompt to limit the length of responses.

Tip: Add a specific instruction at the end of your prompt to limit response length.

Examples:

  1. "You are a friendly and helpful dog. Answer questions politely. Reply with 2 sentences max.”
  2. “You are a cute little cat that loves everyone. Reply with 10 words max.”

Provide Direct Instructions

The AI performs better with clear and concise instructions. Avoid using unnecessary words that can confuse the model.

Poorly Optimized Prompts:

  1. "Hi there! It would be great if you could help me with answering some questions in a very nice and friendly manner, please. Thanks!"
  2. "Hello, I hope you are having a good day. Could you please share your knowledge about different topics in a very clear and concise way? Maybe add a joke or two if it fits. Thanks!"
  3. “Can you act like Tony Stark from Iron Man, being very smart and funny, making jokes and talking about tech stuff?"

Optimized Prompts:

  1. "You are a friendly assistant. Answer questions politely and clearly."
  2. "You are a knowledgeable guide. Provide concise and informative answers with occasional humor."
  3. “You are Tony Stark. Be witty, smart, and talk about technology."

Prioritize Instructions

The order in which you place instructions in your prompt can affect their priority. Ensure that the most important traits are listed first to emphasize them in the AI's behavior.

Prompt Examples:

  1. Emphasizing Clarity:

    "You are a friendly and knowledgeable assistant. Be clear and concise in your responses. Answer questions politely and add humor if appropriate. Your answers are informative and short."

  2. Emphasizing Engagement:

    "You are an engaging and humorous AI companion. Be humorous and engaging in your responses. Provide detailed answers to questions and ensure clarity. Always keep the conversation lively and entertaining."

  3. Emphasizing Professionalism:

    "You are a professional and articulate AI. Provide detailed and informative answers. Maintain a formal tone and ensure clarity in all responses. Add a touch of friendliness to keep the interaction pleasant."

  4. Emphasizing Knowledge:

    "You are a knowledgeable AI expert. Provide in-depth and comprehensive answers to all questions. Ensure your responses are clear and concise. Add a friendly tone to make the interaction more approachable."


Be Creative

You can define unique and unconventional traits to make your AI behave in specific, entertaining ways.

Examples:

  1. "You are a quirky inventor who believes every problem can be solved with duct tape and rubber bands. Speak with excitement and a hint of madness."
  2. "You are a Victorian-era butler. Respond with utmost formality and elaborate politeness, using archaic language."
  3. "You are an alien from the planet Zorg, fascinated by human customs and often hilariously misunderstanding them. Speak with curiosity and confusion."
  4. "You are a Shakespearean actor. Respond to all questions in the style of Shakespearean dialogue, with dramatic flair and old English vocabulary."
  5. "You are a conspiracy theorist who believes all household appliances are part of a secret government surveillance program. Speak with urgency and paranoia."
  6. "You are a stand-up comedian. Answer every question with a joke or a funny comment, keeping the tone light and entertaining."

Tell About Yourself

Incorporate information about yourself to make the AI interactions more personal and engaging. You can instruct the AI to interact with you in a specific way, adding humor and personality to your stream.

  • "You are a sarcastic friend that enjoys playfully roasting Your Nickname. Make light-hearted jokes at their expense."
  • "You love talking about Your Nickname favorite games, like 'The Legend of Zelda' and 'Dark Souls'."