Visit the site

Visit the site

Organizations Involved

Dan's Fan City is on online store selling Fans. The main USP about this product is that it allows users to customise the fans and and different components of the accessories like lights, down rods, motors, blades etc through a visual configurator https://www.dansfancity.com/design-your-fan and let's users see at each step how their product looks. Users also get to see prices at each and every stage, and once done, can add the fan to the cart. It will be then shipped to the user.

About the project

Goals

Former web Store project was based on Drupal 6 + Ubercart. They came to us with three main tasks: General site migration from Drupal 6 - 7 with all contents, Port its e-commerce store from Ubercart to Drupal Commerce with enhanced features. Fost important feature was the fan builder mechanism. In their present site, they had a very basic version of the fan builder, but they wanted a serious revamp of the functionality to make it more appealing and more GUI based. This is what we came up with: https://www.dansfancity.com/design-your-fan Each of the steps was divided into layers and options in each layer was derived out of the choices the user made in the previous steps. Also, at the end of all the steps, the user was able to download a compiled fan image to be able to have a final look to and share it with their friends and family. Admin should have a full control and be able to choose which products and appeared in each step and how it would vary and interact based on different user choices. Also, in the initial step, user could optionally upload an image of their own room, to see how the fan would look in their own room environment.

Requirements

To migrate products from ubercart to drupal commerce

Their present website consisted about 30,000 products including fan bundles, fans and accessories like light kits, downrods etc. They wanted to migrate these from ubercart to drupal commerce. While migrating, they wanted to incorporate a better product bundle mechanism, with the option for admin to mark if a product can be individually bought or only available as a part of the bundle, product single price as well as bundle price, product bundle discounts as per bundle configuration.

General site migration from drupal 6 - 7 with all contents

They wanted to migrate their website from Drupal 6 to Drupal 7 with all the contents which are about 10,000 nodes and blog articles. We have to migrate website with all this content

Other advanced features

Most important feature was the fan builder mechanism. In their present site, they had a very basic version of the fan builder, but they wanted a serious revamp of the functionality to make it more appealing and more GUI based. This is what we came up with: https://www.dansfancity.com/design-your-fan Each of the steps was divided into layers and options in each layer was derived out of the choices the user made in the previous steps. Also, at the end of all the steps, the user was able to download a compiled fan image to be able to have a final look to and share it with their friends and family. Admin should have a full control and be able to choose which products and appeared in each step and how it would vary and interact based on different user choices. Also, in the initial step, user could optionally upload an image of their own room, to see how the fan would look in their own room environment.

Architecture

As per the requirement, the existing Drupal 6 + Ubercart Site was to be migrated to Drupal 7 + Drupal Commerce.

For the migration, we indulged into a detailed review and planning phase where we carefully reviewed each and every aspects of the present content, field structure and Ubercart products and configurations of the present site. Then our development team wrote migration classes for easy migration. The use of Migration API + Commerce Migrate class was the key here. though we had to write down lots of migration API code, but in the end, it made migration of the site very easy, error free and reliable. We also relied heavily on the code fields and node migration API which provided a great way to migrate general drupal configurations. Once we were sure all the existing data was migrated, we started to migrate the ubercart configurations as much as possible. Ubercart and Drupal Commerce was quite different in terms of architecture and some of the aspects like product bundle concept was completely rewritten for drupal commerce. First the mechanism was built into drupal commerce and then the raw migration data was translated into drupal commerce through the use of migration classes.

The second and probably the most interesting part was the custom fan builder functionality we implemented. For this first we had to create a solid backend for the admin to be able to manage the layer dependencies. We added the necessary taxonomies and fields to the custom line items we built using the commerce API. Then, we developed the excellent GUI for the fan builder which can be seen at present. We consider this as a great achievement, considering the extensive number of combinations that the fan builder required. Intelligent use of ctools object caching made the feature very performant and memory efficient.

Also, our designing team came up with a great design for the site and the client was very very happy with the overall look and feel. Also, the fan builder with the numerous challenge it posed in terms of its different layers arrangement and size difference was finally made completely responsive.

Challenges

The main challenge on this project, apart from the development of new fan builder functionality was the migration between Drupal 6 + Ubercart to Drupal 7 + Drupal Commerce. While Drupal 6 to Drupal 7 migration was relatively easy to handle, most issues came with migration between Ubercart and Drupal Commerce, as they are very different in their database structure and way of working. But we studied the two architectures in detail, and our expert team was able to come up with some good ideas to help achieve this with ease at the end. We wrote migration module classes, and topped it up with bridging codes and at the end, this were done smoothly. Though this task was very time consuming, and lot of time was spent in R&D initially, and then testing and QA at the end, but the expected result was achieved in the end, to near perfection.

Outcome

When building a site using framework like drupal, we believe it’s more than just a content management system and it should more of an advanced configuration system as well. With this present system, the client was amazed how easily they could manage not only the webstore, but the products that go into the fan builder. They could literally manage each and every aspect of the layer attributes, position of a layer over its predecessors and the discount pricing for accessories going into the fan builder. The client was overjoyed with the not only the quality of work but also the communication and improvement suggestions our team brought to the table. The end result was a happy client and a very very sophisticated web store which we can boast about.:)

Why Drupal was chosen

Drupal was chosen because the original site of the client was in Drupal 6 + Ubercart and client wanted to migrate their site to Drupal 7 + Drupal Commerce. So Drupal was client's choice in this case.

Technical Specifications

Drupal version:

Why these modules/theme/distribution were chosen

First and major task of this project was to migrate the ubercart + D6 version to Drupal Commerce + D7 version. For this we made extensive use of the Migrate Module Classes + Commerce Migrate module to help us with certain migration aspects. Once done, the other major aspect was the Fan builder. This was completely custom coded from grounds up, and extensively used Drupal's core APIs for this.