Nikolay Shipilin - Designer/Developer/Photographer

Web Development
Web Design

Web Design

Online AppProcessLive

Technologies used

  • HTML5
  • CSS3
  • jQuery
  • PHP
  • Google Maps API
  • MySQL Database
eCommerce Project

eCommerce SolutionProcessLive

Technologies used

  • XHTML
  • CSS
  • jQuery
  • PHP
  • MySQL Database
  • OpenCart eCommerce solution
Web Design Process Piece

Development & SEOProcessLive

Technologies used

  • HTML5
  • CSS3
  • jQuery
  • PHP
SEO for Web Page

Development & SEOProcessLive

Technologies used

  • HTML5
  • CSS3
  • jQuery
  • PHP
Web Design

Web Design & PhotoProcessLive

Technologies used

  • XHTML
  • CSS
  • jQuery
  • PHP
Web Design

Branding & Web DesignProcessLive

Technologies used

  • HTML5
  • CSS3
  • jQuery
  • PHP

eCommerce Project Process
eCommerce

eCommerce Project for - carprotectionpros.com

eCommerce Project

3M Scotchgard™ and 3M VentureShield™ paint protection film product demonstration, installation information and sales online is what this project all about. By far the largest project in my experience with lots of static information as well as eCommerce solution for the client. This page is equipped with tons of useful information, functionallity and downloadable content, and articles filled with key phrases and titles that both bring useful information to visitors as well as optimizing the page for search engines.

Choosing the Color Palette

Very bright highlights and main element colors were chosen for this company branding in contrast with a neutral gray background. The target audience of the company would recognize and easily get the message of the product quality and ease of installation.

Developing Textures

Recognizable by many car modification lovers carbon-fiber texture was the primary request of the client. Additionally some paint surface shine texture was used in a very subtle gradient elements. Burgundy red in form of a gradient was chosen as primary brand color and actionable site navigation elements.

Call to Action

Call to Action

A call-to-action is placed on nearly every page and sometimes even few times per page. Clearly the shopping cart identified by the icon on the calling button. Visitors have no chance to miss the point of the site and if interested will visit the store.

Quick Contact Option

Quick Contact

Quick contact functionality is built in the secondary footer area to provide visitors with an easy access contact form for questions and inquires.
This footer intentionally uses key product names and services in order to educate the client on proper terminology as well as connect the dots for search engines.
Footer navigation is yet another way to move around the site.

Alternative Contact

Clearance Registration

An alternative way of tracking sales and special deals is provided to clients by submitting a special "Clearance Products" enrollment form. This allows the visitors to stay aware of most current information, save money and register their interest on company's database.

Building a useful FAQ

FAQ

An ofter overlooked and boring page made useful with embedded videos and clearly marked questions and answers. Downloadable instructions are also available for clients. Not every question can be answered with a video, but those that can definitely should. The team is working hard on generating more video clips to provide the most modern and useful way of answering user questions.

Online Store Solution - carprotectionpros.com

eCommerce Project

The crown jewel of this project is the eCommerce solution for online sales and order tracking. OpenCart engine is used for this project. The cart is based on MySQL and PHP. It has capabilities of utilizing plugins and could be modified with custom themes, which I had to install and initiate for this job. Custom navigation, additional product markings, photography, graphic design, product & categories database replanishment and static page integration were on the list of things to accomplish. As of today the online store has over 2000 products listed for most modern car makes and models available on the market.
As the page crossed around 1000 products mark, the performance was getting unsatisfactory which brought the project to a whole new level of optimization. SQL quieries had to be modified and .htaccess files had to be written to boost the performance.

Performance Optimization

eCommerce Project

As the page was growing and crossed around 1000 products mark, the performance was getting unsatisfactory which brought the project to a whole new level of optimization.
SQL quieries had to be modified and .htaccess files had to be written to boost the performance. Some of the JavaScript had to be loaded asynchroniously and CSS styles loaded after DOM was ready.
The load speeds were brought from 13 seconds per click down to under 2 seconds. Page sizes and server requests counts brought down to minimum possile.
All of those modificaitons and few more bring this page A and B rating on Google Page Speed and YSlow page testing engines.