How to Design a Ticketing Page That Converts
What is good y'all? John D Saunders here. You know, the vibes in today's video, I'm talking about how to develop a ticket flow for your museum, how to have folks visit, get excited about your exhibits and walk through that ticketing process with ease. So let's dive into my computer. I'm going to walk you through this process and we'll work on this together.
All right, y'all. So in this example, we are using one of our clients museum of the African diaspora in San Francisco. So we built this site from soup to nuts in the Webflow. So as Webflow CMS integrated with the platform and then we've integrated third parties for the ticket system and software. So what we wanted to do was make it very easy and simple to go ahead and grab a ticket from this museum.

You don't want to have people to go through too many processes in regards to this. You want to keep it very simple. And so a few things you make it too many steps. You add hidden fees. Check out. Uh, some other things are there's no mobile optimization. That's always a no, no. So I'll show you how we optimize this site. And then you just have confusing ticket options for folks that don't understand. And the last piece slow load time.
So as you can see, we have a video looping back here. This is the video that's hosted. It's short about 10 to 20 seconds. So we'd have a nice clip, but it also shows a quick glance at what the museum does, some of the. It's both things that they showcase and then you can understand how to visit, view events and learn. So if I'm here and I can do everything I need before even starting to scroll in the fold.
Now if I wanna get tickets, I click tickets right here, I scroll down, I can grab tickets right here, and boom, within two clicks, I'm already at admission. I can say I am not a member, I am just a, I'd say I'm a member. I'm gonna click one. I'm gonna click update cart. And then as soon as I do that, I fill in my information and I check out, that's it. So three steps from beginning to end, you really want to simplify the checkout process.
You want to reduce the form fields. You want to also have a guest checkout. So folks don't have to register for the website. You can see, I can tap here and then you want to implement other sideways like Google, Apple pay, uh, PayPal and things like that. So some things that we want to focus on here. Are leveraging really simple calls to action throughout the site.

So as you can see, we have tickets here. You scroll down, you have tickets here and then you have a breakdown right here before you can get to that specific ticketing page on the whole page. You have all the info you need to make an informed decision on. Visiting the latest news. You also have a section for becoming the member, which is a clear CTA that we want to make sure you include.
You also want to use urgency, the social proof throughout the website. We have a ton of learning resources here. You can look at more like classroom or a team's education lab. It's just the best way to segue, get people ready, excited for the website. You also see the total price up front. There's big bold buttons. You can even look at the exhibition calendar and see things that are coming up here. We like to say what way this into three specific sections.
You have past, you have current, and you have upcoming. That way folks can look at the archive and they can see some of the ones that were there. We have a filter here where you can filter by the year and you can search through all of this. This search is actually built through Webflow CMS. So we're able to import that information and have that built to the archive. The way we have it set is based on date.

So once that date passes for the exhibition, it automatically goes into past and you don't see it in the, uh, current or upcoming. And as you can see, you have upcoming here. You can click that exhibition. I love these pieces, by the way, and get some really cool details here regarding that. You've added breadcrumbs here, so you can go back easily to that exhibition. You can also see other exhibitions here on the side rail. Then, of course, you add this detailed footer where you can navigate through all of the other pages.
So again, the main focus or the results, you'll get higher conversion rates. You reduce friction, meaning more completed purchases. You also have fewer abandoned cart because it's easy and effective to get through the website. You get increased mobile sales, and I'll show you the mobile version of this website. As you can see, it accommodates mobile.
The video still auto plays here, but now that menu shows up like this. And then you have specific drop downs for some of these more neat sub pages that folks can navigate to. And as you can see, most of the content is left aligned for accessibility, easy to read, easy to convey as well. And overall, all this does is just improve customer satisfaction. The important thing is just making it really easy and effective to get through and navigate website.
Hope this was helpful. Y'all. Thank you all for checking out the video. If you have any questions, feel free to let me know, reach out in the comments, hit your boy up and let's chat soon.
Peace.
Whenever you're ready, there are 3 ways I can help you:
Web Design Studio Accelerator
WDSA 3.0: Join 300+ branding and web design agency owners as we provide a thorough blueprint to scaling your efforts with 5, easy to follow lessons, SOPs for every step of the process and a proven method for increasing sales and deal flow
Read the BBWD Newsletter
Weekly insights and strategies tailored for branding and web design agencies. Transform your vision with industry secrets and actionable tips.
Grab the Borderless Book
Get my book, Borderless: How to Hire, Train and Grow a Design and Web Development Agency with Worldwide Talent. It’s the ultimate guide for web designers, brand designers, entrepreneurs, and business owners looking to tap into the vast pool of global talent.
Scale your agency.
Start here.
I will never spam or sell your info. Ever.