Chameleon

User Center

User center features and functionality

User Center (Console)

The User Center provides users with tools to manage their account, credits, orders, and AI generations.

Accessing User Center

  1. Sign in to your account
  2. Click your profile in the top right
  3. Select User Center
  4. Or visit any /my-* or /ai-generator pages

Features Overview

My Orders

Location: /my-orders

Features:

  • View all your orders
  • Check order status
  • Download invoices
  • Manage subscriptions (Stripe Customer Portal)

Order Information:

  • Order number
  • Product name
  • Amount paid
  • Purchase date
  • Subscription status (if applicable)

Manage Subscription:

  • Click Manage Subscription on active subscriptions
  • Opens Stripe Customer Portal
  • Can upgrade, downgrade, or cancel

AI Generator

Location: /ai-generator

Features:

  • Generate AI images and videos
  • Choose from multiple providers
  • Real-time generation status
  • Download results
  • View generation history

Workflow:

  1. Select AI type (Image or Video)
  2. Choose provider and model
  3. Enter description
  4. Click Generate
  5. Wait for results (10s-5min)
  6. Download or view in history

Credit Costs:

  • Image: 3-5 credits
  • Video: 10 credits

See AI Generator Guide for details.

My Credits

Location: /my-credits

Features:

  • View current credit balance
  • See total earned credits
  • View credit transaction history
  • Understand credit sources

Credit History:

  • Transaction type (purchase, usage, reward)
  • Amount (+ or -)
  • Expiration date
  • Transaction time

Balance Calculation:

  • Left Credits: Current available balance
  • Total Credits: Lifetime earned

My Invites

Location: /my-invites

Features:

  • View your unique invite code
  • Copy invite link
  • See referral statistics
  • Track earned commissions

Invite Code:

  • Auto-generated 6-8 characters
  • Cannot be changed (system-managed)
  • Share with friends to earn rewards

Referral Rewards:

  • Earn commission when referrals purchase
  • Commission converts to credits
  • View pending and paid commissions

See Referral System for details.

API Keys

Location: /api-keys

Features:

  • Create API keys for programmatic access
  • View existing keys
  • Revoke keys
  • Use keys to call APIs

Creating API Key:

  1. Click Create New Key
  2. Enter key name (e.g., "Mobile App")
  3. Save
  4. Copy key (shown only once!)

Using API Keys:

const response = await fetch("https://your-domain.com/api/endpoint", {
  method: "POST",
  headers: {
    "X-API-Key": "your-api-key-here",
    "Content-Type": "application/json",
  },
});

Security:

  • Keys are hashed in database
  • Revoke immediately if compromised
  • Create separate keys for different apps

Common Tasks

Check Credit Balance

Visit /my-credits or call API:

const response = await fetch("/api/get-user-credits", {
  method: "POST",
});

const { data } = await response.json();
console.log("Credits:", data.left_credits);

Purchase Credits

  1. Visit /pricing
  2. Choose a plan
  3. Click Get Chameleon
  4. Complete Stripe checkout
  5. Credits added automatically

Plans:

  • One-time: Pay once, use within 1 year
  • Monthly: Recurring, credits reset monthly
  • Yearly: Recurring, credits reset yearly

Generate AI Content

  1. Visit /ai-generator
  2. Select type (Image/Video)
  3. Enter prompt
  4. Generate
  5. Download result

Tips:

  • Check credit balance first
  • Be specific in prompts
  • Download results immediately

Share Invite Link

  1. Visit /my-invites
  2. Copy your invite code
  3. Share link: https://your-domain.com/i/YOUR_CODE
  4. Earn commission when referrals buy

Manage Subscription

  1. Visit /my-orders
  2. Find active subscription
  3. Click Manage Subscription
  4. Stripe Portal opens:
    • Update payment method
    • Change plan (upgrade/downgrade)
    • Cancel subscription
    • View invoices

User Interface

Sidebar Navigation

Main Menu:

  • My Orders - Order history
  • AI Generator - Create content
  • My Credits - Credit management
  • My Invites - Referral program
  • API Keys - API access

Bottom Menu:

  • Pricing - Buy credits
  • Home - Return to homepage

Sidebar Toggle

Click hamburger icon (☰) to collapse/expand sidebar.

Theme Toggle

Switch between light and dark mode in sidebar footer.

Credit Management

Earning Credits

Ways to earn:

  1. New user bonus: 100 credits on signup
  2. Purchase: Buy credit packages
  3. Daily check-in: 1 credit per day (visit /api/ping)
  4. Referrals: Earn commission when friends buy

Spending Credits

Credit costs:

  • Image generation: 3-5 credits
  • Video generation: 10 credits
  • Future features: Custom costs

Monitor usage:

  • Check balance before generating
  • View transaction history
  • Set personal budget limits

Credit Expiration

  • One-time purchase: 1 year
  • Subscription: End of billing cycle
  • Referral rewards: 1 year

Tip: Use credits before they expire!

Account Settings

Profile Information

View your profile:

POST /api/get-user-info

Displayed:

  • Email (from OAuth)
  • Nickname (from OAuth)
  • Avatar (from OAuth)
  • Invite code
  • Registration date

Note: Profile info comes from OAuth provider (Google/GitHub) and cannot be changed in Chameleon directly.

Invite Code

Your invite code is auto-generated and read-only:

  • Unique 6-8 character code
  • Cannot be changed
  • Used for referral program

Notifications

Order Confirmation

When you purchase:

  • Success message on screen
  • Redirected to /my-orders
  • Credits added immediately

Generation Complete

When AI generation finishes:

  • Success toast notification
  • Results appear in UI
  • Credits deducted (shown in history)

Daily Ping Reward

When you check in:

  • "Ping success, 1 credit added" message
  • Credits updated instantly

Mobile Experience

The User Center is fully responsive:

  • Touch-friendly interface
  • Optimized layouts for mobile
  • Swipe gestures (where applicable)
  • Fast loading on mobile networks

Privacy and Security

Data Privacy

  • Profile data from OAuth providers
  • Orders and credits private to each user
  • Generation history private
  • API keys hashed in database

Security Features

  • Session-based authentication
  • HTTPS enforced in production
  • API key authentication for external access
  • No password storage (OAuth only)

Troubleshooting

Can't access User Center

Problem: Redirected to sign-in

Solution:

  • Sign in with Google or GitHub
  • Check authentication is working
  • Clear browser cookies and retry

Credits not updating

Problem: Balance doesn't change after purchase

Solutions:

  1. Refresh the page
  2. Check /my-credits for transaction history
  3. Verify payment success in /my-orders
  4. Contact support if payment succeeded but credits not added

AI Generator stuck

Problem: Generation never completes

Solutions:

  1. Check credit balance (need 3-10 credits)
  2. Wait longer (videos take 1-5 minutes)
  3. Check generation history for errors
  4. Try again or use different provider

Subscription not showing

Problem: Paid but subscription not active

Solutions:

  1. Check /my-orders for order status
  2. Verify payment in Stripe Dashboard
  3. Check webhook was received (admin: check logs)
  4. Contact support with order number

Next Steps