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 is 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 is 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

First, ensure that Docker is installed on the system. Then pull the image from Docker Hub:

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 50051
docker run -d --name hoppn-color-recognition -p 50051

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.

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.

Join our waitlist for updates as we near our 2024 launch.

Join our waitlist for updates as we near our 2024 launch.

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.

© 2024 Hoppn

© 2024 Hoppn

hello@hoppn.com

© 2024 Hoppn