Close

Skin House Facial Bar

From Squarespace to Shopify: Unifying Skin House Facial Bar’s Online Presence with a Custom Redesign

Skin House Facial Bar

Services

Theme Design

Theme Development

Data Migration & Restructuring

301 Redirection

Tech partners

Shopify

Google Analytics

YotPo Review

Boulevard Booking

Overview

Skin House Facial Bar is dedicated to helping everyone feel confident and comfortable in their own skin, regardless of skin type. Located in Philadelphia, it offers specialized facials and advanced technology services with a focus on quality, consistency, transparency, and creating a welcoming, safe space for all. Established in 2018 with the opening of its first location on South Street, it introduced the innovative Facial Bar concept, allowing clients to enjoy facial benefits without committing to a full-day spa experience. The bar combines medical-grade skincare with the comfort of a home-like environment, emphasizing efficient luxury and using only the highest quality products. Skin House is committed to fair pricing, exceptional value, and delivering noticeable results.

When founder Shireen Mustafa first launched her brand, she managed two separate websites—one on Squarespace for content and one on Shopify 1.0 for eCommerce. This dual-system setup was holding her brand back. Users experienced confusion navigating between content and commerce, SEO performance suffered as Google crawled two different domains, and Shireen’s team spent excessive time juggling two dashboards rather than focusing on customer experience. To achieve a truly seamless, cohesive brand presence, Skin House needed a comprehensive Shopify 1.0 to 2.0 migration and Shopify store development that would unify content, services, memberships, and eCommerce into a single, high-performance platform. WebDesk Solution partnered with Skin House Facial Bar to execute this demanding, high-stakes project—handling everything from design system creation and custom Shopify 2.0 theme development to complex data migration, advanced navigation architecture, and robust 301 redirection and DNS adjustments. By consolidating Skin House’s digital identity under Shopify 2.0, we streamlined backend operations and empowered Shireen’s team to focus on client engagement rather than technical overhead.

Approach

When Shireen, the founder of Skin House Facial Bar, came to WebDesk Solution, she had a clear goal: eliminate the confusion of managing two separate websites. Her existing setup—Squarespace for brand content and Shopify 1.0 for online sales—created friction in both user experience and back-end management. To deliver a comprehensive Shopify 1.0 to 2.0 migration, we began with a deep-dive discovery process. We conducted stakeholder interviews with Shireen and her team to capture brand essence, messaging, and aesthetic preferences. We also performed an SEO audit across both platforms to identify critical content and ensure no organic traffic would be lost in migration.

Next, we mapped out a multi-phase project plan that balanced strategic complexity with technical rigor. Phase One involved crafting a unified information architecture, where we reorganized service pages, product collections, and blog content to align with Shopify’s data model. We built a custom Shopify 2.0 theme from the ground up, incorporating a modular design system that mirrored the clinical sophistication of high-end skincare sites. Our design team created responsive wireframes and high-fidelity mockups, referencing sites like hiskin.care for visual inspiration but ensuring Skin House’s unique brand voice remained front and center.

Phase Two focused on backend development and data transformation. We exported all product, service, and content assets from Squarespace and Shopify 1.0, then built a series of custom Python scripts to normalize, tag, and import data into Shopify’s native CMS. This ensured that collections, vendor tags, and product attributes would dynamically populate the custom mega menu and homepage sections. We also integrated Yotpo for reviews, Wishlist functionality, and a Boulevard booking system—giving Skin House the tools to manage memberships, service reservations, and social proof within a single dashboard.

Phase Three addressed SEO and launch-readiness. We created a comprehensive 301 redirect map for every URL, conducted DNS adjustments to move the Shopify store from a subdomain to the primary domain, and performed rigorous QA tests across desktop and mobile devices. We leveraged Shopify’s metafields to preserve on-page SEO metadata from Squarespace and implemented structured data markup for product listings and service pages. Finally, we trained Shireen’s team on using Shopify 2.0’s new back-end features—bulk product imports via CSV, dynamic section editing, and real-time performance monitoring—ensuring they could manage content and promotions without ongoing technical intervention. This end-to-end approach delivered a unified, high-impact Shopify store development solution that positioned Skin House Facial Bar for scalable growth and sustainable digital excellence.

Challenges

1. Complex Navigation and Menu Structure with Strategic Constraints

Before engaging WebDesk Solution, Skin House’s dual-site setup made it difficult for visitors to find products and services quickly. The existing Shopify 1.0 menu was limited to basic dropdowns, and the Squarespace site had its own distinct navigation hierarchy. This fragmentation hindered SEO efforts, as Google crawlers struggled to index relevant content cohesively across two domains. Shireen needed a consolidated mega menu on Shopify 2.0 that would allow users to drill down into categories like “Skin House Essentials,” “Facials & Treatments,” “Memberships & Packages,” and “Educational Resources”—all without sacrificing page-load speed or backend manageability. Designing a menu system that could automatically generate sub-listings based on collections and vendor tags required deep technical foresight to avoid slow queries on product-rich pages. Moreover, the new structure had to be fully customizable via Shopify’s theme editor so that marketing and operations teams could update menu items without touching code. Failure to address this would perpetuate customer confusion, reduce time-on-site, and ultimately impact conversion rate and average order value.

2. Limited Product Display Options Requiring Dynamic Responsiveness

Skin House’s existing Shopify 1.0 homepage featured static product rows that didn’t reflect the brand’s diverse skincare line. Shireen wanted to replicate a dynamic carousel effect—similar to reference sites like hiskin.care—where one product per collection would rotate, showcasing key hero SKUs for “Cleansers,” “Serums,” “Masks,” and “Tools.” The challenge lay in correctly tagging and filtering products so that only one item from each relevant collection dynamically appeared at any given time. Additionally, this needed to load smoothly on mobile and tablet devices without causing layout shifts or excessive bandwidth usage. Implementing this required building custom JavaScript modules within Shopify’s Liquid templates to fetch product data via AJAX calls, process tags, and render the carousel on the client side. Without such a solution, Skin House risked a static homepage that failed to capture users’ attention and lost valuable opportunities to drive cross-sells and highlight new products.

3. Inadequate Skin Concerns Representation with Multi-Dimensional Tagging

Skin House prides itself on offering customized skincare solutions based on individual skin concerns: acne, hyperpigmentation, sensitivity, aging, and more. The original Shopify 1.0 platform could not accommodate dynamically generated product tabs that grouped SKUs by multiple attributes (e.g., “Skin Concerns” and “Skin Type”). Shireen needed a system where marketing staff could assign tags like “Concern: Acne,” “Concern: Dryness,” “Type: Oily,” or “Type: Combination,” and have the storefront automatically present products relevant to each category. Adding to the complexity, new skin concerns could emerge with future product launches, so the solution had to be infinitely scalable and manageable through Shopify’s back-end. Without addressing this, customers would struggle to find the right product combinations, resulting in lower order values, increased support inquiries, and diminished brand trust. Crafting a flexible filtering mechanism within Shopify 2.0 required deep knowledge of Shopify’s metafields and custom section logic to create truly personalized shopping experiences.

4. Challenges in Service Management with Dynamic Content Needs

Skin House offers a wide variety of facials, peels, and advanced technology treatments, each with its own pricing tiers, add-on options, and promotional bundles. On Squarespace, each service lived on static pages where updating pricing or adding a new add-on meant manually editing multiple sections. This led to inconsistent information across pages and occasional errors in service descriptions. Shireen needed a custom template in Shopify 2.0 that allowed her team to create and edit service details on the fly—add new thumbnail images, list out variable pricing options, and include promotional messaging or limited-time offers without developer intervention. The solution had to include a structured data model for services (similar to product variants) and the capacity to integrate directly with the booking engine. Failure to deliver a dynamic service management system would not only frustrate the internal operations team but also lead to customer confusion at checkout and missed upsell opportunities.

5. Data Migration and Structure Issues Under Tight Timeline

Consolidating all product, service, blog post, and customer data from two separate platforms (Squarespace and Shopify 1.0) into a single Shopify 2.0 environment posed an enormous data-structure challenge. Data lived in different formats—Squarespace’s CMS exports, Shopify CSVs with bespoke metafields, and third-party booking system exports. Furthermore, numerous legacy collections had to be restructured into new categories and custom filters, ensuring that URL structures could be mapped precisely to preserve SEO value. The migration had to occur within a tight four-week window to avoid impeding upcoming promotional campaigns. Any misalignment risked lost metadata, broken images, missing tags, or disrupted customer accounts. We needed a robust ETL (Extract, Transform, Load) process that would normalize data, clean invalid entries, generate new metafields for Shopify 2.0, and insert everything into the correct objects—products, collections, pages, and blog posts—without human error. Ensuring data integrity during this high-pressure migration was critical to avoid downtime or lost revenue.

6. Complex 301 Redirection and DNS Switch under High-Stakes Conditions

Shireen wanted to maintain SEO equity built over years on both Squarespace and Shopify 1.0 domains. The existing domain for Squarespace was the primary brand URL (skinhousefacialbar.com), while the Shopify 1.0 store lived on shop.skinhousefacialbar.com. Switching the Shopify 2.0 store to the main domain meant orchestrating a DNS change, updating SSL certificates, and implementing 301 redirects for hundreds of legacy URLs. We needed to ensure that all incoming traffic—Googlebot crawlers, email campaign links, and social media referrals—seamlessly landed on the new Shopify 2.0 pages without encountering broken links or redirect chains. A misconfigured redirect could result in lost organic rankings, 404 errors, and a degraded user experience. The high stakes of launching just before a major promotional event added pressure to get every detail right. Coordinating with DNS providers, SSL vendors, and Shopify’s technical team required meticulous planning, careful testing in staging environments, and a rollback plan in case anything went wrong.

Solutions

1. Streamlined Mega Menu Architecture for Scalable Navigation

To address complex navigation and menu structure requirements, we built a fully custom mega menu within Shopify 2.0, enabling Shireen’s team to manage navigation items via Smart Menu data. We created a hierarchical JSON schema that mapped collections, sub-collections, and vendors to menu dropdowns dynamically—automatically generating sub-listings based on product tags and categories. We also embedded smooth, GPU-accelerated animations for opening and closing menu panels, ensuring that large catalog pages loaded without lag. Mobile responsiveness was prioritized by developing a separate, stylized hamburger navigation that mirrored desktop menu logic but collapsed elegantly on smaller screens. We built the entire mega menu using Shopify 2.0’s new section schema, allowing non-technical staff to rearrange items through the theme editor. This solution not only simplified the backend editing process but also eliminated the reliance on hard-coded Liquid snippets—empowering Skin House to expand categories and collections without developer overhead.

Skin House Facial Bar

2. Dynamic Collection-Based Carousel for Enhanced Product Display

To solve the limited product display challenge, we created a dynamic carousel section on the Shopify 2.0 homepage that automatically pulled one featured product from each collection. We wrote custom JavaScript modules that performed AJAX requests to Shopify’s storefront API, retrieving up-to-date product data filtered by tags like “HeroSKU” or “Featured.” This data was processed client-side and rendered in a slick carousel component powered by Swiper.js. On mobile devices, the carousel gracefully degraded into a swipable card view, ensuring performance remained sub-300ms on initial load. We also implemented lazy loading of images using the Intersection Observer API, which improved page speed scores and prevented layout shifts. The section’s configuration was exposed in the theme editor, allowing Shireen’s team to adjust which collections appeared, swap featured SKUs, or change carousel autoplay intervals without writing a single line of code. By leveraging Shopify 2.0’s JSON templates, we ensured seamless updates to the carousel whenever new collections were created.

Skin House Facial Bar

3. Advanced Skin Concerns & Type Filter Using Tag-Driven Sections

To deliver a tailored, skin-concerns-driven shopping experience, we built two specialized sections on the homepage: “Shop by Skin Concern” and “Shop by Skin Type.” Each section used metafields to list available concerns (e.g., “Acne,” “Hyperpigmentation,” “Sensitive,” “Aging”) and types (e.g., “Oily,” “Dry,” “Combination,” “Normal”). We developed a custom Liquid template that read metafield values and generated clickable tabs. Behind each tab, an AJAX-driven product grid fetched SKUs tagged with corresponding attributes (for instance, products tagged “Concern_Acne” and “Type_Oily”). This required creating a robust tagging taxonomy and training Skin House’s team on how to tag new products accurately. The sections also incorporated conditional logic to display messaging or callouts—for example, “Popular Products for Sensitive Skin.” Performance was maintained by preloading product thumbnails into a skeletal loader and layering skeleton screens during AJAX calls. By enabling dynamic filtering based on multiple tag combinations, this solution transformed Skin House’s store into a consultative skincare experience rather than a simple product showcase.

Skin House Facial Bar

4. Custom Service Management Template with Dynamic Content Controls

To address the cumbersome service content management, we developed a bespoke Shopify 2.0 template—“Service Details”—that uses metafields for each aspect of a treatment: title, description, optional add-ons, pricing tiers, and promotional messaging. Each service page leveraged a repeatable “Service Option” block within Shopify’s theme editor, where Shireen’s team could upload images, list variable pricing, and add or remove features in real time. The template also integrated seamlessly with Boulevard’s API for booking appointments; when a user selected a service option, they could click “Book Now” and be taken to a pre-populated booking form. We ensured that all service metadata was searchable and that schema.org structured data (Service and Offer types) was embedded for rich snippets. By abstracting service configuration into editable blocks, we eliminated manual HTML edits and reduced the time required to launch new treatments from days to minutes—empowering the Skin House team to keep their service catalog fresh and accurate.

Skin House Facial Bar

5. Robust Data Transformation Engine for High-Fidelity Migration

Given the complexity of migrating data from Squarespace and Shopify 1.0, we built a custom ETL pipeline using Node.js scripts to normalize and transform data sets. First, we extracted content exports from Squarespace in CSV and JSON formats, then sanitized each record—mapping fields such as “BlogTitle,” “BlogBody,” and “ImageURL” into Shopify’s blog article structure. For products and collections, we processed Shopify 1.0 CSV exports, appended new metafields for “SkinConcern” and “SkinType,” and generated a unified product import CSV compatible with Shopify 2.0’s enhanced fields. Our pipeline validated product images, resized them to optimized WebP formats, and updated image URLs accordingly. We also automated the creation of new collections based on vendor tags (e.g., “Skin House Essentials,” “Advanced Treatments”). During migration, we performed incremental test imports on a staging environment and used ShopSync to preserve customer account data. This approach ensured zero data loss, accurate tag assignments, and a clean import into Shopify 2.0—maintaining data integrity under a tight timeline.

6. Meticulous 301 Redirect Strategy and DNS Migration Plan

To preserve SEO equity and guarantee a smooth transition from Squarespace to Shopify 2.0, we conducted a full audit of both site’s URLs using Screaming Frog and Google Search Console. We compiled over 500 unique URLs—ranging from blog posts and service pages to product detail pages—and created a redirect map that matched legacy paths to new Shopify 2.0 URLs. After verifying redirects in a staging subdomain, we scheduled the DNS change to move the primary domain (skinhousefacialbar.com) from Squarespace to Shopify. To minimize downtime, we coordinated with DNS providers to lower TTL values 24 hours prior to launch, then updated A records and CNAME records during a carefully planned two-hour window. Post-launch, we monitored Google Search Console for crawl errors, fixed any misconfigurations immediately, and updated sitemaps accordingly. SSL certificates were reissued automatically by Shopify, and we verified that HTTPS was enforced sitewide. This precise strategy guaranteed that organic traffic flowed seamlessly into the new Shopify store without interruptions to analytics or search rankings.

Skin House Facial Bar

Outcomes/Results

Conclusion

By migrating Skin House Facial Bar from a fragmented Squarespace + Shopify 1.0 environment to a unified Shopify 2.0 platform, WebDesk Solution delivered a high-stakes, technically sophisticated transformation. We crafted a fully custom mega menu, dynamic product carousel, and advanced skin-concern filtering system—each built to scale with Skin House’s growth. Our custom service management template empowered Shireen’s team to update offerings in minutes, while our rigorous ETL pipeline and redirect strategy preserved data integrity and SEO value. The result is a seamless user experience that marries luxury and efficacy, enabling Skin House Facial Bar to focus on what they do best: helping clients feel confident and beautiful. As a trusted Shopify development agency in the USA, WebDesk Solution continues to partner with Skin House to optimize performance, roll out new features, and drive sustainable digital excellence.

Skin House Facial Bar
Tab First 1
Tab First 2
View All Work