Crossover Collections – Case Study
Crossover Collections, formerly known as Crossover Cases is a lifestyle brand of streetwear that’s all about social identity, self-appreciation, and motivation.
Going from phone cases to streetwear was a challenge in itself, and that is when the founder of Crossover Collections asked us to help them rebrand their website.
We were more than happy to help their website adapt to their new brand identity.
The Old Storefront
Originally, Crossover Collections were known as Crossover Cases. They had an incredible brand journey starting with selling custom iPhone cases.
They took the visions of their customers and added that personality with their artistic touch and delivered an amazingly high-quality personalized phone case.
However, they needed to change, they needed to evolve and adapt to the changes in the market. And so began the rebranding of Crossover Cases to Crossover Collections.
This turned out to be a wise decision from the founder as the current layout of their theme proved to be hurting for conversions as scroll times can hurt their conversions and the white background wasn’t sending the right message to their target audience.
So we got to work.
The Inspiration
When consulting with Matt, the founder of the newly rebranded Crossover Collections he told us that he wished for his new Shopify website to take inspiration from mentality.com, a personal favorite website of his.
We carefully studied the layout, the design, and the functionality of the website that he wanted Crossover Collections to take inspiration from and we learned how we can implement this design into the existing debut theme that Crossover Collections was using, and also how we could improve.
In web design, first impressions count, and when you’re dealing with B2C eCommerce it matters about 100x more. You have a split second to capture attention, state what you’re offering, solve consumer problems, and make them take action with a strong CTA (call-to-action). That’s a lot to accomplish in such a short timeframe.
The logo presenting itself on the header is very compressed and pixilated with words that are difficult to read, that alone can deter customers that may consider that a red flag that they don’t care about the fine detail in their own branding.
Next, the CTA is placed BELOW the hero banner. That’s an awful design decision because hero images are meant to reel you in with their visuals and the CTA inspires visitors to take action.
On the bottom of the page, the review slideshow is very choppy and low-performing and cuts off into the footer, a further indication of the lack of detail put into the website, and the fact that the Twitter icon is missing and the Instagram link no longer works shows the lack of perfection in the care of the storefront.
The New Storefront
We took the inspiration and made it better by fixing the issues that we highlighted above about mentality.com.
Adding a more minimalistic design & branding without sacrificing quality is something that we were driven to implement. They were worried about having to start over with choosing a new theme, so we consulted to them that we’re flexible and want to minimize their spending. So we worked within their already existing Debut theme and implemented the changes to compare to the inspired website from the previous section.
However, a big problem with rebranding is showing your new audience that you have the credibility of a well-established brand and showing your current audience that you still will possess that same level of quality. That is when we found that Crossover Collections has several reviews on Google and we could implement those onto the new website to help them gain more trust and credibility.
Similar to mentality.com, we had the Google slideshow implemented near the bottom of the page, right above the footer. However, we were able to implement it in a much more smooth and more professional way that kept the UI experience neat and the user experiences polished.
Finishing Touches
We finished the project by changing the background color as well as the typography. We switched the background color to #3D4246, a neutral grey color that is easy on the eyes and appealing to their target audience.
Keeping in theme with the bold and minimalistic design that matches the branding, we chose the Montserrat Bold and Montserrat Medium fonts to be well suited to this brand as it properly sends the message that Crossover Collections is looking to send to their target audience.
The Outcome
While Matt was busy with rebranding on their social media platforms, we took care of their storefront so that they may have peace of mind and be able to focus on marketing and less on the redesigning of the storefront without any friction to their store.
We’re proud to have been a part of their rebranding journey!
But don’t take our word for it, see what Matt has to say!
Also, check out our other Case Studies.
“They worked on my website and it came out just the way I wanted. ModnApps worked within my budget too and that was very helpful.”
Matt Rothberg, Owner & Founder of Crossover Cases