Lunchbox Packs
Optimizing a Shopify Plus store and updating the Shopify theme to improve speed and performance.
Code unification and adding new features for the Lunchbox store
Location | USA, California | Cooperation model | |
---|---|---|---|
Industry | Partnership period | September 2023 – now | |
Improvements plan | Discovery phase, requirements and estimation analysis, prototyping and designing/MVP release, ongoing support and maintenance | Team size | Project manager, Shopify developer, QA |
Technologies | Shopify, Shopify Plus, JavaScript, HTML, Liquid, CSS, SCSS, Webpack |
About the client
Lunchbox Packs is a US company focused on providing hydration packs, sling and snack packs, colorful pack skins, lightshow wires, and related accessories to ravers and fans of live events. The company runs a Shopify Plus-based store and leverages social media channels, such as Reddit, YouTube, and Instagram, to attract the target audience and drive sales. Even though the product niche is comparatively narrow, during season peaks such as in the spring and summer months with plenty of live events, the Lunchbox website attracts up to 400,000 visitors.
About the product
The company’s motto is “Peace of mind with every pack,” which refers to the main benefit of the product – protected belongings. In more detail, it means that while having fun on a crowded dance floor, you have all your essentials in a pack with an anti-theft design.
In addition to basic festival packs, you can purchase customizable skins to express your individuality, lightshow wires for easy rummaging at night, and pack upgrades, such as a hydration system to replace your previous one.
The company’s website features a bright product line, a blog with industry-related articles, and a loyalty program page for earning rewards. Recently, with DigitalSuits' help, the company implemented a Builder Pack to let its users create custom bundles.
Challenges overview
In September 2023, the client engaged our services to optimize their store performance, unify the code base for consistency, and keep it up to date. Prior to working with us, they had employed multiple freelance developers for various tasks, which led to disparate code styles.The code was difficult to read and contained a lot of outdated elements. Additionally, they had no company to keep it up to date and ensure it followed best practices.
At the beginning of 2024, we started the implementation of new designs aiming to enhance the store’s visual appeal and add new features to improve user experience and foster engagement.
Our solutions
-
Store optimization and code refactoring: Since store optimization was our primary focus, we identified and solved existing issues using the best Shopify development practices. We also eliminated the deprecated code, outdated solutions, and unnecessary apps.
-
Updating the Shopify theme: We identified numerous bugs in the client's Shopify theme during our website optimization efforts. These issues stemmed from excessive add-ons, causing code conflicts. We recommended the Shopify theme modifications that offered more flexibility and effectively eliminated the issues.
-
Homepage revamp: We created new homepage sections and replaced outdated solutions with improved ones. This included switching from the old slider feature to the swiper to make it easier for mobile users to navigate the store.
-
Product page upgrade: We created product pages from scratch based on the updated Shopify theme, adding various sets of features at different stages of development. In addition to the client's existing features, we implemented an upsell feature to let customers add skins and lights directly on the product page. As a result, we delivered three PDP versions, enabling the client to change these variations in their dashboard and customize their sets of features for A/B testing.
-
Implementation of Builder Pack: We created and implemented a new feature - Builder Pack - aimed at improving customer engagement and driving more sales. This feature works as a constructor that allows customers to build their bundles by adding various packs, skins, lights, and upgrades. While adding products to the bundle, you can see how your discounts are growing. These discounts are exclusive to the builder and unavailable in other store sections. From the development perspective, this discount feature is a custom code-based solution.
-
Header & Footer: We implemented new header and footer designs to improve store performance metrics. The new header and footer functions are more compatible with the overall store’s functionality, which leads to significant improvements in website speed and navigation.
Results
By upgrading the client's Shopify theme and implementing new designs and features, we improved the visual appeal of the website, its performance, and user experience. The client is highly satisfied with the Builder Pack feature since it effectively enhances the company's upsell and cross-sell strategy.
Compared to the previous year, the Lunchbox results have been impressive:
- Conversion rates increased by 15%
- Site performance improved by 50%
In the near future, we’re also planning to migrate to a new checkout version, implement additional integration options, and replace some apps with better alternatives. The scope of future implementations is expected to speed up the store and improve its performance further.