Pinkbike Redesign

Having previously ridden mountain bikes, Pinkbike was a website I used almost daily. It became my go-to for everything from bike news, event coverage, technical advice from the forums, and the largest community for buying and selling bikes through its marketplace.

The project began as a visual refresh, but quickly evolved after my first concept revealed that improving the interface alone would not solve the underlying experience.

• Reviewing Pinkbike's current experience and identifying opportunities across its core areas.
• Exploring a refreshed visual identity, including logo, colour and typography.
• Researching competitors, and other news, community and marketplace platforms.
• Designing and iterating responsive journeys for core areas.
• Critically reviewing whether they solve the intended problem.

Despite having a passionate global community and millions of followers across its social channels, the platform has remained visually unchanged for many years. While its continued popularity shows that this still works for its audience, I took the opportunity to explore how a more modern UI/UX experience could make the platform feel simpler to use without losing the identity that has made it so successful.

The challenge was to modernise the platform without reducing it to a generic redesign or removing the familiarity its long-standing community relies on.

Explore my Miro board to see the process I took!

Branding research

While the existing Pinkbike logo is well established and highly recognisable within the mountain biking community, I saw an opportunity to explore a more modern visual identity.

I also noticed that, despite Pinkbike being one of the company's flagship products, there is no dedicated mobile app, while Trailforks, another product within the same group, has its own. I wanted to consider how the brand and experience could evolve beyond the website and work equally well across web, mobile and future digital products.

Competitors

Pinkbike is a unique platform that combines news, forums, a marketplace and community features, so I looked beyond direct competitors and explored each of these areas independently. This gave me a broader set of patterns for handling content-heavy experiences before moving into any designs.

The analysis of the platform highlighted themes that shaped the direction:

Brand identity

I began by exploring a refreshed visual identity, starting with the logo. My goal was to create something that felt modern and distinctive whilst retaining a connection to the Pinkbike brand. I also wanted to introduce a vibrant pink gradient that could become a recognisable part of the identity across the site.

While sketching ideas, I noticed that the lowercase p and b, when joined at the tail and stem, loosely resembled the silhouette of a bike. I developed this idea further, refining the letters so the bike shape took shape.

I defined a colour palette and typography that would be used consistently across the website and app. For typography, I deliberately avoided decorative typefaces in favour of something clean, and highly legible. Pinkbike is a content-heavy platform - whether users are browsing news, forums, reviews, or marketplace listings - so readability and accessibility were key considerations throughout this.

Iteration #1

My initial approach was to preserve the way Pinkbike works today - a central hub where users can quickly branch off into news, forums, the marketplace, events, and other services. The homepage shown below was designed around that philosophy.

Questioning my approach❓

After building an interactive prototype and using it as though I were a member, I began questioning whether I had actually solved the problems I set out to address.

Although the visual design felt cleaner and more modern, the overall experience still suffered from many of the same issues as the existing website. There were too many competing buttons, the page lacked a hierarchy - I found myself constantly deciding where to look or what to do next. The UI had improved, but the UX hadn't.

Instead of designing around the site's existing structure, my next step was to identify the platform's core user needs and construct the platform around those primary journeys. While I don't have access to Pinkbike's analytics, I'll use my own experience as a long-term user to prioritise the features that deliver the greatest value.

After reviewing my first iteration, I stripped the experience back to the fundamentals. Through my research, I identified that Pinkbike's core value revolves around three main areas: News, BuySell, and the Community Forums. These are the features that keep members returning, so I wanted the experience to revolve around them.

Navigation

Initially, I analysed the structure of the navigation. I identified duplicate links, and overlapping categories.

My aim was to reduce cognitive load by simplifying the information architecture and making the most important areas immediately accessible.

The updated navigation gives prominence to Pinkbike's core features, while also providing space for seasonal or commercial content. In this example, 'Summer Deals' can be top-level without competing with the primary navigation.

Homepage

The original homepage functioned almost entirely as a news feed, making it feel more like the News landing page than an actual homepage. My second iteration shifts the focus towards (the defined) Pinkbike's three core experiences.

News Page

The existing News page consisted of a long chronological list of recent articles. Categories were hidden within a bar next to the heading, while additional categories and the archive were placed at the very bottom of the page. With thousands of articles spanning over two decades and 24 categories, discovering older or specific topics felt unnecessarily difficult.

I redesigned the page where categories and search now take precedence, allowing members to browse content by interest rather than simply scrolling through recent posts.

Underneath, the latest articles remain central to the experience, with the newest story given greater prominence. I also repositioned the archive into a permanent sidebar alongside the content. Whilst reviewing the site, I noticed articles from over ten years ago continuing to receive new comments, this suggests to me that historic content remains valuable to the community.

BuySell Page

With almost 7,000 active listings, BuySell is one of Pinkbike's most valuable features. However, the current experience immediately presents users with a large collection of categories alongside a basic search, creating an overwhelming first impression.

Having previously used BuySell myself, I remembered spending unnecessary time deciding which category best matched the bike part I was looking for. During my observation, I found several duplicated categories and others that could be grouped more logically. For example, categories such as Complete eBikes and Complete Gravel Bikes were separated despite naturally belonging under a broader 'Complete Bikes' category.

After simplifying the category structure, I explored two ways of searching.

Mobile Prototypes

Using Figma's auto layout, I was easily able to translate desktop to mobile. As pages like the News and BuySell were so long and would feel like endless scrolling for the user, as well as the user not being able to see their selections on the BuySell filter search, I incorporated an accordian to resolve this.

On the News page, the accordian contained all the categories. On the BuySell page, the accordian activated when a user selected an option, so all the other selections would collapse and the user could move onto the next section.

As this is a personal project, validation is based on repeatedly reviewing the work against the original goals, testing interactive prototypes and challenging my own ideas.

The most important validation point came after the first iteration. Using it as a member exposed that the concept had improved the visual design without improving the foundation. Rather than justifying the design, I returned to the research and rebuilt the direction around Pinkbike's core journeys.

The project has moved from a broad cosmetic refresh into a more focused product redesign. The latest direction creates a clearer hierarchy around the core areas. I have also simplified the navigation, increased visibility of core areas, and introduce a more structured way to search for bikes/bike parts.

• A clean UI is not good UX: The first homepage looked more modern, but prototyping showed that it recreated the same problems as the existing experience.
• Hold beliefs lightly: Stepping away from a polished concept allowed me to return to the core user needs and build a stronger rationale for the second iteration.