Estimate Project

OddsCrowd web app

A web-based solution for the community of sports bettors
Web design
Web development
Betting
PHP Laravel
OddsCrowd web dashboard showing live sports odds and betting interface.

Project Idea

In 2018, the OddsCrowd team came to us with the idea to create a sports betting community with useful betting resources. Their plan was to let users make forecasts for the outcomes of events, while the service will track their success and create the leaderboard to be displayed on the main page. Other users will be able to see this rating and buy forecasts for future events from those whose predictions they trust.

OddsCrowd would charge a 5% commission from purchases of forecasts and earn on affiliate links of bookmakers, as users would bet on the sites of these bookmakers, not directly on the OddsCrowd platform.

Users, in turn, would earn money by winning in competitions — they’d make “virtual” bets on the platform, and those who take the highest places in the rating would receive a prize by the end of the competition.

Our task

We needed to create a convenient web app with high performance and adaptive design, and an admin panel to manage the content and user profiles. The main requirement, however, was to finish the app in 4 months — before the start of major sports events, specifically the Super Bowl, since it would raise the interest of potential users.

Analytics & workflow

Analytics helps us to figure out which features are needed for betting software development and to estimate the cost and timeline of the project. This way we can set realistic expectations for the client and goals for the team.

Together with OddsCrowd, we chose this functionality for the first version:

Functionality chosen for the first version: registration, login, password reset, two-factor authorization, connecting feeds, making forecasts, calculation of success and ratings, dashboard, profiles, purchasing forecasts, email notifications, payment gateway integration, and chat for users.
Functionality chosen for the first version: registration, login, password reset, two-factor authorization, connecting feeds, making forecasts, calculation of success and ratings, dashboard, profiles, purchasing forecasts, email notifications, payment gateway integration, and chat for users.

Our initial estimation for betting software development

We decided to make the first iteration that would include UI/UX design, project architecture, generation and update of the internal database, and the page with 2 feeds: the one with the future events with bets on them and another one with the results of the played games. After that, we needed to adjust the estimate since it could scale up or down. Once the UI/UX design was ready, we were able to make a precise estimate, and then, having connected third-party services, we checked all the risks and made sure there would be no troubles with creating the app’s logic.

Project estimation in hours: design 99, frontend 312, backend 248, management 101, DevOps 38, QA 113, and 1103 hours in total over 14 weeks.
Project estimation in hours: design 99, frontend 312, backend 248, management 101, DevOps 38, QA 113, and 1103 hours in total over 14 weeks.
Interested in getting an accurate estimate for your project?
Let’s discuss your idea!
Request a call

UI/UX design

The OddsCrowd team had very specific design requirements and provided us with self-made wireframes. The app’s logic was clear, so we only needed to polish it and make it convenient for users. Since betting software development solutions have a lot of nuances like multiple statistics, horizontally scrolling tables, and loads of information on the pages, our task was to carefully structure the layout and arrange the components.
OddsCrowd main page wireframe with upcoming games, betting tools, best picks, and news blocks.

Registration

For the convenience of users, we implemented sign in/ sign up via social networks — it’s not necessary to sign up via email. The next step users take is choosing country and state; they can also add a profile picture and a promo code.
OddsCrowd registration screens with sign-up form and account setup.
OddsCrowd registration screens with sign-up form and account setup.

Main page

On the main page, you can see the header with upcoming events and useful betting resources. On the right side, there are affiliate links to bookmakers’ websites with bonuses for users.
OddsCrowd main page with upcoming games, betting tools, best picks, and a news and bonuses sidebar.
OddsCrowd main page with upcoming games, betting tools, best picks, and a news and bonuses sidebar.

Profiles

Users can view profiles of the best bettors on OddsCrowd, check their performance, and subscribe. The platform grades and shows how all users perform on it, so users can decide on their next bet.
OddsCrowd bettor profile with a monthly profit chart, sports rankings, and betting stats.
OddsCrowd bettor profile with a monthly profit chart, sports rankings, and betting stats.

Game center

Here users can find future games to bet on and see important info to help them win — top picks, odds, and insights. There’s also a tab with live games that users can watch at the moment.
OddsCrowd game center with a sports sidebar, upcoming games, and MLB betting resources.
OddsCrowd game center with a sports sidebar, upcoming games, and MLB betting resources.

Odds comparison

OddsCrowd collects odds details from the largest and top Legal US Sportsbooks, then displays them in a chart. This lets users directly compare odds and lines to find the ideal Sportsbook for placing their bet.
OddsCrowd odds comparison page with a moneyline table of bookmaker prices per game.
OddsCrowd odds comparison page with a moneyline table of bookmaker prices per game.

Best picks

The OddsCrowd algorithm uses smart data monitoring and analytics to find good picks. It combines odds and line changes from top sportsbooks to figure out the best odds for each game and shows them to users.
OddsCrowd best picks list with bettors’ rankings, strike rate, ROI, and bet links.
OddsCrowd best picks list with bettors’ rankings, strike rate, ROI, and bet links.

Competitions

OddsCrowd hosts free betting contests with large cash rewards. Users can join a contest and track their picks with OddsCrowd. The highest-earning players win.
OddsCrowd competitions page with private competition steps and an upcoming public competition.
OddsCrowd competitions page with private competition steps and an upcoming public competition.

Odds boosts

It’s a special offer that raises the odds for a specific bet to encourage more betting. It's often used for bets with multiple moneylines, like parlays and prop bets, but not for a single moneyline.

OddsCrowd odds boosts list with sportsbook offers showing raised odds and sign-up bonuses.

Sportsbooks

Here users can check reviews on the listed bookmakers.

OddsCrowd sportsbooks table with bookmaker reviews, ratings, and sign-up bonuses.

News & insight

On this page, users can read articles about sports news, see line movements, public betting trends, recent team schedules, etc.
OddsCrowd news feed with sports articles and thumbnail images.
OddsCrowd news feed with sports articles and thumbnail images.

Brand identity

OddsCrowd also provided us with a logotype and brand colors that we used for buttons and accent elements. We also chose a light gray color for the background and white for the cards in order to make the interface clean and minimalistic and avoid cluttering it up.

OddsCrowd brand color palette with red, blue, and light gray swatches.

UI kit

OddsCrowd UI kit with button, switch, input, avatar, and status component states.
OddsCrowd UI kit with button, switch, input, avatar, and status component states.
Need help with designing a stunning and user-friendly interface? Our UI/UX team is at the ready.
Check design services

Development

When the design was ready, we created the architecture, completed the first iteration, and adjusted the initial estimate for betting software development. To meet the deadline, together with the OddsCrowd team we decided to give up on some not-very-important features, since they required a lot of time for implementation. It would be unreasonable to spend time on these features due to upcoming sports events:

Features dropped from the first version: generation of images with statistics to share on social media platforms, and more details in user ratings.
Features dropped from the first version: generation of images with statistics to share on social media platforms, and more details in user ratings.

Tech stack

We used PHP Laravel for the backend and Vue.js with Nuxt v2 framework for the frontend. We chose such technologies for betting software development since OddsCrowd needed search engine optimization — Vue.js supports server-side rendering which is important for SEO, and in combination with Nuxt, it improves SEO along with the overall performance.

The app’s performance was one of the main requirements of our client, and to optimize it, we used Nuxt Speedkit. As for the admin panel, we created it with WordPress.

Note: If we started the project now, we’d choose React.js instead of Vue.js. However, in 2018 Vue.js was a more stable and popular framework, hence, it was the most suitable option at the moment.

Third-party services

  • To enable purchases in the app, we implemented PayPal as a payment gateway — it’s convenient for users from the USA, which are the target audience of OddsCrowd.
  • Initially, we used the eOddsmaker service for generating and updating data in the app.
  • We also implemented the authorization through Twitter, Google, and Apple.

Killer features

Game center

The navigator for upcoming games in a variety of sports. Displays information on team.
OddsCrowd game center screen with upcoming games, team stats, and betting resources.
OddsCrowd game center screen with upcoming games, team stats, and betting resources.

Live now

Displays data on the games currently taking place. Data is regularly updated in the background.

OddsCrowd live events screen showing in-progress matches and odds.
OddsCrowd live events screen showing in-progress matches and odds.

Odds comparison

Allows users to compare odds on the same games from different bookmakers and choose the best one. Then they can go to the bookmaker’s website and place a bet.

OddsCrowd odds comparison table listing bookmaker prices per market.
OddsCrowd odds comparison table listing bookmaker prices per market.

Best picks

Displays the odds selected by the most productive users of the platform which are selected automatically on the backend. It also displays the best odds from partner platforms.
OddsCrowd best picks panel listing top bettors’ picks with odds and bet links.

Updates after the release

In the latest version, we removed the chat — it did not find the expected popularity, and the client decided to stop supporting it with betting software development services.

We also replaced eOddsmaker with a new service — an aggregator of data on games and odds. According to the NDA, we can’t disclose the name of the service. We implemented it to give users more data about teams, games, places, and more detailed game statistics. Better analytics help users make better bets and win more often.

Challenges we faced

During betting software development, there were difficulties with the integration of the aggregator service:

  • it was under development and didn’t always work stably
  • data structures constantly changed, and we had to adapt to the changes
  • sometimes we had to wait for the necessary functionality to appear

Therefore, we had to put more effort into error handling so that the application would not fail if the external service stopped working or returned incomplete data. It took a lot of time because the data was used throughout the app.

Results

  • 🏈 We finished the first version of the app in 14 weeks, making it before the Super Bowl
  • 💪 After 2 years of collaboration, the OddsCrowd team decided to extend the business and create a mobile app with our help.
  • 🔥 The web app has been working for more than 5 years, helping OddsCrowd with their business.
Want to build a scalable web app with high performance?
Contact us to start!
Discuss the idea
THANKS
FOR WATCHING!
Ronas.IT
Design & Dev Team
2023