Skip to main content
·Brock

Iterating on Design With Real Feedback

How adding PostHog analytics and watching real user sessions changed the way I approach design decisions on GotNext.

designanalyticsposthog

A few weeks ago I wrote about the first redesign: going dark, squared borders, gaming-focused aesthetic. That was the right direction, but I was still guessing about a lot of things. Then I added PostHog, and everything changed.

The Problem With Building in a Vacuum

When you're a solo developer, you make decisions based on what you think works. And sometimes you're right. But more often, you're too close to the product to see the obvious problems.

I'd been using GotNext daily, so everything felt intuitive to me. I knew where every button was. I knew the flow for creating a match, joining a ladder, entering a tournament. But I'm not the user. I'm the builder. Those are very different things.

Adding PostHog

PostHog is a product analytics platform that gives you event tracking, session recordings, funnels, and feature flags. I integrated it into the Next.js frontend, and within a week I had enough data to start making informed decisions.

The session recordings were the most eye-opening. I could literally watch how people navigated the site. Where they hesitated. Where they clicked expecting something to happen and nothing did. Where they gave up and left.

What I Found

A few things jumped out immediately:

Tournament registration was confusing. Players would open a tournament page and not immediately understand how to join. For team tournaments, the flow was even worse. Captains didn't realize they needed to invite teammates before checking in. Teammates didn't see their invitations. I watched multiple sessions where a group of friends tried to enter a tournament together and gave up because the team invitation flow was unclear.

Ladder joining had too many steps. Users would click on a ladder, see the leaderboard, but then have to hunt for the "join" button. Once they joined, the next action (finding a match) wasn't obvious. The flow from "I want to compete" to "I'm in a match" had too much friction.

Mobile was rough. I'd been developing primarily on desktop, and it showed. Cards were overlapping on smaller screens, text was too small, and some buttons were hard to tap. About 60% of traffic was coming from mobile, so this was a big deal.

Reporting scores and finding matches was harder than it had to be. Players would finish a match and then struggle to find where to submit the result. On the ladder side, finding an available match to join wasn't obvious enough. Too many clicks, not enough clarity.

What I Changed

Based on the session data, I made several focused changes:

  1. Simplified tournament joining. Big, clear "Register" button. For team tournaments, the captain flow now walks you through inviting teammates step by step with clear status indicators for each invite.
  2. Streamlined ladder entry. Join button is prominent on the ladder page. After joining, the UI immediately shows you how to find your next match.
  3. Improved mobile layouts. Responsive adjustments across every page, especially cards and tables.
  4. Made score reporting and match finding more obvious. The submit result button is now front and center after a match, and available ladder matches are surfaced more prominently.

None of these were big rewrites. They were targeted adjustments based on real data. That's the power of having analytics. You stop guessing and start iterating on evidence.

The Ongoing Process

Design is never done. I check PostHog weekly now, looking at funnel completion rates and watching new session recordings. Every week there's something small to improve. The compound effect of these small improvements is significant over time.

If you're building a product without analytics, you're flying blind. Even a basic setup gives you more insight than months of guessing.

    Iterating on Design With Real Feedback | GotNext.gg