About over 2 years ago we started developing the Monash Thrive app, which started with a small team and grew into something bigger than we expected, more about the app here.
During this journey we pivoted from Electron and moved to Flutter, led by our senior mobile dev Gagan Khara, he assured me that this tool would be a better tool for our rapid agile product lifecycle.
The trial was designed to take feedback on long-term usage surveys and improve on the findings after each trial
Why does a designer care about a tech stack?
Well, some dev teams would hate a designer who wants their designs recreated exactly in code as it is in Figma, someone who will pick every meticulous detail from a shadow spread to a precise gradient angle.
Luckily our team was not like that, and we trusted each other’s expertise and facilitated it by giving each other opportunities to contribute. An easy-to-use development tech stack meant I could run the development code in my own branch, see the current designs and improve/comment where improvements are needed directly, thus speeding our workflows and avoiding big mountains of Jira tickets.
Why did we choose Flutter?
Well, a more detailed answer is given by the man himself here. Aside from all the technical aspects that really made our dev team happy, I was most excited about certain aspects of Flutter SDK.
Learnability
Learning Flutter was relatively easy for me as a designer (with some object-oriented program knowledge), I was able to pick up the language and understand what was going on in the development environment.
Freedom
Flutter allowed me a lot of design freedom to design things as I wished and our development team was able to exactly bring my ideas to life, with no compromise and no lags.
Designs and transitions were recreated near perfect in flutter
flutter made possible seemless screen transitions and micro-interactions
Managing my design system
Flutter allowed the dev team to create reusable widgets, these widgets could have various variations, this was extremely useful as I created a design system keeping in mind these reusable widgets, which drastically sped up our workflow to design and test new screens in real-time.
preview of a design system created keeping in mind all theme variations
Hot reloads and testing with Rive
One of the tools we used to bring our app to life was Rive, more about that coming soon. Rive seamlessly integrated with Flutter and it helped me check my animations in real time on simulator devices and real devices.
Hot reload enabled me to quickly do edits in my rive state machine and test them on my simulator.
Hot reloads and quick exports from rive made it really easy to test animations
My experience
Working with Flutter was a breeze, a massive shoutout to Google for creating a tool like Flutter and investing in its community, it has really helped us make something we are proud of and enjoy while making it.
