professional

Marvel Paints - AR Paint Visualization App

Cross-platform React Native mobile app for paint color visualization using OpenCV computer vision, Shopify e-commerce integration, and Instagram feed with Firebase Remote Config.

View Live

Live

Marvel Paints - AR Paint Visualization App

Project Overview

Marvel Paints is a sophisticated React Native mobile application (iOS & Android) that enables users to visualize paint colors on walls in real-time using computer vision. Built with React Native 0.83 and React 19, it features OpenCV integration for wall detection and color masking, Shopify Storefront API for e-commerce, Instagram feed integration, and Firebase Remote Config for dynamic updates. The app includes a color picker tool extracting colors from images, real-time wall visualization with worklet-based threading, and a comprehensive product catalog with 280+ Marvel Paints colors.

Key Features

Wall Paint Visualization

Color Picker (OpenCV)

Shopify E-commerce

Instagram Feed

Firebase Remote Config

Offline Product Cache

Favorites System

Color Matching Algorithm

Implementation Details

Built cross-platform mobile app using React Native 0.83 with React 19 for iOS and Android platforms

Integrated OpenCV (react-native-fast-opencv) for real-time wall detection, color extraction, and paint visualization

Implemented Shopify Storefront API with GraphQL for product catalog, collections, search, and e-commerce features

Developed color picker tool using computer vision to extract and match colors from camera/gallery images

Built wall visualizer with worklet-based threading for smooth real-time paint application on wall surfaces

Integrated Instagram Graph API for social media feed with infinite scroll pagination

Implemented Firebase Remote Config for dynamic API endpoints and credentials management without app updates

Used TanStack React Query for efficient data fetching, caching, and 24-hour offline product storage

Created comprehensive color database with 280+ Marvel Paints colors and automatic color matching algorithms

Built favorites system with AsyncStorage persistence and FlashList for high-performance product lists

Technologies Used

React Native

React 19

TypeScript

OpenCV

Shopify GraphQL

Firebase

React Query

React Navigation

AsyncStorage

FlashList

Project Information

Related Projects

professional

FEDSYS - Enterprise Security Assessment Platform

Comprehensive enterprise-grade cybersecurity reporting platform designed for penetration testing teams and security professionals, streamlining vulnerability management and professional PDF report generation.

Next.js

TypeScript

PostgreSQL