Separation of concerns in flutter applications

[Ehsanuls55]

Recently, I had to implement onboarding journeys for ClickUp newcomers! This was a really important task because a lot of new users were just about to discover the platform with the incredibly fun ad we debuted at the Super Bowl !

via ClickUp

The tutorial allows our many new users, who may not be familiar with ClickUp yet, to quickly understand how to use various features of the app. This is an ongoing effort, just like the new ClickUp University resource we are pursuing!

Luckily, the software architecture behind the ClickUp Flutter mobile app allowed me to implement this feature fairly quickly, even by reusing the app’s actual widgets! This means that the tour is dynamic, responsive, and exactly matches the app’s vp media email list actual app screens—and will continue to be so, even as the widgets evolve.

I was also able to implement the feature thanks to proper separation of concerns.

Let's see what I mean here.

Separation of concerns
Designing a software architecture is one of the most complex topics for engineering teams. Among all the responsibilities, it is always difficult to anticipate future evolutions of the software. That is why creating a well-layered and decoupled architecture can help you and your teammates in many ways.

The main benefit of creating small decoupled systems is definitely testability ! And this is what helped me create an alternative demo of the app's existing screens!