Through collaboration with Golfsmith’s Information Services team, the Custom Clubmaking module moved from a standalone page to a seamless integration within the product pages. Initially, the form was built to feed into a table-based layout. As a result, I cleaned up the PHP code to output HTML in line with more modern standards and IS implemented it without issue. After that, I moved onto redesigning and coding out the CSS, while they worked on the backend.<\/p>\n

Custom Clubmaking Widget<\/h2>\n

After the first pass, I had succeeded in giving the module a more modern look and feel. You can see this first version in the UX Planning & Prototypes section below.<\/p>\n

Due to the potential length of the widget, jQuery UI’s accordion widget was implemented to save space. I worked directly with a member of the IS team at their computer to implement the front-end jQuery calls. The final launched version is in the screenshot below.<\/p>\n

Screenshots<\/h4>\n

NOTE ON LIVE EXAMPLES:<\/strong> As of 11\/4\/16, Golfsmith is no longer conducting business and all associated websites are offline.<\/em><\/p>\n

<\/a><\/p>\n

UX Planning & Prototypes<\/h4>\n

As stated above, the widget initially used a table-based layout. While organizing the information into a wireframe, I realized the tables would cause some issues. In addition, I read through the PHP code to plan for all the variable options.<\/p>\n

<\/a>

Widget wireframe sketch <\/div> <\/div> <\/div>

<\/a>

Custom Club module initial prototype <\/div> <\/div> <\/div> <\/div> <\/div>\n

Conclusion<\/h2>\n

After launch, custom club orders more than doubled within the week, a trend which continued until close of business. Furthermore, custom clubs widget performance continually increased revenue since its launch. It seemed like the improved and easier-to-use custom clubs experience was a hit with customers.<\/p>\n","protected":false},"excerpt":{"rendered":"

Through collaboration with Golfsmith’s Information Services team, the Custom Clubmaking module moved from a standalone page to a seamless integration within the product pages. Initially, the form was built to feed into a table-based layout. As a result, I cleaned up the PHP code to output HTML in line with more modern standards and IS<\/p>\n

Read More<\/a><\/div>\n","protected":false},"author":1,"featured_media":156,"comment_status":"closed","ping_status":"closed","template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","enabled":false}}},"jetpack-portfolio-type":[8,7],"jetpack-portfolio-tag":[40,43,13,66,45,44,42,65],"jetpack_publicize_connections":[],"yoast_head":"\n