Playground

The Playground is an interactive testing environment where you can experiment with AI models without writing any code.

What is the Playground?

The Playground allows you to:

✅ Test different AI models instantly
✅ Experiment with parameters (temperature, max_tokens)
✅ View real-time cost estimates
✅ Generate code snippets for your app
✅ No API key required (uses demo key)
✅ Free to use (no wallet deduction)

Getting Started

Access the Playground

Log in to your dashboard
Click "Playground" in the sidebar
Start chatting immediately - no setup required!

Interface Overview

Left Panel: Settings and system prompt Center: Chat conversation Right Panel: Model selector and parameters Bottom: Message input and send button

Model Selection

Choosing a Model

Click the model dropdown to see all available models:

GPT Models (OpenAI):

gpt-4-turbo - Latest GPT-4, best quality
gpt-4 - Standard GPT-4
gpt-3.5-turbo - Faster and cheaper
gpt-3.5-turbo-16k - Larger context window

Claude Models (Anthropic):

claude-3-opus - Most capable Claude model
claude-3-sonnet - Balanced performance
claude-3-haiku - Fast and efficient

Gemini Models (Google):

gemini-pro - Google's flagship model
gemini-pro-vision - With image understanding

Other Models:

Additional models available
Check models page for full list

Model Comparison

Try the same prompt with different models to compare:

Quality of responses
Response speed
Cost differences
Style and tone

System Prompt

What is a System Prompt?

The system prompt sets the AI's behavior and personality:

Default:

You are a helpful assistant.

Custom examples:

You are an expert Python developer who writes clean, efficient code.

You are a technical writer who explains complex topics simply.

You are a data analyst who provides insights backed by reasoning.

Best Practices

Do:

✅ Be specific about the role
✅ Include relevant expertise
✅ Mention preferred style (formal, casual, technical)
✅ Specify output format if needed

Don't:

❌ Make it too long (wastes tokens)
❌ Contradict yourself
❌ Include actual questions (put those in user messages)

Parameter Configuration

Temperature

Range: 0.0 - 2.0 Default: 0.7

What it controls:

Randomness and creativity of responses
Lower = more focused and deterministic
Higher = more creative and varied

Use cases:

0.0 - 0.3: Factual answers, code generation, math
0.4 - 0.7: General conversation, balanced output
0.8 - 1.5: Creative writing, brainstorming
1.6 - 2.0: Highly creative (can be unpredictable)

Examples:

Temperature = 0.0:

Q: What is the capital of France?
A: Paris is the capital of France.

Temperature = 1.5:

Q: What is the capital of France?
A: Ah, the romantic city of Paris, with its iconic Eiffel Tower
and charming cobblestone streets, serves as France's glittering
capital!

Max Tokens

Range: 1 - 4096 (varies by model) Default: 1000

What it controls:

Maximum length of response
1 token ≈ 0.75 words
Response stops when limit reached

Recommendations:

Short answers: 100-300 tokens
Paragraphs: 300-800 tokens
Essays: 1000-2000 tokens
Long content: 2000-4096 tokens

⚠️ Note: More tokens = higher cost. Set appropriately!

Top P (Nucleus Sampling)

Range: 0.0 - 1.0 Default: 1.0

What it controls:

Alternative to temperature for controlling randomness
Considers only top P% probability mass

Usage:

Usually keep at 1.0
Lower (0.1-0.5) for more focused responses
Not commonly adjusted

Relationship with temperature:

Don't adjust both simultaneously
Use one or the other

Stream

Toggle: On/Off Default: On

What it does:

On: Responses appear word-by-word (like ChatGPT)
Off: Full response appears at once

Benefits of streaming:

Better user experience
See progress in real-time
Can cancel if response is sufficient
Same cost as non-streaming

Chat Conversation

Sending Messages

Type your message in the input box
Press Enter or click Send
Watch response stream in
Continue conversation naturally

Conversation History

The Playground maintains conversation context:

All previous messages remembered
Model sees full conversation
Builds on previous context
Reset anytime with Clear Chat

Context window limits:

GPT-3.5 Turbo: ~4,000 tokens
GPT-4: ~8,000 tokens
GPT-4 Turbo: ~128,000 tokens
Claude 3: ~100,000 tokens

When limit reached:

Oldest messages automatically removed
Recent context maintained
Or start new conversation

Clearing Chat

Click "Clear Chat" button to:

Remove all messages
Start fresh conversation
Reset context
Previous parameters maintained

Cost Display

Real-Time Cost Estimation

As you chat, see:

Cost per message: Shown below each response
Total session cost: Cumulative for current chat
Estimated next message: Prediction based on current prompt

Cost Breakdown

Costs displayed:

Input tokens × input rate
Output tokens × output rate
Total cost in USD

Example:

Input: 50 tokens × $0.00001 = $0.0005
Output: 200 tokens × $0.00003 = $0.006
Total: $0.0065

Why is Playground Free?

Uses internal demo API key
Costs absorbed by platform
Helps you test before committing
No wallet deduction

Limits:

Reasonable daily usage
Not for production use
Build real apps with API keys

Code Export

Generate Code Snippets

Convert your playground conversation into working code!

Supported languages:

Python (OpenAI SDK)
Node.js/TypeScript
cURL commands

How to Export

Click "View Code" button (top right)
Select your language
Code snippet appears with:
- API key placeholder
- Model selection
- System prompt
- Messages from current conversation
- All parameters (temperature, max_tokens)
Click "Copy" button
Paste into your application

Python Example

Generated Python Code

from openai import OpenAI

client = OpenAI(
  api_key="YOUR_API_KEY",
  base_url="https://api.yoursite.com/v1"
)

response = client.chat.completions.create(
  model="gpt-4-turbo",
  messages=[
      {
          "role": "system",
          "content": "You are a helpful assistant."
      },
      {
          "role": "user",
          "content": "Your message here"
      }
  ],
  temperature=0.7,
  max_tokens=1000
)

print(response.choices[0].message.content)

Node.js Example

Generated Node.js Code

import OpenAI from 'openai';

const client = new OpenAI({
apiKey: 'YOUR_API_KEY',
baseURL: 'https://api.yoursite.com/v1'
});

async function main() {
const response = await client.chat.completions.create({
  model: 'gpt-4-turbo',
  messages: [
    {
      role: 'system',
      content: 'You are a helpful assistant.'
    },
    {
      role: 'user',
      content: 'Your message here'
    }
  ],
  temperature: 0.7,
  max_tokens: 1000
});

console.log(response.choices[0].message.content);
}

main();

cURL Example

Generated cURL Command

curl https://api.yoursite.com/v1/chat/completions \
-H "Content-Type: application/json" \
-H "Authorization: Bearer YOUR_API_KEY" \
-d '{
  "model": "gpt-4-turbo",
  "messages": [
    {
      "role": "system",
      "content": "You are a helpful assistant."
    },
    {
      "role": "user",
      "content": "Your message here"
    }
  ],
  "temperature": 0.7,
  "max_tokens": 1000
}'

Use Cases

Testing Models

Compare performance:

Ask same question to multiple models
Compare quality, speed, cost
Choose best for your use case

Example test:

Prompt: "Explain quantum computing in simple terms"
- Try GPT-3.5: Fast, cheap, good enough
- Try GPT-4: More detailed, more expensive
- Try Claude: Different style, similar quality

Prompt Engineering

Iterate on prompts:

Start with basic prompt
See response
Refine system prompt
Adjust parameters
Test variations
Export final version

Example iteration:

Try 1: "Write code"
→ Too vague

Try 2: "Write Python code to sort a list"
→ Works but generic

Try 3: [System: "You are an expert Python developer"]
        "Write efficient Python code to sort a list"
→ Better quality, includes explanation

Prototyping

Quick prototypes:

Test your idea in Playground
Refine approach
Export code
Integrate into your app
Create API key
Deploy!

Demonstrations

Show to stakeholders:

Demonstrate capabilities
Show different models
Explain parameters
Justify API costs
Get buy-in for integration

Tips & Tricks

Effective Prompting

Be specific: ❌ "Tell me about dogs" ✅ "Write a 200-word article about Golden Retriever health care tips"

Provide context: ❌ "Fix this code" ✅ "Fix this Python function that's supposed to calculate Fibonacci numbers but returns wrong results"

Use examples:

System: You are a data formatter
User: Convert this to JSON:
Name: John, Age: 30, City: NYC

[Shows example]

Now do the same for:
Name: Sarah, Age: 25, City: LA

Set constraints:

"Explain in exactly 3 bullet points"
"Response must be under 50 words"
"Use only simple vocabulary (grade 5 level)"
"Respond in JSON format"

Parameter Optimization

For factual Q&A:

Temperature: 0.0-0.3
Max tokens: 100-500
Model: GPT-3.5 Turbo (cost-effective)

For creative writing:

Temperature: 0.8-1.2
Max tokens: 1000-2000
Model: GPT-4 or Claude (better quality)

For code generation:

Temperature: 0.0-0.2
Max tokens: 500-1500
Model: GPT-4 Turbo (best for code)

Cost Optimization

In Playground:

Test with cheaper models first (GPT-3.5)
Only use GPT-4 if needed
Set reasonable max_tokens
Don't waste tokens on repetitive testing

In Production:

Use insights from Playground
Optimize prompts before deploying
Choose appropriate model for task
Set limits on API keys

Model may be temporarily unavailable
Try different model
Check status page
Contact support if persists

Conversation Context Lost

Problem: Model "forgets" earlier messages

Solution:

Context window full
Clear chat and start over
Use model with larger context (GPT-4 Turbo)
Keep conversations focused

Playground

On this page