We sell our rings on our commerce site http://www.balfour.com and we are looking to redesign the product configuration page. This page is visited after selecting a style of ring and where you select a stone color, design and artwork for the left and right side of the ring, as well as select engraving or personalization such as your name, jersey number, or other personalized information. A problem we are specifically trying to solve in this contest is how do you create a responsive design on mobile and desktop that incorporated great product visual imaging as well as many configurations that a user is asked to select from.
You can see examples of our sites for class ring jewelry here -
http://www.balfour.com – Search for "University of Texas" to see a university example and search "cedar creek high school texas” for a high school example.
For the purposes of this project, our scope and focus is on this page and subsequent pages where a ring is configured to the specific design of the consumer - http://products.balfour.com/Univers…ig/1423713 or http://products.balfour.com/HS/Ring…net/132189
This design would include:
Responsive, mobile first design. Samples of mobile, tablet, and desktop designs. We are not looking to change the header/footer as that was recently redesigned, but everything in the middle of the page is what we are looking for.
Examples of the following input controls might be used:
Text with autocomplete
Works like radio inputs, choose one, but selection happens by clicking the image rather than a radio button
Most modals contain the "Image Selection" control mentioned above.
Also include examples of error/validation messages for these controls.
Incorporate image preview. We have dynamic image generation technology to preview the product based on the users input. This image must be tightly integrated into the design.