Infinite Color Search for Enterprise.
Infinite Color Search for Enterprise.
We're developing a robust hosted model for enterprise clients. This integration complements your existing search provider, offering finer control over the experience.
We're developing a robust hosted model for enterprise clients. This integration complements your existing search provider, offering finer control over the experience.
Color Wheel
Color Wheel
The Hoppn Color Wheel will be compatible with leading front-end frameworks, including React, Angular, and Vue, allowing for a seamless integration into your chosen development ecosystem.
The Hoppn Color Wheel will be compatible with leading front-end frameworks, including React, Angular, and Vue, allowing for a seamless integration into your chosen development ecosystem.
Usage
Usage
React
React
Angular
Angular
Vue
Vue
import React, { useState } from 'react';
import HoppnColorWheel from '@hoppn/color-wheel';
const ColorWheelExample = () => {
const [firstColor, setFirstColor] = useState({ L: 0, a: 0, b: 0, weight: 0.5 });
const [secondColor, setSecondColor] = useState({ L: 0, a: 0, b: 0, weight: 0.5 });
return (
<HoppnColorWheel
firstColor={firstColor}
secondColor={secondColor}
onChange={(newFirstColor, newSecondColor) => {
setFirstColor(newFirstColor);
setSecondColor(newSecondColor);
}}
/>
);
};
export default ColorWheelExample;Color Recognition
Color Recognition
Hoppn's Color Recognition is a powerful AI tool for extracting the intrinsic color values of your products. These values are stored and used during search queries.
Hoppn's Color Recognition is a powerful AI tool for extracting the intrinsic color values of your products. These values are stored and used during search queries.
Deploy
Deploy
Example of how it will work: First, ensure that Docker is installed on the system. Then pull the image from Docker Hub:
Example of how it will work: First, ensure that Docker is installed on the system. Then pull the image from Docker Hub:
After pulling the image, run it as a container:
After pulling the image, run it as a container:
docker run -d --name hoppn-color-recognition -p 50051docker run -d --name hoppn-color-recognition -p 50051While these sample deployments illustrate basic setups, the Hoppn Color Recognition Service is fully equipped for scalable deployment in clustered environments using Kubernetes and Docker Swarm.
While these sample deployments illustrate basic setups, the Hoppn Color Recognition Service is fully equipped for scalable deployment in clustered environments using Kubernetes and Docker Swarm.
Usage
Usage
Node.js
Node.js
Java
Java
Python
Python
Go
Go
C#
C#
const grpc = require('@grpc/grpc-js');
const { ColorRecognitionClient } = require('./hoppn_color_recognition_grpc_pb');
const { ColorRecognizeRequest, ProductInfo } = require('./hoppn_color_recognition_pb');
const client = new ColorRecognitionClient('localhost:50051', grpc.credentials.createInsecure());
const request = new ColorRecognizeRequest();
request.setProductsList([
new ProductInfo({
product_id: 'product123',
images: ['http://example.com/image.jpg'],
title: 'Sample Product Title', // Added title
description: 'A sample product description.',
categories: ['category1'] // Added categories
})
]);
client.extractColors(request, (error, response) => {
response.getProductColorsList().forEach(productColor => {
console.log(`Product ID: ${productColor.getProductId()}`);
productColor.getColorsList().forEach(color =>
console.log(`Color L: ${color.getL()}, a: ${color.getA()}, b: ${color.getB()}, weight: ${color.getWeight()}`)
);
});
});The provided sample code demonstrates a blocking implementation, while the Hoppn Color Recognition Service also supports non-blocking asynchronous calls, ideal for scalability and high-performance applications.
The provided sample code demonstrates a blocking implementation, while the Hoppn Color Recognition Service also supports non-blocking asynchronous calls, ideal for scalability and high-performance applications.
Color Connect
Color Connect
The Color Connect algorithm ranks each product according to its color similarity.
The Color Connect algorithm ranks each product according to its color similarity.
Usage
Usage
Elasticsearch
Elasticsearch
PostgreSQL
PostgreSQL
MSSQL
MSSQL
POST /_search
{
"query": {
"function_score": {
"query": {
"match_all": {}
},
"functions": [
{
"script_score": {
"script": {
"source": "hoppn_color_connect",
"lang": "expert_scripts",
"params": {
"firstColor": {
"L": 0,
"a": 0,
"b": 0,
"weight": 0.5
},
"secondColor": {
"L": 0,
"a": 0,
"b": 0,
"weight": 0.5
}
}
}
}
}
],
"score_mode": "sum",
"boost_mode": "replace"
}
}
}Try our Shopify plugin
Try our Shopify plugin
For Shopify merchants, we offer an Infinite Color Search plugin.
For Shopify merchants, we offer an Infinite Color Search plugin.
Intellectual property disclaimer
Intellectual property disclaimer
The features and technologies encompassed by Infinite Color Search, including the 3D color search, Color Picker User Experience for ecommerce, and the Weighted 2-tone Search, are patented and the exclusive intellectual property of Hoppn. Unauthorized use, reproduction, or distribution of these features is strictly prohibited and may result in legal action. All rights reserved, Hoppn, 2024.
The features and technologies encompassed by Infinite Color Search, including the 3D color search, Color Picker User Experience for ecommerce, and the Weighted 2-tone Search, are patented and the exclusive intellectual property of Hoppn. Unauthorized use, reproduction, or distribution of these features is strictly prohibited and may result in legal action. All rights reserved, Hoppn, 2024.
