- Client: Green Amy
- Location: United Arab Emirates
- Platform: Shopify Plus
- Service: Theme customization, on going support
Key notes about Green Amy
Green Amy is an online marketplace catering to the UAE market with a curated selection of top-quality, sustainable and healthy products. Green Amy's premium selection of organic, non-GMO, sustainable, and non-toxic products to elevate lifestyle and surpass local health.
What sets Green Amy apart:
- Quality pantry staples, household essentials, bath and body products, and a range of vitamins and supplements.
- Ethically sourced frozen meat and seafood for premium quality and sustainability.
- Explore our frozen section for vibrant fruits and vegetables, plant-based alternatives, and indulgent treats like pizza and ice cream.
Why it’s a must-have transformation for their journey
Green Amy desired to unlock new levels for their online business with Shopify. They recognized the need to elevate their online presence to meet the updated demands of customers. The decision to transform their Shopify Plus store was driven by several critical needs, each essential for enhancing user experience and driving business growth.
- Need a more attractive homepage with informative header/footer
The homepage is the first point of contact for many visitors. To make a lasting impression, it was essential to create a visually appealing and informative homepage. A well-structured header and footer provide quick access to key information, enhancing navigation and overall user experience.
- Need detailed and easy-to-shop product pages
Product presentation can make or break a sale. Green Amy needed product pages that not only highlight the unique features and benefits of their eco-friendly products, but also simplify the shopping process. Detailed descriptions, high-quality images, and intuitive layout are crucial for converting visitors into customers.
- Need a new menu for mobile devices
As the mobile users' traffic increases more and more, it’s required for Green Amy to have a responsive and user-friendly mobile menu. The mobile navigation needed an upgrade to accompany the growing number of mobile shoppers.
- Need several additional features for better shopping experience
To stand out in the market, Green Amy required several additional features that enhance the overall shopping experience. These features include extended modules such as a Menu tab for easy navigation, or a widget to leverage social media engagement.
How we bring their expectations to reality?
By addressing the critical needs, Green Amy aimed to improve user experience as well as drive higher conversion rates and customer shopping experience. Let’s go through this project and explore how we assist them to align all the targets.
Theme customization for Green Amy’s online web store
Based on the required changes, the theme customization service was the best fit to bring their expectations to reality, including:
- Homepage and header/footer optimization
The homepage was redesigned first to be more visually appealing and user-friendly. We focused on creating a clean and modern look that reflects Green Amy’s eco-friendly brand. The new header was completed following the essential information: discount code, contact details, search bar, shopping cart, and product categories.
The layout of the footer was optimized as well. While scrolling down the homepage, users can easily subscribe to receive updated news, navigate to the essential instant links to Green Amy’s details, shopping, support term, featured products, and switch the language.
- Product details pages implementation
The product pages were developing to provide a comprehensive and engaging shopping experience. We included high-resolution images, detailed product descriptions, and customer reviews to help shoppers make informed decisions.
The layout was optimized for clarity and ease of use, with prominent call-to-action buttons to encourage conversions. We also implemented features including product zoom, shipping, and return policy, as well as the related product suggestions.
- Mobile menu designing
Recognizing the importance of mobile traffic, we designed a new mobile menu that is intuitive and easy to navigate. The menu was simplified to ensure that all key sections of the website are accessible with just a few taps. We incorporated touch-friendly elements and clear icons to improve usability on smaller screens. The responsive design ensures a consistent and enjoyable browsing experience across all devices.
- Extended-modules development: Menu tab, TikTok widget
It’s a big plus to further enhance the user experience if Green Amy’s web store has several new sections that most of their competitors do not. An extended-TikTok widget was a great idea as TikTok is one of the most popular social media nowadays with nearly 1.5 billion monthly active users.
This widget allows users to view the TikTok content and easily navigate to Green Amy’s TikTok account to interact, which increases time spent on the site, and boost social media engagement without additional marketing costs.
The new Menu tab also developed to provide a streamlined navigation experience, allowing users to quickly access different sections of the site.
Technical stacks we used
Once all the requirements were clear, our development team began collaborating on the research and theme development for the Shopify website. The goal was to create an immersive and engaging experience for customers purchasing surfing products.
- Commerce Platform: Shopify Plus
Shopify Plus is a scalable and reliable platform that Shopify made for eCommerce stores. It brings an user-friendly interface, extensive customization options, and secure payment gateways.
- Framework: Remix (Hydrogen)
Remix (Hydrogen), known for its cutting-edge technology, was the core framework for this transformation. It provides an innovative approach to building web applications based on the focus on performance.
- Languages & Libraries: JavaScript, TypeScript, React
While JavaScript allows us to develop responsive web applications, TypeScript enhances the development process by providing strong typing and improved code scalability. Integrated with React, a powerful JavaScript, we can develop complex, yet efficient, components that enhance the overall user experience for Green Amy.
- Styling Library: Tailwind
Tailwind pre-designed components allow us to create a visually stunning and highly responsive user interface that aligns with Green Amy’s brand identity.
- Headless CMS: Sanity
Sanity provides the flexibility to structure content as needed which ensures the online web store can remain all dynamic content.
- Deployment Platform: Oxygen
Within this development, we deployed on Oxygen which has an intuitive interface and efficient deployment workflow.
The outstanding results showing a successful project
After 2 months of research and development, we are thrilled to have delivered a new website interface that exceeds our customer's expectations. We have successfully created a Shopify theme that is both visually appealing and highly functional.
Visually stunning design
The modern and clean homepage is implemented to capture user’s attention and reflect Green Amy’s commitment to eco-friendly items. The optimized header/footer provide a seamless navigation experience and help users easily find out important information. Also, the redesigned product pages, with high-quality images and detailed descriptions, enhance the visual storytelling of each product. Then, they make shopping a more enjoyable experience.
The new Menu tab allows users to navigate the site more intuitively, and encourages exploration of various product categories. Moreover, the extended TikTok widget brings a dynamic element to the site, allowing users to watch Green Amy’s content directly on the homepage, thereby increasing the time spent on the site and enhancing brand connection.
Also, the newly designed mobile menu has resulted in a superior mobile shopping experience. With an impressive traffic coming from mobiles, the responsive and touch-friendly design ensures that users can easily browse and shop on the go. This has led to an increase in mobile conversions, and aligns with the mobile-first approach direction of Green Amy.
Permanence-wise achievements
The website marked the fastest as ever page load speed. Following Google PageSpeed Insights reports, desktop performance reached 94/100, while mobile performance achieved a score of 63. The Accessibility score on both desktop and mobile devices is 96/100.
According to GTMetrix, the total blocking time during the page loading process is only 24ms. In addition, the CLS - indicates how much layout shift is experienced by visitors as the page loads - reported at 0.01s, which ensures to bring a good user experience.
Wrapping it up, The transformation of Green Amy is a testament to the power of strategic customization and dedicated support. By addressing key areas to redesign and develop, True Storefront has elevated their online store to new heights.
Green Amy now enjoys an appealing website that aligns perfectly with their brand ethos. We are proud to have helped Green Amy achieve their business goals and create a new Shopify Headless store that will help them continue to grow and succeed.
Inspired by Green Amy’s success story? Now it’s your turn!