E-Commerce Web Framework Adopting Responsive Web Design Techniques

As one of the leading ERP solutions vendors in Middle East, the client wanted an online product catalog solution for their existing customer base. Their existing ERP solution managed only the internal operations of jewelry groups and lacked a system to deliver information in real-time. QBurst developed an e-commerce web framework that contains all major functionalities of an e-commerce website, integrates with the existing ERP system, and is compatible with popular mobile platforms.

• An online product catalog system that displays product details using real-time ERP data.
• A reporting module that could be used by top management.
• A solution that would help associated jewelry companies increase their mobile user base.

QBurst developed an e-commerce framework that seamlessly integrates with the client’s existing ERP software. Using responsive web design technology and Bootstrap, we made the framework compatible for all popular web and mobile devices. This responsive framework enabled jewelers to display latest product information to customers viewing through any device. Administrators can manage all jewelry groups through the admin panel and customize themes, logos, and background images for them.

• The  Responsive Web Design (RWD) framework we developed enables web pages to fluidly resize as per dimensions of the viewing device. When a customer visits a jewelry group’s website and views the product catalog, the system loads the template that was specifically designed for the jewelry group. RWD techniques allow the template to adjust automatically based on the viewport size of the customer’s device. Our solution supports all popular mobile devices:
  • iPhone
  • iPad
  • Android phones
  • Android tablets
• The framework functions as a   white-labeled solution for our client. Through the back-end admin panel, the administrator can customize the e-commerce framework for each jewelry group so that they appear unique in design, layout, and color. This facilitates different themes for every jewelry group.
• Jewelry groups store updated product information in the client’s ERP system. Our e-commerce framework synchronises with the ERP system and displays the latest information on the jewelry group’s website. When customers view the product catalog, the latest information available in the local inventory is displayed. This enables customers to ascertain whether products are in stock.
• There are individual pages for each product, that displays relevant information such as name, design number, price, weight, availability, and product image. There is also a ‘Recently Viewed by You’ option, which displays all the products that were recently viewed by the customer.
• In addition to ‘Product search’ which is a key functionality for any e-commerce website, there is also an advanced search box called ‘Find your Favorite’. With easy interface buttons like draggers and combo boxes, this search box allows customers to dynamically search for products based on brand, price, and ornament weight.
• Online purchase and order processing is facilitated with an ‘Add to cart’ button wherever products are displayed. Users then need to register to proceed with the online purchase. Once registered, the website sends an automated email to the customer as well as to the corresponding jewelry group for delivery of items.
• We developed a reporting module to include reports on sales, inventory, and branch-wise revenue, which could be used by top management. This was integrated with the ERP system to fetch data for the module.

We developed the e-commerce framework using ASP.NET framework and SQL Server 2008. We used Twitter Bootstrap framework to implement RWD features for compatibility on all major mobile platforms. Div based layouts made the framework device-sensitive.

In the SQL Server, we provided one database for each jewelry group. These databases sync with the corresponding ERP systems to display latest product information on the website. We implemented synchronization using cron jobs/Windows Job Scheduler, and Web services.

• ASP.NET
• SQL Server 2008
• HTML5
• SOAP
• XML/JSON
• Ajax
• jQuery
• Cron jobs/Windows Jobs Scheduler
• Twitter Bootstrap Framework

• Our framework enabled the client to offer their customers an online solution at par with other popular jewelry groups across the world in line.
• The application was architectured to be customizable for any jewelry group, adding to its long-term value.