It is a company dedicated to the sale of paints and tools. Through the website, that we developed, it offers color matches of over 200,000 colors across over 100 paint brands. MyPerfectColor.com takes its unprecedented color selection even further by enabling the ability to choose lighter or darker versions of any color. Every color is available in a huge selection of paint types, including pint-sized paint sample mini-cans, aerosol spray cans, gallons, quarts and even five gallon pails. The site can be accessed at https://www.myperfectcolor.com
The website was implemented based on a custom framework developed especially for this project, using many ajax and jQuery™ effects that provide a modern look and feel. Popups and Sliders are used for images. Modules are displayed in each view by configuration and depending on the user. The online store has the “My Cart” view which shows products that have been added. There, you can edit, increase or reduce the quantity or simply remove any product.
The most important part of the website is the checkout process, we have implemented an unique logic to match colors and paint types according with all alternatives. Once you add products to cart, the system automatically calculates weight and volume of all products in the cart in order to request FedEx™ WebService and estimate shipping cost. It displays all available shipping options and their prices based on the shipping address. The system uses Stripe as the main payment gateway which allows you to pay through most popular credit cards issuers.
Additionally, we have integrated CloudFlare to increase security and performance.
The client wanted to have his own framework for this project, that's because we worked to develop a new MVC framework in the first stage. This system include all benefits that any other MVC framework offers: dispatchers, security layers, session handlers, plugins and extensions, themes, etc.
For the search functionalities Apache™ Solr™ is used. This is a powerful search engine which allows customized and complex searches. In the search pages we integrated a filter module which allows advanced searches. The search module uses the AutoComplete functionality through Ajax and Jquery. The category pages show all products and colors associated with that category. There is also the possibility to create subcategories and facilitate the navigation between them through the breadcrumb (navigation tree).
Any visitor can register on the site and become a "client" with the ability to create content, buy products, share comments and questions, etc.. Both users and visitors can share pages on the most popular social networks (buttons and actions through AddThis.com).
We also integrated a blog using WordPress, this system is designed to facilitate the creation of articles and where users can share their opinions by posting comments. We developed a custom WordPress plugin to allow to admins to find a color or product from myperfectcolor.com and post it into a Wordpress post easily by clicking on the image.
The system provides a full administration panel where admins can manage the entire site, allowing them to add, view, edit and delete users, colors, products, payment methods, shipping methods, generated orders and associated billing. The admin panel also provides different interfaces where can be changed products names, prices, upload images, associated paints and colors. The main feature of the system is the color, that's because we implemented a powerful color interface manager. The admin is able to add, edit, delete, categorize and relate colors and paints. They are able to use an smart image generator (RGB and LAB color spaces) to associate a color picture, this is shown in the public color page for reference.
The order manager panel offers the ability to monitor all purchases of the system from the submission to the ship, track payments and refund, add or remove products from an opened order, send public notes to customers and even add privates notes for the rest of the staff. The administrator is able to export and print the shipping labels, we implemented a FedEx Web Service for this purpose. The system also provide statistic dashboard to see all sales and profits for current year, previous years comparison, charts and tables with all information the staff needs to lead the business.
Between February/2019 and July/2019 we executed a complete system upgrade, integrating Bootstrap v4, gulp and SCSS into the framework template. This allowed us to optimize the product pages and checkout workflow. This clearly improved the user experience throughout the entire buying process. The order conversion rate was remarkable better after the update.
Migration from Authorize.net to Stripe
In August 2019 we've implemented a migration in the payment gateway. Due to Authorize.net limitations and the advantages that Stripe offered to our client, we planned and executed the migration for the online payment method. Within the normal workflow the ecommerce allows you paying with debit or credit cards, by integrating Stripe we also allow users to associate these cards with their MyPerfectColor account so that in future orders they should only choose the saved card in a drop-down and proceed with a click.
Besides a list of extra options in the administrator panel, an admin user is also able to assigning and removing credit cards associated with customers. Another functionality requested by our client was a new feature for making asynchronous payments, an user can generate an order without paying, after MyPerfectColor confirms the final cost of the order, the staff sends an email to the customer including the updated amount and a button to proceed and pay inside the platform.