Hopstack

Hopstack is a SaaS platform for warehouse management to streamline and digitize your warehouse operations.
Web design
Webflow development
CMS
Pages developed
50+
Year
2024
Industry
B2B SaaS | Logistics
Hopstack macbook image

It helps businesses take charge of their warehouses, remove bottlenecks, and boost fulfillment efficiency, all without increasing costs.
With an unapparelled 99.8% order accuracy, they’ve shipped over 6 Million orders to date.

Order accuracy

99.8%

Number of orders

6M

Funding (Seed)

2.8M

Challenge

When Hopstack reached out to Webyansh, they had a clear pain point. Their detailed library of resources was bringing them great organic traffic but they were not able to convert the visitors due to a 5-year-old obsolete design and extremely frustrating user experience.

So, our goal was to enhance the on-site user experience with-

⬥ A modern and minimal design, without any fancy animations or effects
⬥ Clean Webflow development for faster loading speed and performance

However, at the same time, we had to ensure that the SEO rankings did not drop, which meant a smooth transfer of all the CMS items or resources.

Team Hopstack trusted us with this delicate job because of our prior experience in the logistics and B2B SaaS space, accurately captured in our development case study of Shopbox.

Solution

Hopstack provided us with a detailed branding guide and we incorporated the guidelines such as the color palette and typography within the new design.

Our main focus was to prioritize the website’s performance by keeping the design minimal and staying away from heavy animations or interactions.

We also went a step ahead of the native Webflow CMS to add some advanced filtering options with custom code.  

Here’s a brief overview of the transformation we achieved for Hopstack in each aspect-

Before
After
Design
Dated design as the website was built over 5 years ago.- No thought was given to visually highlight Hopstack’s core offer.
A minimal & modern, industry-leading design. - Special UI snippets combined with warehouse imagery to highlight the core offer and tool experience
Performance
Poor loading speed and user experience due to faulty structuring and CMS.
Clean development and native Webflow CMS enhanced with custom code for lightning speed and great user experience.
Website Architecture
Poor architecture and suffocating design.- Awfully named blocks and sections on the backend that created confusion.
Simple architecture, minimal effects & spacious design to keep the users engaged.- Logical naming of blocks powered by “Finsweet Client-First System
CMS
Messy CMS structure- confusing & complicated to handle. Also, affecting website performance.
Super-clean and easy-to-use CMS structure enhanced with custom code for advanced filtering and superior performance.
SEO
Great SEO rankings but no traffic conversion due to poor user experience.
Completely revamped, conversion-optimized user experience without compromising on SEO rankings.
MacBook mockup

Little details, huge impact

After studying Hopstack’s business in detail, we were sure we needed some special visual representation that highlighted both aspects of the business-

1. Their relation to physical warehousing
2. The software as their main product

So, we dived deeper into the software UI and studied it inside-out with some help from the Hopstack team to create custom snippets with abstract representations of UI elements.

We then combined them with images of physical warehouses and related processes.

This combination gave us two advantages-

1. Every visitor could immediately understand the core offering by Hopstack as they could quickly associate the software with warehousing and logistics.
2. Competitors could not look inside the core features of the software as we only used abstract concepts of the UI rather than actual screenshots.  

With such well-thought-out design elements, we were able to create a minimal and modern design that not only communicated the core business to the visitors but also carved a unique identity for Hopstack that is unmatched in the industry so far.

A complete CMS Overhaul

The Hopstack Resource Library was literally huge.

Here’s a list of the resource categories-  

⬥130 Blogs
⬥ Guides
⬥ 1 Report
⬥ 10 E-books
⬥ 129 Glossaries
⬥ 20 Newsletters
⬥ 6 Case Studies
⬥ 260 3PL Directories
⬥ Fulfillment Directories

So, we not only had to migrate all of these items smoothly to the new website but also improve the poor structuring to make the content management system more user-friendly.

Here’s how we recreated the entire CMS for Hopstack-

⬥ Exported all the data from the old CMS
⬥ Cleaned all the fields from the old CMS
⬥ Recreated new CMS fields
⬥ Imported all the data
⬥ Redefined all the categories and filters
⬥ Redefined the CMS and built the resources section  

With the new robust CMS, the Hopstack website is highly scalable and ready to evolve with the evolving business needs.

Hopstack CMS
Blogs

130

Case Studies

6

eBooks

10

Integrations

75

Newsletters

20

Partners

16

FBA prep center directory

287

3PL directory

260

Glossaries

129

Blog Tags

84

Categories

16

We prioritize seamless user experiences across all devices by implementing responsive design principles. By ensuring that the website adapts fluidly to various screen sizes and orientations, including mobile devices, tablets, and desktops, we guarantee accessibility and usability for all users.

iPhone 14 mockup
iPhone 14 mockup
iPhone 14 mockup

Happy client testimonial

I had the pleasure of working with Divyansh on our website revamp project at Hopstack, and I can confidently say that he is exceptional at what he does. His design thinking is top-notch, allowing us to achieve a clean, modern, and highly functional website.

One of the key highlights of working with Divyansh was his responsiveness and flexibility. He was always available for discussions, quick to incorporate feedback, and delivered the project in a timely manner. The ease with which we could ideate and collaborate made the entire process smooth and efficient.

Anurag Singh
Product Marketing Manager · Hopstack
Click to explore next

Sliceinn

Contact us

Have a project in mind? Contact us for expert design and development solutions. Let's discuss how we can help grow your business.

divyanshgraphic@gmail.com
+91 6377588843
Rajajinagar, Bangalore, India,  560096
Limited Availability
Select Services
Select Budget
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.