JD Sports - Top Navigation

The Challenge:

The top navigation on JD Sports UK’s website was starting to look a bit like a jumble sale - cluttered, confusing, and not exactly user-friendly. Many visitors were skipping it altogether and diving straight into the search bar. My mission? To give it a total makeover, making it easier for folks to find what they’re looking for and giving our internal teams a bit of structure too.

Project Scope:

This was a team effort, no doubt about it. I had to work closely with folks from all corners of the JD Sports world - merchandising, SEO, development, CRO - you name it. Our goal? To cook up a navigation system that just made sense, something we call Categories, Titles, and Products, all in line with JD Sports’ lingo and goals.

Approach:

We kicked things off with a good old design workshop, getting everyone involved to hash out their ideas. Then, I dove into the data, digging through Google Analytics to see how users were interacting with our current setup. And of course, I couldn’t resist a bit of snooping around on competitor websites like End, Hanon, and The Chimp Store, plus a few big retail names like AO and Argos.

Design Workshop:

Got everyone together to share their thoughts on how the navigation should look, all backed up with hard data. We had a few hurdles to jump, including some resistance to change, but we kept things friendly and balanced as we brainstormed.

Structure Refinement:

Once we had all the ideas on the table, it was time to get practical. We stripped out any unnecessary clutter, moved underperforming links down to the footer, and tidied up our category links to keep things nice and focused.

Wireframes:

Whipped up some wireframes to show off the new navigation design, making sure it looked just right on screens big and small.

Visual Design:

Once we had the wireframes sorted, I went all out with some fancy high-fidelity visuals, making sure they were as engaging and insightful as possible. Then, we put them to the test with some real users, gathering feedback and fine-tuning our design based on their reactions.

Testing & Validation:

Time to see if all our hard work paid off! We showed our designs to a bunch of different users, and they loved what they saw. They found the new layout way easier to use and gave us a big thumbs up. Plus, we even saw some improvements in conversion rates in smaller markets, giving us the green light for a wider rollout.

Next Steps:

Now that we’ve got the thumbs up from users, it’s time to put our new design through its paces with some A/B testing on international websites. If all goes well, we’ll be rolling it out to our flagship UK site and beyond in no time.

Tools I Used

Excel (Audit of Links - Source of truth for all departments to see the link data)

Miro (Kick Off Workshop / Competitor Analysis)

User Testing (User feedback)

Monetate (Test live on the .fr / .de / .ie International websites)

Adobe XD (Wireframes / Visuals)