Room Visualizer

A responsive, flexible room visualization component that allows users to select room types and styles, generate room images, and view furniture product recommendations.

API

The Room Visualize API allows you to generate room visualizations based on room types and styles.

Authentication

You can authenticate using either:

Option 1: Authorization: Bearer YOUR_TOKEN header (obtain from /api/v1/token)

Option 2: x-client-secret: YOUR_CLIENT_SECRET header

Create Room Visualization

Endpoint: POST /api/v1/room-visualize

Generate a room visualization by specifying room type, styles, and optional base image.

curl -X POST "https://platform.youzu.ai/api/v1/room-visualize" \
  -H "Authorization: Bearer YOUR_TOKEN" \
  -F "room=living room" \
  -F "styles=modern" \
  -F "styles=minimal" \
  -F "aspectRatio=16:9"

curl -X POST "https://platform.youzu.ai/api/v1/room-visualize" \
  -H "x-client-secret: YOUR_CLIENT_SECRET" \
  -F "room=living room" \
  -F "styles=modern" \
  -F "styles=minimal" \
  -F "aspectRatio=16:9"

// Generate a room visualization using token
const formData = new FormData();
formData.append('room', 'living room');
formData.append('styles', 'modern');
formData.append('styles', 'minimal');
formData.append('aspectRatio', '16:9');

fetch('https://platform.youzu.ai/api/v1/room-visualize', {
  method: 'POST',
  headers: {
    'Authorization': 'Bearer YOUR_TOKEN'
  },
  body: formData
})
.then(response => response.json())
.then(data => {
  console.log('Generation started:', data);
  // Poll for completion using data.id
})
.catch(error => {
  console.error('Error:', error);
});

// Generate a room visualization using client secret
const formData = new FormData();
formData.append('room', 'living room');
formData.append('styles', 'modern');
formData.append('styles', 'minimal');
formData.append('aspectRatio', '16:9');

fetch('https://platform.youzu.ai/api/v1/room-visualize', {
  method: 'POST',
  headers: {
    'x-client-secret': 'YOUR_CLIENT_SECRET'
  },
  body: formData
})
.then(response => response.json())
.then(data => {
  console.log('Generation started:', data);
  // Poll for completion using data.id
})
.catch(error => {
  console.error('Error:', error);
});

import requests

# Generate a room visualization using token
url = 'https://platform.youzu.ai/api/v1/room-visualize'

headers = {
    'Authorization': 'Bearer YOUR_TOKEN'
}

data = {
    'room': 'living room',
    'styles': ['modern', 'minimal'],
    'aspectRatio': '16:9'
}

response = requests.post(url, headers=headers, data=data)

if response.status_code == 200:
    job = response.json()
    print('Generation started:', job)
    # Poll for completion using job['id']
else:
    print('Error:', response.status_code, response.text)

import requests

# Generate a room visualization using client secret
url = 'https://platform.youzu.ai/api/v1/room-visualize'

headers = {
    'x-client-secret': 'YOUR_CLIENT_SECRET'
}

data = {
    'room': 'living room',
    'styles': ['modern', 'minimal'],
    'aspectRatio': '16:9'
}

response = requests.post(url, headers=headers, data=data)

if response.status_code == 200:
    job = response.json()
    print('Generation started:', job)
    # Poll for completion using job['id']
else:
    print('Error:', response.status_code, response.text)

Get Visualization Status

Endpoint: GET /api/v1/room-visualize/{id}

Check the status of a room visualization job.

curl -X GET "https://platform.youzu.ai/api/v1/room-visualize/YOUR_JOB_ID" \
  -H "Authorization: Bearer YOUR_TOKEN"

curl -X GET "https://platform.youzu.ai/api/v1/room-visualize/YOUR_JOB_ID" \
  -H "x-client-secret: YOUR_CLIENT_SECRET"

// Check visualization status using token
fetch('https://platform.youzu.ai/api/v1/room-visualize/YOUR_JOB_ID', {
  method: 'GET',
  headers: {
    'Authorization': 'Bearer YOUR_TOKEN'
  }
})
.then(response => response.json())
.then(data => {
  console.log('Job status:', data.status);
  if (data.status === 'COMPLETED') {
    console.log('Generated image URL:', data.outputUrls[0]);
  }
})
.catch(error => {
  console.error('Error:', error);
});

// Check visualization status using client secret
fetch('https://platform.youzu.ai/api/v1/room-visualize/YOUR_JOB_ID', {
  method: 'GET',
  headers: {
    'x-client-secret': 'YOUR_CLIENT_SECRET'
  }
})
.then(response => response.json())
.then(data => {
  console.log('Job status:', data.status);
  if (data.status === 'COMPLETED') {
    console.log('Generated image URL:', data.outputUrls[0]);
  }
})
.catch(error => {
  console.error('Error:', error);
});

import requests

# Check visualization status using token
url = 'https://platform.youzu.ai/api/v1/room-visualize/YOUR_JOB_ID'

headers = {
    'Authorization': 'Bearer YOUR_TOKEN'
}

response = requests.get(url, headers=headers)

if response.status_code == 200:
    job = response.json()
    print('Job status:', job['status'])
    if job['status'] == 'COMPLETED':
        print('Generated image URL:', job['outputUrls'][0])
else:
    print('Error:', response.status_code, response.text)

import requests

# Check visualization status using client secret
url = 'https://platform.youzu.ai/api/v1/room-visualize/YOUR_JOB_ID'

headers = {
    'x-client-secret': 'YOUR_CLIENT_SECRET'
}

response = requests.get(url, headers=headers)

if response.status_code == 200:
    job = response.json()
    print('Job status:', job['status'])
    if job['status'] == 'COMPLETED':
        print('Generated image URL:', job['outputUrls'][0])
else:
    print('Error:', response.status_code, response.text)

SDK

Props

Property	Attribute	Type	Default
`currency`	`currency`	string	`undefined`
`customProperties`	`custom-properties`	ApiV1LensPostRequestCustomProperties	`undefined`
`features`	`features`	FeatureFlags	`undefined`
`generationId`	`generation-id`	string	`undefined`
`lang`	`lang`	string	`undefined`
`noIntro`	`no-intro`	boolean	`undefined`

Events

Event	Description	Type
`generationComplete`		`CustomEvent<Generation>`
`productAddedToBasket`		`CustomEvent<ApiV1LensPost200ResponseInner>`
`productClicked`		`CustomEvent<ApiV1LensPost200ResponseInner>`
`profileClicked`		`CustomEvent<void>`
`roomSelected`		`CustomEvent<{ roomId: string; roomName: string; }>`
`styleSelected`		`CustomEvent<{ styleId: string; styleName: string; }>`

Shop the Look

Youzu Swap