Work

Back to Work

Project

Hubmatrix

Employment

Europa Sports

Technology

Wordpress

Building brand identity and digital presence for a third-party logistics startup

Overview

Hubmatrix was Europa Sports' expansion into the third-party logistics (3PL) industry. It was a completely new business venture that needed to establish credibility and attract clients. As a startup with an existing logo but no established brand presence, Hubmatrix needed a website that could educate potential clients about 3PL services.

As Lead UX/UI Designer and Developer, I was responsible for helping shape the brand identity, defining the content strategy with the marketing team, and designing and building a WordPress website.

My Role

Lead UX/UI Designer

Wordpress Developer

Key Results

After launch, Hubmatrix saw a 35% increase in sales and client onboarding

Hubmatrix 3PL website

Various pages and sections of the Hubmatrix 3PL website
Hubmatrix 3PL website

Various pages and sections of the Hubmatrix 3PL website

View Website

The Challenge

Hubmatrix was a startup with zero brand recognition entering an industry built on trust and proven track records. They did have the backing of Europa Sports, but needed to establish their own brand identity and credibility.

We were also defining an unknown audience. Unlike Europa Sports' established customer base, we were entering new territory. Who would hire Hubmatrix? What did they need?

Third-party logistics is complex, involving warehousing, inventory management, fulfillment, shipping, returns, and e-commerce integrations. We needed to explain these services clearly to busy business owners who wanted to understand benefits quickly, not get lost in technical specifications.

The content we started with was rough. A mix of AI-generated industry content and ideas from stakeholders. We needed to transform this into clear messaging that answered: Who is Hubmatrix? What do they do? Why choose them over established competitors?

Finally, the marketing team would need to maintain the site after launch. The website had to be manageable by non-technical people, which meant choosing platforms that prioritized ease-of-use over technical sophistication.

Process Methodology

Understand

Explore

Become

Discover

Research Approach

Working with my design team and the marketing team, I approached discovery by first making sense of what we actually had to work with.

Defining the Business and Brand

The marketing team met with stakeholders and compiled a business plan document which was a mix of AI-generated information and explanations of what Hubmatrix would offer. My team and I took this rough material and reworked it into understandable content using the good ole "Who, What, When, Where, and How" framework. Answering these questions gave us a good starting point to build from. If you can clearly answer who, what, when, where, and how, you're halfway to a solid content strategy.

Competitive Analysis

I researched how established 3PL companies presented themselves online, examining:

Content Organization: How did they structure information? Did they lead with services, benefits, or industries served? How deeply did they explain their processes?
User Flow: How did they guide visitors from general awareness to specific service details to contact? What made their navigation intuitive or confusing?
Customer Support: How did they handle inquiries? Ticket submission forms? Live chat?

This research revealed that successful 3PL sites balanced comprehensive information with simplicity. They provided enough detail to feel thorough without overwhelming. I also learned the visual assets really help with communicating the content.

Technical Platform Research

Since the marketing team needed to maintain the site post-launch, I researched WordPress solutions that would be beginner-friendly without sacrificing design quality. I evaluated several page builders and decided on Divi because:

Visual drag-and-drop interface that non-technical users could understand
Customization capabilities
Pre-built modules for common content types
Ability to save and reuse custom sections
Responsive design controls built-in
Large community and documentation for troubleshooting

This choice prioritized long-term maintainability over custom development complexity.

Building Visual Language

We started with an existing logo and simple color scheme, but no established brand personality. As we refined the content, a visual language began emerging naturally. We identified common imagery that would resonate with our audience and help them understand what Hubmatrix did:

Compiling moodboard imagery for Hubmatrix brand

Key Insights

Simplify the Complex Logistics is complicated, but our audience didn't need to understand every technical detail.
Visual Storytelling Over Text Walls Decision-makers are busy. Large blocks of text wouldn't get read. Illustrations showing processes, icons representing services, images that conveyed efficiency and reliability. Information needed to be scannable.
Logical Content Flow Each page should answer a specific question and transition naturally to the next. Rather than making visitors hunt for information, we'd guide them through a logical journey: What is 3PL → What does Hubmatrix offer → How does it work → Why choose us → How to get started.

Interpret

Analyzing to conceptualize

Information Architecture

After completing research and refining the content, I worked with the team to organize information into topic‑based pages and sections that defined the navigation.

Primary Navigation

Home: Overview and value proposition.
Fulfillment: What Hubmatrix offers like warehousing, order fulfillment, and shipping
Process: How the fulfillment workflow operates
Integrations: E-commerce platform connections like Shopify, WooCommerce, Magento, BigCommerce, etc.
Guide: Decision-making resource for outsourcing fulfillment
About: Company background and expertise via Europa Sports
Contact: Getting in touch
Get Started: Primary call-to-action for new clients

Page Flow System

Each page answered a specific question and created a natural progression through the content. Rather than forcing visitors to figure out where to go next, we designed a guided journey: What is 3PL fulfillment → What services does Hubmatrix provide → How does the process work → Can they integrate with my platform → Should I outsource → Who is Hubmatrix → How do I get started. This reduced cognitive load and created a clear path from awareness to action.

Solve

Wire-framing

I began wire-framing how content would lay out on each page, focusing on visual hierarchy and preventing cognitive overload.

Layout Principles

Chunking Information: Breaking long explanations into smaller sections with clear headings, white space, and visual breaks
Alternating Layouts: Text-left/image-right alternating with image-left/text-right to create visual rhythm and prevent monotony
Visual Anchors: Using illustrations and icons to give eyes a place to rest and brain a shortcut to understanding
Scannable Hierarchy: Important information in prominent positions with supporting details in secondary positions

Hi-Fi Wire-frames for Hubmatrix pages

Visual Design

Early in the process, I envisioned illustrations that would help users understand and form mental pictures of 3PL logistics processes. These would be behind-the-scenes glimpses into operations, showing the warehouse systems, the order flow, the quality control, the shipping coordination. The goal was helping potential clients realize that having an experienced company handle these complex processes meant one less thing to worry about in their business operations.

Examples of the Illustrations used on Hubmatrix

Typography

I selected clean, professional fonts that conveyed reliability with a modern feel. The type scale provided clear hierarchy from large headings down to body copy, ensuring good legibility even on content-heavy pages.

Color Scheme & Background Images

I added secondary colors, grays for backgrounds / supporting content, a series of background images to help define sections to build on the existing simple color palette.

Iconography

I designed a consistent icon set representing core services and processes.

Style Guide for Hubmatrix

Presentation

We presented the overall concept and wire-frames to stakeholders. The response was enthusiastic. They could see how the content strategy, visual design, and user flow worked together to tell Hubmatrix's story effectively. We received feedback on specific wording and imagery preferences, but the core system was approved and we moved forward.

Implement

Development

Wordpress Integration

Rather than building a traditional WordPress theme from scratch, we implemented the site using Divi, a visual page builder. This decision prioritized the marketing team's needs for ongoing maintenance over custom code elegance.

WordPress + Divi Setup:

Custom Divi child theme for brand-specific styling
Modular sections that could be saved and reused across pages
Custom CSS for refinements beyond Divi's standard controls
Responsive design settings ensuring mobile, tablet, and desktop optimization
Form integrations for lead capture and customer support inquiries

High-Fidelity Prototyping

With typography, color scheme, spacing, and imagery determined, we moved directly into building the interactive experience in Divi. This approach let us prototype and refine simultaneously. The stakeholders could see the actual website taking shape rather than reviewing static mockups.

Building Hubmatrix with Divi and WordPress

Content Management System We structured the Divi library so the marketing team could:

Add new pages using pre-designed section templates
Update text and images without breaking layouts
Duplicate and modify existing pages for new content
Maintain visual consistency through saved modules

I created documentation showing the marketing team how to use Divi's interface, which sections to use for which content types, and what not to change (global styles, navigation structure).

Solution

What We Delivered

We built a fully responsive website that positioned Hubmatrix as a credible logistics partner from day one. Illustrations and photographs broke down complex warehouse and shipping processes into visuals anyone could understand. The navigation walked visitors through their decision journey: what is 3PL fulfillment, what does Hubmatrix actually do, how does the process work, can they integrate with my platform (Shopify, WooCommerce, Magento, BigCommerce), and who's behind this company. Everything led naturally to "Get Started" touchpoints, making it simple for interested businesses to reach out.

Results & Impact

Business Results

After launch, Hubmatrix achieved a 35% increase in sales and client onboarding, validating that the website successfully established credibility and converted visitors into customers.

What We Learned From The Results

Simplicity Wins: Breaking complex logistics processes into understandable chunks with visual support made the services accessible to business decision-makers who weren't logistics experts.
Platform Choice: Using Divi enabled the marketing team to maintain and expand the website independently.

Reflection

Key Takeaways

Content strategy and visual design must evolve together. Starting with rough business concepts, we refined messaging while simultaneously developing visual language. Neither could be finalized independently

Platform choices should prioritize long-term needs. While building a custom WordPress theme from scratch might have given me more control, choosing Divi prioritized the marketing team's ability to maintain the site independently. That was the right strategic choice even if it wasn't the most technically elegant.

Simplifying the complex is harder than it looks. Logistics involves dozens of moving parts. Deciding what to explain, what to simplify, and what to leave out required constant judgment calls. The test was always: does this help our audience make a decision, or does it add confusion?

What I'd Do Differently

Pushed for less written content. I feel there was still to much written content on the site. The site should be more visual and less text.

Create more robust brand guidelines. As the marketing team added content, some inconsistency crept in. More comprehensive documentation about voice, tone, and visual standards would have maintained consistency better.

Conclusion

Hubmatrix required building brand identity and digital presence from the ground up. As Lead UX/UI Designer and Developer, I shaped the brand personality, defined content strategy, designed a visual language, and built a maintainable WordPress website that drove business results.