case-studies

Heavyocity

<div id="" class="container-fluid overflow-hidden services-section-block">
    <div class="row">
        <div class="inner tif-py-70 col-24 offset-md-1 col-md-22 ">
            <div class="row">
                <div class="content-wrapper col-24 col-xl-23">
                    <div class="row">
                        <div class="content tif-mb-50 col-24 col-md">
                                                        <h2 class="title tif-mb-30 " style="--bullet-color: ">An extensible E-commerce platform redesign gives a prominent virtual instrument software company room to stretch its vision. </h2>
                            
                                                        <p class="copy tif-font-md tif-mb-0">Heavyocity creates world-class virtual instruments for today’s modern composer and sound designer. Their cutting-edge instruments and environmental sounds power the music score for many of today’s blockbuster movies and hit television shows. The Heavyocity crew came to Think It First with the challenge of designing and building an E-commerce platform that could flex with their business and an incredible array of face-melting creations. </p>
                            
                                                        <a href="https://heavyocity.com/" target="_blank" class="secondary-btn white-text tif-mt-40 tif-mt-md-65">Visit the Site</a>
                                                    </div>

                                                <div class="sidebar col-24 offset-md-1 col-md-auto">
                                                        <p class="tif-font-md tif-mb-md-30 tif-mb-15">What We Did</p>
                                                        
                            <ul class="list-unstyled tif-p-0 tif-m-0">
                                                                <li class="list-text text-uppercase tif-mb-20">UI/UX Design</li>
                                                                <li class="list-text text-uppercase tif-mb-20">Front End Development</li>
                                                                <li class="list-text text-uppercase tif-mb-20">Ecommerce</li>
                                                                <li class="list-text text-uppercase tif-mb-20">WordPress</li>
                                                                <li class="list-text text-uppercase tif-mb-20">WooCommerce</li>
                                                                <li class="list-text text-uppercase tif-mb-20">Shopify</li>
                                                                <li class="list-text text-uppercase tif-mb-20">Subscriptions</li>
                                                            </ul>
                        </div>
                                            </div>
                </div>

                            </div>
        </div>
    </div>
</div>

<div class="wide-media-block container-fluid tif-bg-alpha-color ">
    <div class="row">
        <div class="col-24 col-xl-22 offset-xl-1">
            <div class="inner tif-py-35 tif-py-md-55">
                <div class="media-wrapper overflow-hidden ">
                                            <img decoding="async" class="media-img desktop-img w-100 d-block " src="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_1-scaled.webp" alt=""  srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_1-300x149.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_1-scaled.webp 1024w"/>
                                                                            </div>
            </div>
        </div>
    </div>
</div>

<div class="wide-media-block container-fluid tif-bg-alpha-color ">
    <div class="row">
        <div class="col-24 col-xl-22 offset-xl-1">
            <div class="inner tif-py-35 tif-py-md-55">
                <div class="media-wrapper overflow-hidden ">
                                                                                    <video autoplay loop muted playsinline -webkit-playsinline class="w-100 d-block" data-desktop="https://player.vimeo.com/progressive_redirect/playback/885234171/rendition/1080p/file.mp4?loc=external&#038;log_user=0&#038;signature=afff286d9c7df86bf3cfd22bf99fddd1cc8b2dfbf1a82963fbfa400b2e1e4cb0" >
                        </video>
                                    </div>
            </div>
        </div>
    </div>
</div>

<div class="container-fluid subtitled-copy-list-block">
	<div class="row">
		<div class="inner col-md-22 offset-md-1 offset-sm-0 tif-pt-md-150 tif-pt-75 tif-pb-md-145 tif-pb-85">
			<div class="heading text-center">
				
							</div>
			<div class="">
															<div class="list-row d-flex flex-md-row flex-column">
							<h3 class="col tif-h2 tif-mb-md-0 tif-mb-15">Modular design for flexibility and brand cohesion</h3>
							<div class="col tif-font-md">
								<p>We guided the Heavyocity team through a complete overhaul of the front-end design, incorporating flexible modules, custom audio and video players, widgets, and flexible sticky menus they could use to brand and customize color/gradients/content for individual product pages which each have a unique identity. We also designed a bespoke megamenu that organizes and displays product categories with interactive hover states and with special attention to mobile users.</p>
							</div>
						</div>
												</div>
			<div class="cta text-center">
															</div>
		</div>
	</div>
</div>


<div class="wide-media-block container-fluid tif-bg-alpha-color ">
    <div class="row">
        <div class="col-24 col-xl-22 offset-xl-1">
            <div class="inner tif-py-35 tif-py-md-55">
                <div class="media-wrapper overflow-hidden ">
                                            <img decoding="async" class="media-img desktop-img w-100 d-block " src="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_6-scaled.webp" alt="Heavyocity mobile layouts"  srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_6-300x149.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_6-scaled.webp 1024w"/>
                                                                            </div>
            </div>
        </div>
    </div>
</div>

<div class="container-fluid subtitled-copy-list-block">
	<div class="row">
		<div class="inner col-md-22 offset-md-1 offset-sm-0 tif-pt-md-150 tif-pt-75 tif-pb-md-145 tif-pb-85">
			<div class="heading text-center">
				
							</div>
			<div class="">
															<div class="list-row d-flex flex-md-row flex-column">
							<h3 class="col tif-h2 tif-mb-md-0 tif-mb-15">Intelligent E-commerce</h3>
							<div class="col tif-font-md">
								<p>The site was rebuilt on WooCommerce to manage products and variants, but we also built an integration with Shopify for its best-in-class cart and checkout functionality. For customer account areas, a custom user dashboard allows Heavyocity users the ability to view previous orders, download product updates, crossgrade product updates, and register purchased products. With this new buyer insight, Heavyocity management can strategically market to customers with product offerings that align with what they already own. </p>
<p>Think it First also designed and built product download and serial code generation systems that Heayocity uses to distribute its digital products. This allowed them to move away from a legacy system that constrained their technology desires and budget. With a cadence of many product releases per year, TIF installed environmental monitoring systems to keep things running smoothly and alert of customer issues, failed payments, traffic spikes, outages, and more. think it First is the leading <a href="https://thinkitfirst.com/">Philadelphia web design</a> and development company in the region. Whether we become partners for the long haul or just quick friends, you&#8217;ll be happy you took the time to speak with us. </p>
							</div>
						</div>
												</div>
			<div class="cta text-center">
															</div>
		</div>
	</div>
</div>


<div class="wide-media-block container-fluid tif-bg-alpha-color ">
    <div class="row">
        <div class="col-24 col-xl-22 offset-xl-1">
            <div class="inner tif-py-35 tif-py-md-55">
                <div class="media-wrapper overflow-hidden ">
                                            <img decoding="async" class="media-img desktop-img w-100 d-block " src="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_2-scaled.webp" alt="Heavyocity Desktop layouts"  srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_2-300x149.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_2-scaled.webp 1024w"/>
                                                                            </div>
            </div>
        </div>
    </div>
</div>

<div class="dual-media-block container-fluid tif-bg-alpha-color">
    <div class="row">
        <div class="col-24 col-xl-22 offset-xl-1">
            <div class="inner tif-py-50 tif-py-md-70">
                <div class="row tif-g-md-25">
                    <div class="media-wrapper col-24 col-md-12 tif-mb-40 tif-mb-md-0">
                        <div class="ratio overflow-hidden" style="--bs-aspect-ratio: 102.82%;">
                                                            <img decoding="async" class="media-img desktop-img" src="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_4.webp" alt=""/>
                                                                                </div>
                    </div>
                    <div class="media-wrapper col-24 col-md-12">
                        <div class="ratio overflow-hidden" style="--bs-aspect-ratio: 102.82%;">
                                                            <img decoding="async" class="media-img desktop-img" src="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_5.webp" alt="Recording Monitor"/>
                                                                                </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="wide-media-block container-fluid tif-bg-alpha-color ">
    <div class="row">
        <div class="col-24 col-xl-22 offset-xl-1">
            <div class="inner tif-py-35 tif-py-md-55">
                <div class="media-wrapper overflow-hidden ">
                                            <img decoding="async" class="media-img desktop-img w-100 d-block " src="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_7-1-scaled.webp" alt="Heavyocity Desktop layouts"  srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_7-1-300x151.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_7-1-scaled.webp 1024w"/>
                                                                            </div>
            </div>
        </div>
    </div>
</div>

<div class="wide-media-block container-fluid tif-bg-alpha-color ">
    <div class="row">
        <div class="col-24 col-xl-22 offset-xl-1">
            <div class="inner tif-py-35 tif-py-md-55">
                <div class="media-wrapper overflow-hidden ">
                                            <img decoding="async" class="media-img desktop-img w-100 d-block " src="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_8-1-scaled.webp" alt="Heavyocity mobile layouts"  srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_8-1-300x149.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/09/Heavyocity_8-1-scaled.webp 1024w"/>
                                                                            </div>
            </div>
        </div>
    </div>
</div>

<div class="container-fluid large-testimonial-block">
    <div class="inner tif-pt-40 tif-pb-120">
        <div class="row">
            <div class="col-24 col-xl-22 offset-xl-1">
                <div class="testimonial-wrapper tif-mb-50 tif-mb-md-60 tif-mb-lg-70 tif-mb-xl-95 position-relative overflow-hidden">
                    <img decoding="async" class="background-image w-100 h-100 position-absolute object-fit-cover top-0 start-0" src="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/LargeTestimonialBackground.png" srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/LargeTestimonialBackground-300x130.png 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/LargeTestimonialBackground-1024x444.png 1024w" alt="Decorative Image"/>
                    <div class="content-container tif-px-25 tif-pt-105 tif-px-md-45 tif-px-lg-60 tif-pb-50 tif-pt-xl-115 tif-px-xl-75">
                                                <p class="quote position-relative tif-h2 tif-white-color tif-mb-60">We tried prior vendors but weren&#8217;t successful. While looking for other vendors, we were recommended to Think It First by Woocommerce, and their work was excellent. We&#8217;re always happy with their work. 
<br/>
<br/>
Their dashboard helps us easily see our data and saves time. Our site is easier to navigate and visually pleasing. Our customers sometimes compliment its professional design. Their project management is excellent, and they&#8217;re fully on top of all of the pieces. 
<br/>
<br/>
Their responsiveness is impressive. There has been no technical challenge that they couldn&#8217;t tackle thus far. Their team always deliver what we need and find solutions to make it work.</p>
                        
                                                <p class="credits tif-font-tertiary tif-font-xs text-uppercase tif-mb-0 tif-white-color">Creative Director, Heavyocity</p>
                                            </div>
                </div>

                                <div class="button-wrapper d-flex justify-content-center">
                    <a class="secondary-btn white-text" href="https://clutch.co/profile/think-it-first?page=1#review-533374" target="_blank">Read the Review</a>
                </div>
                            </div>
        </div>
    </div>
</div>

<div class="container-fluid position-relative case-study-archive-block tif-pt-md-10 tif-pt-5">
		<div class="row">
		<div class="col-md-22 offset-md-1 offset-sm-0">
			<div class="inner has-bottom-separator tif-pb-md-75 tif-pb-40 has-top-separator tif-pt-md-30">
									<h4 class="title tif-font-md tif-mb-md-110 tif-mb-55 tif-bravo-color">Related Results</h4>
				
				<div class="archive row tif-g-md-15 tif-g-lg-20 tif-g-lg-25 three-column-layout">
					
								<div class="post col-auto tif-mb-md-105 tif-mb-50">
									<div class="position-relative">
										<div class="featured-image position-relative w-100 tif-mb-md-45 tif-mb-25"><img loading="lazy" decoding="async" width="1742" height="1008" src="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Gelest_Featured-2.webp" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Gelest Logo on image of fingers touching" srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Gelest_Featured-2.webp 1742w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Gelest_Featured-2-300x174.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Gelest_Featured-2-1024x593.webp 1024w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Gelest_Featured-2-768x444.webp 768w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Gelest_Featured-2-1536x889.webp 1536w" sizes="auto, (max-width: 1742px) 100vw, 1742px" /></div>
										<h3 class="tif-mb-0 title tif-white-color">Gelest</h3>
																					<p class="tif-font-md tif-mt-15 tif-mb-0 tif-white-color">A multi-site network and suite of digital tools to support a global leader in materials science and manufacturing.</p>
																				<a href="/results/gelest/" class="stretched-link"></a>
									</div>
								</div>

					
								<div class="post col-auto tif-mb-md-105 tif-mb-50">
									<div class="position-relative">
										<div class="featured-image position-relative w-100 tif-mb-md-45 tif-mb-25"><img loading="lazy" decoding="async" width="1742" height="1008" src="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Pearl_Featured.webp" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Pearl Properties Logo" srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Pearl_Featured.webp 1742w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Pearl_Featured-300x174.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Pearl_Featured-1024x593.webp 1024w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Pearl_Featured-768x444.webp 768w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Pearl_Featured-1536x889.webp 1536w" sizes="auto, (max-width: 1742px) 100vw, 1742px" /></div>
										<h3 class="tif-mb-0 title tif-white-color">Pearl Properties</h3>
																					<p class="tif-font-md tif-mt-15 tif-mb-0 tif-white-color">A new site, tenant-facing mobile app, digital marketing strategy, and brand collateral to put this Philadelphia Commercial Real Estate company on track to expand its footprint.</p>
																				<a href="/results/pearl-properties/" class="stretched-link"></a>
									</div>
								</div>

					
								<div class="post col-auto tif-mb-md-105 tif-mb-50">
									<div class="position-relative">
										<div class="featured-image position-relative w-100 tif-mb-md-45 tif-mb-25"><img loading="lazy" decoding="async" width="1742" height="1008" src="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Winlevi_Featured-2.webp" class="attachment-post-thumbnail size-post-thumbnail wp-post-image" alt="Winlevi logo superimposed on images in bubbles" srcset="https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Winlevi_Featured-2.webp 1742w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Winlevi_Featured-2-300x174.webp 300w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Winlevi_Featured-2-1024x593.webp 1024w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Winlevi_Featured-2-768x444.webp 768w, https://wp.thinkitfirst.com/wp-content/uploads/2023/11/Winlevi_Featured-2-1536x889.webp 1536w" sizes="auto, (max-width: 1742px) 100vw, 1742px" /></div>
										<h3 class="tif-mb-0 title tif-white-color">WINLEVI</h3>
																					<p class="tif-font-md tif-mt-15 tif-mb-0 tif-white-color">An award-winning, rule-breaking, consumer website gives WINLEVI® the edge to become the #1 topical acne drug on the market.</p>
																				<a href="/results/winlevi/" class="stretched-link"></a>
									</div>
								</div>

									</div>

				<div class="d-flex flex-md-row flex-column justify-content-between align-items-center">
					
									</div>
			</div>
		</div>
	</div>
</div>
