fbpx

Case Study: Custom Metal Cards Website

by | Aug 24, 2024

EcomRolodex, a Shopify Design & development agency known for designing and building custom Shopify stores, recently undertook a project to create an online platform for selling Custom Metal Cards. The process, which was divided into distinct phases, was completed in under four weeks, showcasing the agency’s expertise and efficiency. Due to this project being custom, we designed and coded a custom theme instead of using a Shopify template or a theme.

 

The Process from A to Z to Design and Build a Metal Cards Website

 

1. Brief and Onboarding Questions:

  1. Before diving into the project, it was essential to understand the client’s vision and requirements. Through a comprehensive briefing and onboarding session, EcomRolodex ensured that the client’s expectations were clearly defined and understood.
    Create a request for a new Shopify Store & get onboarding questions file →

 

2. Design

2.1. Branding: Since this brand had a non-authentic branding guide, we create it for their website from scratch

2.2. Draft: An initial draft was created to provide a sneak-peek into the proposed design.

2.3. Homepage: The first impression of any online store, the homepage was designed to be visually appealing and user-friendly.
  • Creates the impression that it’s a real brand
  • Provides good navigation to product pages
  • Creates trust by using Trustpilot Reviews
  • Presents the main benefits of the product multiple times on the page
  • Announcement bar includes a timer for time-limited promotions
  • There are custom designed images which further elaborate on the features and benefits of the products

2.4. Product Page: The product page was crafted to give detailed information about the Custom Metal Cards Process, ensuring potential customers could make informed decisions.

  • Includes nicely designed renders of the product
  • The Add-To-Cart button is of a contrasting color visible above the fold
  • Creates trust by using Reviews on First screen
  • Includes custom icons which help with understanding the value of the product quickly
  • Shows a review of a client above the fold next to “Add-to-cart”
  • There are multiple “Add-to-Cart” buttons because the page is longer and there’s a sticky bar for add-to-cart on mobile

2.5. Collection Page: This page was designed to categorize and display the range of Pre-made Designs available.

  • Made all designs of the same size to make it aesthetically pleasing and branded
  • Optimized Filters & Sorting

3. Coding

3.1. Best Practices: With a design in hand, the coding phase commenced. EcomRolodex’s team of developers, skilled in best practices, ensured that the website was not just visually appealing but also responsive and user-friendly.
3.2. Mobile Optimization: At EcomRolodex, we prioritize mobile optimization by employing responsive design techniques, ensuring every Shopify store offers a seamless shopping experience on every device.
3.3. Speed Optimization: Leveraging Liquid to create custom-coded sections and optimizing images for swift loading, we guarantee that the store not only looks impeccable but also performs at lightning speed on mobile platforms, catering to the ever-growing mobile user base.
3.4. Easy to edit without code: We ensured every text, image, and element can be edited from Shopify’s CMS. This way the client can create as many product and collection pages as needed by reusing templates that are easy to edit.

4. Final Revisions & Content Update

Using Markup, the client was able to pinpoint specific areas on full-page screenshots of the homepage and product page. This interactive feature allowed for precise feedback, ensuring that the final website met the client’s standards.

5. Project Management


EcomRolodex’s private project management system was a game-changer. It centralized communication between the designers, developers, and the client. The system allowed the client to access all files on Google Drive, and track tasks transparently, ensuring a smooth workflow from start to finish.

Shopify Store Ready for Sales:

The Custom Metal Cards Website transitioned seamlessly from brief to design, code, corrections, and finally, launch. The efficiency with which EcomRolodex executed the project underlines the agency’s commitment to quality and timely delivery. Check the live version lanched:

Next Steps for the Client:

With the store now live, the focus shifts to driving traffic and increasing conversions. Here are the proposed next steps:

  1. Video Content Creation: Engaging video content can be a game-changer in attracting potential customers. We recommend Billo to get easy content
  2. Google Ads: A strategic Google Ads campaign can significantly boost visibility and drive targeted traffic to the store.
  3. TikTok Ads: Considering the popularity of TikTok, advertising with focus on creating unique content for the Metal Cards Website.
  4. Partnerships & Influencers: Collaborating with relevant influencers can amplify the brand’s reach and credibility.
  5. Email Automations using Omnisend: Automated email campaigns can keep potential customers engaged, driving repeat visits and conversions. We recommend starting with this email automation

Conclusion:

To develop the  Custom Metal Cards website at EcomRolodex, we leveraged our extensive knowledge of e-commerce best practives throughout the process. By utilizing innovative design, the latest technology, and strategic planning, we’ve crafted a solution that not only meets but exceeds expectations. This commitment illustrates our devotion to delivering not only design and code, but primarily results for our clients.

Recommended blogs