Situation:
Simplify the process of selecting products through the web site and streamline the choosing of product options for residential-specific products
Task:
With some product families having more than twenty options, how do we make the selection process simpler and more visual?
Action:
Create new icon-based product selection logic to represent available product options
Result:
Our designer created the icon set and I wrote the blades and the controller. The icons are bound with javascript click handlers that populate hidden fields based on data attributes. An AJAX request is sent to the controller which queries the database and based on the passed variables, will render views to HTML based on the logic in the controller and pass the rendered HTML back through a JSON response.
Because the logic uses nested blades they can easily be embedded in multiple locations making it easy to maintain. It is used in category and product pages to make product selection simple for users.
This vertical market structure will be replicated for additional markets.
