I used to play a lot of Counter Strike: Global Offensive back in college and university, but fell out of playing it. However, I got massively into watching the last CS:GO major tournament in Paris, which made me want to get back into Counter Strike with the launch of Counter Strike 2.

The game, however, is so mature and full of nuanced, complex gameplay features that it made it intimidating to jump into. Luckily there is a wealth of information online for stats, tips, tutorials and general information, but it's not all in one place. I, therefore, wanted to make a companion app for the game to bring all the information into into one interactive source of truth.

I started to break the app down by grouping the information into what would become the structure of the app - This became my Home - Maps - Learn tab bar, with more granular nested screens within the Learn tab.

Next I set around creating a design style, defining colours, text styles and patterns. I like to do this before starting to create any screen, giving me a palette to create the screens from.

Then I broke down each screen by the information I'll need to display, the interactions needed to access it and then building components to complete those actions - Combining these rough components created the basis of my wireframes. From there, I fleshed out each component, applying my design system palette and building out the high res screens.

For this project I decided to go the extra mile and start prototyping the app in Swift and SwiftUI. I set out to replicate my Figma process but in code - So defining colours, text styles and patterns as custom views that I can call later. Then creating my individual components into views. Then finally combining all of these into larger views and screens. I decided to go the extra mile and implement at working news feed as well, which hooked into the Steam API and pulled live news about the game into a working paginating news feed.

Overall, I'm incredibly happy with how this project turned out - Although I didn't manage to fully finish the Swift app, it was super fun to turn my Figma designs into a working app that I have on my phone.

I really like the visual style of the app, and although it didn't end up looking quite like the CS2 visual language Valve ended up going down, I still think it looks great and on brand with CS:GO, while also remaining functional and accessible.