1016 Visualizer
Laravel-based automotive parts visualizer and dealer ordering platform with canvas vehicle previews, SVG part highlights, material/version switching, order summaries, CSV invoices, and mail delivery.
Project brief
Inside the build.
1016 Industries Visualizer is a Laravel-based automotive parts visualization and ordering platform for high-end vehicle customization.
The product lets customers and dealers browse supported vehicle models, switch materials and versions, inspect front/back views, hover over visual hotspots, add parts to an order, and submit selected parts through public or authenticated workflows.
- Client
- Christopher
- Delivery role
- Full-Stack Developer
- Discipline
- Web
- Project status
- Archived
Visual showcase
The product, frame by frame.
Explore 2 additional public screens from the delivery.
Challenge & response
Turning constraints into a working system.
The challenge
The client needed to turn a complex aftermarket parts catalog into a visual buying workflow where users could understand which SKU belongs to which area of a premium vehicle.
The platform also needed to support different vehicle versions, material variants, side views, part images, highlight SVG files, dealer-specific wholesale ordering, and large catalog update batches.
The response
Built a Laravel application with Blade views, Eloquent models, MySQL catalog tables, custom JavaScript, canvas rendering, SVG highlight overlays, and order submission flows.
Created a hierarchical vehicle data model covering brands, models, trims, cars, variants, sides, parts, version links, public orders, and dealer member orders.
Implemented a dealer workflow with brand/model/trim selection, part search, order summary, VAT-aware order storage, CSV invoice generation, and order email delivery.
Product capabilities
What the delivery makes possible.
Each capability connects a product requirement to something people can use.
Vehicle visualizer
Canvas-based car preview with SVG highlight overlays so each part can visually map to the correct vehicle region.
Material and version switching
Support for configured materials such as carbon fiber, forged carbon, FRP, and Black Badge, plus linked vehicle versions.
Interactive part rail
Part cards show title, SKU, image, material, and price, with hover states that activate matching highlight regions on the car.
Public order submission
Customers can select parts, enter contact details, submit orders, and trigger backend validation, persistence, and email notification.
Dealer wholesale workflow
Authenticated dealers can select brand, model, trim, search available parts, build a wholesale order, and submit it through API v2 endpoints.
CSV invoice generation
Dealer orders generate CSV invoice files with dealer details, selected parts, SKUs, material, model, make, trim, and total.
Catalog import structure
Seeders and importer files manage brands, cars, variants, sides, images, highlights, part SKUs, prices, and catalog update batches.
Rollback controls
Authenticated admin rollback routes support feature toggles, theme activation, backup creation, backup restoration, and emergency rollback actions.
System architecture
A connected delivery, not isolated features.
The public `/list` route shows available vehicles and launches `/visualizer/{car_id}` for cars with configured variants.
The visualizer requests `/visualizer/{car_id}/details`, receives structured car JSON, draws the active side image on canvas, and injects the matching SVG highlight overlay.
Public orders are submitted through `/order/place`, while authenticated dealer orders use API v2 endpoints for models, trims, parts, and wholesale order submission.
Laravel persists orders in MySQL and uses mail plus generated CSV files to send order details to the configured recipient.
Delivered impact
What changed after the build.
Converted a premium automotive parts catalog into an interactive visual buying experience.
Reduced SKU confusion by tying each part to imagery, material options, side views, and highlight regions.
Supported both public customer inquiries and authenticated dealer wholesale ordering from the same catalog foundation.
Built with
A stack selected for the work.
- Laravel 10
- PHP 8.1
- MySQL
- Eloquent ORM
- Blade
- Laravel UI Auth
- Laravel Sanctum
- Vite
- Bootstrap
- Sass
- JavaScript
- Canvas API
- SVG Overlays
- Flickity
- Toastr
- Laravel Mail
- CSV Generation
Continue exploring
Next case study WebIQMetric
View projectStart a conversation
Have a product challenge worth solving?
Tell us what needs to change, what already exists, and where the product needs to go next.
Discuss your project