Redesigning ParkingBlock.com: A professional, user-friendly template for all Traffic Safety Store child sites

See Figma File

Traffic Safety Store operates multiple child sites, each targeting a specific niche within the safety industry. However, the design of these sites was, and is, hilariously inconsistent and outdated. There was a charm, sure, but it undermining brand credibility, which is crucial to Traffic Safety Store. They aim to cultivate a feeling of safety when their customers purchase products from them.

ParkingBlock.com, which focuses on products for constructing and maintaining parking lots, suffered from a color scheme straight out of 2009, pixelated product photos, and a general veneer that vibrated unprofessionalism. It made it difficult for engineers and construction professionals to quickly find what they needed, and Google knocked the site in it's rankings due to a lack of optimization.

Additionally, the company wanted a scalable solution: a design that could serve as a template for future child sites, improving both development efficiency and SEO performance.

Process

To tackle the redesign, I began by studying successful design systems in Figma, understanding how consistency and scalability could be achieved across multiple sites. Lucky to not start from zero, I leveraged insights from A/B tests and user interviews that I've conducted in the past for the parent site, trafficsafetystore.com. While new customers will have a better experience overall, returning customers would find the new site familiar yet significantly improved.

It was required to use preciously tested pre-existing elements from the main site, like product cards, which posed a challenge in creating a cohesive visual identity. Using Figma, I established reusable components, color systems, and typography systems to support future child sites.

Finally, to address the poor-quality visuals, I personally retook product photos, ensuring every item looked professional and high-resolution.

Information Architecture

Colors & Typography Guides

Quick changes for future child sites

(video of changes)

For quick prototyping, there is the batch styler plugin in Figma. That way, all we have to do is input the different fonts and colors, and it will change the styles across all the pages.

That means for the future, when Muvz decides to rebrand constructionsafetystore.com and trafficcones.com, designs should take minimum time in the turn around process.

The Design Solution for Parkingblock.com

The redesigned ParkingBlock.com delivers a clean, intuitive experience for engineers and construction professionals, allowing them to quickly locate and purchase parking-specific products without navigating the vast inventory of the main site.

The design also functions as a robust, flexible template for other child sites. Colors, fonts, and images can be easily replaced to maintain unique identities while ensuring overall consistency. This approach dramatically reduces development time for future projects while strengthening brand recognition and trust.

Outcome

• Hotjar analytics showed faster user navigation, fewer clicks, and reduced frustration, indicating improved user experience.

• Sales of parking blocks increased by 5%, accelerating inventory turnover and reducing storage costs.

• Strengthened Traffic Safety Store’s credibility as a leading traffic safety company and improved SEO performance across child sites.

Reflection

For future iterations, I aim to create an even more responsive prototype, incorporating expressions and some coding to enhance interactivity and adaptability across devices.