Supersport Sporti
A side project's bold pursuit to push SuperSport into the mobile app era
An in-depth story and behind-the-scenes that unveil the strategic vision and agile process that led to the development of SuperSport's sports betting mobile apps designed to withstand the test of time.
2013
I still remember the year 2013, when the mobile app world was booming, when whispers of expanding into the mobile app space rippled through SuperSport, the largest betting company in Croatia, and minus5, the sister tech company.
While the idea was only mentioned in passing, it sparked something within me. I decided to take the challenge upon myself to design and architect an app that would expand SuperSport in this area.
It was to be somewhat of a secret side project, unknown even to our CEO Hrvoje Zlatar, the rest of the minus5, and the SuperSport teams. I needed time and focus to plan and make this vision come to life without distractions.
At the same time, talented product designer Damir Turkovic joined our team. I saw great potential in him and believed we could face this huge challenge together.
This was also a good onboarding project for him to jump in the boat as quickly as possible and also for me to do the mentoring through something practical.
The Design, The Process
For Sporti, I set the bar high, envisioning an end-to-end product proposal, the whole package from the app prototype, the app name, the brand, marketing of it, etc., Something substantial, the complete project that we can take and spin it on the market as quickly as possible.
Also, I wanted to set it up as correctly as it could be from day one, lay good foundations for the future, and prepare us to be as fast as possible in the initial iterations and ideation of the product.
Starting Out: The Wireframes
The first step was to create simple wireframes to lay out the whole app to have the whole scope and the big picture of the project in mind while deliberately avoiding any burden regarding colors, typography details, imagery, and similar.
We needed the fast feedback loop for ourselves to iterate quickly. Thinking today about it, it was the best move we made at that stage of the project.
Sporti // Wireframing the app
The Design
Spending some time ideating and quickly wireframing all application parts and components to create the big picture of the app paid well in the end. The design process afterward was a complete breeze.
We knew exactly what we wanted and designed the complete application with pre-match sports betting, live sports betting, lotto, player account, wallet, and more in a matter of about three or four weeks.
The designs were created for both Android and iOS simultaneously, and we connected them in InVision to create a fully interactive prototype.
The final prototype was a pretty convincing simulation of the app as it should be once developed, giving us something of substance later for the pitch but also for us to have a good feel of the overall user experience and design while working on it.
With today's tools, such as Figma, this process is something natural, but then in 2013 it was something brand new and on the edge.
Sporti // Final app Designs
Slicy
Along the way, I even developed a Photoshop plugin/extension for the automatic export of graphic assets in various formats and sizes for each platform, sparing us the time-consuming burden of repetitious asset exporting and handling.
I named it Slicy since, well, its main duty was to automatically slice up and resize the enormous amount of icons and images we used stored as Smart Objects in one PSD file and export them individually in whatever format we needed then.
This was also a fun mini-project since Typescript (programming language) had just arrived, and I was eager to test it on something useful instead of writing the code in vanilla JavaScript (yep, I'm not a big fan of it).
Incorporating Slicy into our workflow boosted us into third gear, allowing us, even more to focus on important things and polish the designs up to a point we felt they were up to the standards we set for ourselves.
Today, by experience, I really recommend automatizing the asset pipeline (and any other boring and repetitive process that can be automatized). It will give you speed, agility, and time to focus on creative things and help you avoid context switches doing boring, time-consuming things. Which are, in most cases, also tremendously error-prone.
Slicy // Export User Interface
SuperSport Sporti: The Brand
The Name
The first step was to come up with a name for our app. I proposed "Sporti," and it stuck. It felt fresh and captivating; it was easy to remember, something that would stay in people's minds; it had a sport in it.. it was an exact fit for what we wanted to do: to make a brand out of it.
I also wanted Sporti to be known and related to SuperSport since the brand is massive and widely known in Croatia; hence it would be best to ride it on its shoulders. In the end, and with all this in mind, the SuperSport Sporti brand was born.
Branding & Identity
Next, we designed a logo and some other identity elements to make brand foundations. Damir took the lead in this and the marketing areas since he really likes to do these things. I simply laid back and enjoyed the process while providing guidance and direction here and there. The logo was simple, elegant, and practical to use everywhere.
Exactly what we needed.
First Identity Concepts
Marketing & Channels of Promotion
To be complete, we needed the website from which Sporti would be downloaded (we couldn't place it on the app stores since regulations don't permit betting apps to be there) and all other marketing materials.
I took the design and frontend development of the Sporti website while Damir concentrated on marketing materials.
We needed materials for print, such as street billboards which SuperSport usually used for large-scale traditional marketing, web banners, and social media posts, all with previews of how they would look either on the actual billboards on the streets or on the digital channels such as affiliate websites, SuperSport web, and so on.
After all this was done, we were ready!
Sporti // Marketing Previews
Sporti // WebSite Design & Frontend development
The Pitch!
We poured our creativity and passion into every aspect of the project, and it wasn't long before our vision started to materialize at a quick pace.
The whole process felt natural; everything was effortlessly flowing without any stops or blocks. It just poured out of us into existence.
Finally, the day came when we had all the materials in place. It was time to present our accomplishments to the CEO and persuade him to let us do the pitch with SuperSport.
Hrvoje (the CEO) was hesitant at first but ultimately agreed to let us pitch our project to the SuperSport executives.
Next day (if I remember correctly), armed with feelings of completeness, our hearts raced as we packed up our materials and made our way to the SuperSport HQ to do the pitch and present the whole thing.
As we unveiled our vision to the SuperSport team, for the moment, there was just silence.
The room had filled with the energy of opportunity and anticipation as they realized that all the foundations were there in front of them, with a well-thought plan of execution on all fields needed to go into development and to the market afterward.
They simply asked, "When will you start?" And with that, our project was greenlit.
Mobile Development Teams
After this, we quickly assembled the iOS and Android development teams from scratch within the minus5, hiring talented individuals who shared our passion and enthusiasm for the project.
With their help and several months of development, the first version of Sporti came to life.
Over the years, Sporti has grown into a market leader, constantly evolving to meet the needs of its users.
It's become a platform that brings people together, allowing them to engage with their favorite sports and games in an entirely new way.
A Decade Passed By
Now, it's been more than 10 years since that beautiful sunny day when everything started, and while we've made several makeovers and expansions, the essence of SuperSport Sporti remains the same as the app we created a decade ago.
This decade-long adventure taught me that taking risks, believing in yourself, and trusting your instincts can lead to extraordinary results.
Sporti offered me invaluable lessons about teamwork, leadership, innovation, taking responsibility, and standing for something you believe in. I am tremendously proud of Sporti and its origin story. The entire process was a unique and fulfilling experience, both personally and professionally.
So, to anyone reading this story and dreaming of creating something extraordinary, I encourage you to take that leap of faith. Believe in yourself and your vision, surround yourself with talented and passionate people, and never give up, no matter the obstacles that stand in your way.
For it is in the pursuit of our dreams and visions that we discover our true potential and make our worlds wide and colorful.
