MarketWatch Stock Market Game

Goal

In response to the recent growth in individual investing, MarketWatch saw a need for engaging and realistic investment training. They created a web-based investment game called the Virtual Stock Exchange where users build portfolios, react to markets in real time, and compete for a spot at the top of leaderboards.

While the Virtual Stock Exchange game was widely successful, MarketWatch wanted to better engage the education and university market with a new mobile app. The project to build a mobile app kicked off three months prior to the start of the academic year in September, giving the developers a tight deadline to build a worthwhile experience.

Why Flutter?

They quickly realized developing native iOS and Android apps would require more time than they had, so MarketWatch brought in Flutter agency Very Good Ventures (VGV) to build and launch the Virtual Stock Exchange app before the start of the new school year.

VGV needed to deliver a user-friendly design and robust features by an ambitious deadline, and they leaned into Flutter’s core features to do just that. First, they showed the MarketWatch team a proof of concept built in Flutter, including rough UI and app flows. To save time, they leveraged Flutter’s pre-made widget libraries so that design and development could happen in parallel. As the design evolved, the ability to easily customize the widgets made refactors more streamlined, and Hot Reload allowed developers, designers, and testers to see modifications in the code without restarting the app. Because Flutter leverages one codebase for multiple platforms, the team could quickly update designs and refactor code knowing that changes would not impact iOS or Android individually. All together, these features allowed VGV and MarketWatch to start development much earlier than if design had been performed fully upfront.

Their solution

As the app was being developed, VGV leaned on Flutter’s Hot Reload feature to make rapid updates in response to feedback from the MarketWatch team. In just three months, the team was able to launch a feature-packed app, including stylish, interactive charts and graphs that allow users to quickly see how their virtual portfolio is performing, easy-to-follow quote information, and real-time, simulated trading including transaction details. The app also offers users insight to where they stack up against competing investors through an expansive leaderboard. It deep-links to informative news articles within the MarketWatch app, which allows users to do research on stocks that they are interested in to ensure they make well-informed investment decisions. Animations, which the team created directly in Flutter using CustomPaint, create beautiful and effective branding moments.

“Thanks to Flutter and VGV, we delivered on our goal of building a fun, engaging, and performant app for all screens and mobile devices in significantly less time and cost than if we built it natively. The team and thousands of players are very happy with the results.”

- Clarence Kwei, SVP Consumer Technology, DOW JONES

Results

Just in time for the beginning of the fall college semester, MarketWatch and VGV launched the MarketWatch Stock Market game for Android and iOS after just three months of development. Despite the tight timeline, the app met MarketWatch’s goal of releasing a beautiful, feature-rich app with a captivating user experience.

As a result of their new Flutter-based development process, MarketWatch has seen improved developer efficiency and a 50% reduction in development costs. Based on this success, the team is exploring building more Dow Jones apps with Flutter.