Versus Social

UI/UX Design

Front-End Development

Asset Creation

Visual design, motion graphics & development for a peer-to-peer sports betting app.

Background

When the inquiry from Versus first landed in our inbox, we were hesitant. Having felt the pain of more “can’t lose parlays” than we’d like to admit, we weren’t sure if enabling a sports wagering platform was something we wanted to do. As it turns out Justin and Mike from Versus Social were on a more noble mission. Rather than another 24/7 casino that profited from naïve gamblers, Versus was building a peer-to-peer wagering app to be used among friends and family. No money required. Mike and Justin painted a clear picture for us. Users could make their own bets, invite friends, and live chat during the experience. Betters would set the odds - with all the data they needed to do so at their fingertips. Justin could bet with his non-sporty friends. Nobody would lose money. Mike could win a bet against a friend from college. He’d owe him a beer the next time they hung out. The idea grew on us. But we still weren’t clear what was needed.

Challenges

Versus did make one thing clear. A failed website project was not in the game plan or budget. They were looking to go public with their app soon. Having received plenty of failed projects before, we understood exactly what they were afraid of. The Versus team had another concern. Being a team of two, they were focused on product development and had no time for unessisary meetings, babysitting, or sweating small details. Lastly, it was decided the site needed the following functionality:

1. Ability to collect leads from interested users

2. A CMS enabled blog to serve as a hub for search intent optimized content focused on sports betting

At this point Versus’ needs were clear:

✅ A foundational website to showcase their app (in ASAP time)

✅ A standout design that grooved well with the app

✅ Ability to collect leads and publish blog content

✅ A team that could lead the full project, no babysitting

Often, the most fun projects are the ones where we can strategize, call the shots on the creative side, iterate fast on ideas, and bother the client minimally. We held one all hands meeting with the team where we learned everything we could about their business, asked the hard-hitting questions, and walked away ready to execute.

Execution

Creating standout design while still respecting business goals (and making it dev friendly 😬) inside a website is tricky. We were tempted to go overboard in the design phase of this project. Instead, we decided to look for opportunities to subtly communicate the competitive spirit of the app. Doing this would allow the Versus app UI to still be the champion of the website. A common theme in head-to-head contests (think MMA, Rock 'Em Sock 'Em Robots, Mortal Combat) is “the split”. One contestant on each side with their colors and characteristics loudly displayed. A similar theme was used by Twix in their Left Twix vs Right Twix campaign. We were drawn to this and wanted to nod to this competitive motif in the design. We decided it would create a sweet experience if we layered these split screen patterns throughout the site as section accents and dividers. This would make it clear to users there was competition waiting for them on the other side of a sign up.We had a good foundation for our design but there were bigger fish to fry. Content.

We say it all the time. Content carries a site design.

Versus had been working on their product for a while. They had an array of mockup screens that were being used by the app’s development team. Using these assets, we could kill two birds with one stone.

1. Communicate the app function to users visually

2. Create interactive assets

Business driven content and compelling design. We were getting somewhere.

With handoff files prepped and sign-off from our team captains, it was time for our development sprint. We developed Versus' entire website, including a user-friendly CMS-driven blog, in less than two weeks. We not only built the site but also conducted comprehensive user and responsiveness testing. The CMS was carefully crafted so that the Versus founders could easily manage and expand their blog at their own pace. We also implemented strategically placed lead capture forms for seamless export to the team's CRM.

More projects

Versus Social