Biion Footwear is a forward-thinking company that aims to bridge the gap in EVA footwear by offering products that excel in both performance and design. Working in collaboration with NFA and Highlighter Studio, FireNet Designs was tasked with implementing web designs and developing solutions to address various challenges involved in updating Biion's website.
Previously, Biion's website relied heavily on Pagefly pages, which led to chaotic SEO and theme issues. The collaboration between FireNet, NFA, and Highlighter Studio aimed to streamline the website's design and functionality, while also addressing unique challenges specific to Biion's product offerings.
1.) Overcoming the 100 Variant Limitation
One of the primary challenges faced by FireNet was that Biion's products exceeded the 100 variant limitation imposed by Shopify. After conducting a thorough investigation and weighing different options, the team decided to implement internal product linking as the best solution for this use case. More information on this approach can be found in this article here.
Collections were redesigned using hidden collections that linked products via canonical links. Additionally, theme customizations were heavily implemented on the product detail page (PDP) to update options on hover, showing customers which color they were considering selecting. Once clicked, the color took them to the internally linked product for that specific color, allowing Biion to stay within Shopify's 100 variant limitation.
2.) Upgrading the Theme and Implementing Custom Filters
For this project, Biion's website theme was upgraded to Online Store 2.0, enabling the use of new collection filters. Custom filters were required, and these were created using metafield definitions. This allowed Biion to add and remove products from specific shoe types or models with ease.
3.) Theme Updates and Custom Sections
FireNet Designs carried out multiple theme updates and created custom sections for Biion to use for specific content copy. One of the most notable custom sections designed by FireNet was the "What makes Biion tick" section. This creative addition not only enhanced the overall appearance of the website but also allowed for a more in-depth understanding of Biion's unique selling points.
4.) Enhancing User-Generated Content Experience
To provide a better user-generated content (UGC) experience, NFA built custom design styling on top of Yotpo Reviews. FireNet Designs created a custom section in React for aggregating review data from Yotpo's API, as well as implementing multiple style updates for the Yotpo Review widget. The original designs were complex and required a full custom build. However, due to budget constraints and the project's initial scope, it was agreed upon with the client to exclude this requirement and add it as a version 2.1 update in the future.
The collaboration between FireNet Designs, NFA, and Highlighter Studio resulted in a significantly improved website for Biion Footwear. By addressing the challenges of the 100 variant limitation, upgrading the website theme, implementing custom filters and sections, and enhancing the UGC experience, the team was able to create a more organized, visually appealing, and user-friendly website for Biion's customers.
In conclusion, the project undertaken by FireNet Designs, in collaboration with NFA and Highlighter Studio, demonstrates the importance of teamwork, creativity, and problem-solving when it comes to web design and development. By overcoming unique challenges and ensuring a seamless user experience, Biion Footwear's website now stands as a testament to the capabilities of these three companies working together to deliver exceptional results.