Skip to main content

Introduction

The problem: complex user interfaces

As your Flutter app grows, its user interface becomes complex because your widgets need to support more use cases. You may end up with hundreds of widgets which depend on each other. And then you notice that changes to one widget affect many others.

Complex User Interface

On top of all that, you have to make sure your UI works across multiple devices, text scales, languages, and themes. And you also have to worry about logic, data, performance, animations, accessibility, etc.

The solution: isolate your widgets and use Monarch

Your job, as a Flutter developer, would be easier if you could decouple your widgets from the rest of your app and backend. That is why we built Monarch—to help you build Flutter widgets in isolation.

Isolated Widgets

To use Monarch, you first write stories. A story is a function which returns a widget in a visual state you care about.

You can then use Monarch to preview the stories you have written. You can then see your widgets across different devices, text scales, languages, themes, and more. All without an emulator.

Monarch makes it simple to mock hard-to-reach edge cases, pinpoint bugs, and build responsive UIs. All without running your app or backend.

In the long run, Monarch will help you build complex user interfaces in a sustainable manner, and it will also help your team work better together.

Isolated Widgets

Other Benefits

  • It is very simple to use Monarch. No need to learn how to use special classes, fancy concepts or modify your production code.
  • Monarch stories are very similar to Storybook stories. If you are familiar with Storybook, then Monarch will feel very familiar.
  • Monarch doesn't affect your production code thus your app bundle size stays the same.
  • If you decide to stop using Monarch, all your stories are reusable from your widget tests.
  • Monarch runs natively on your desktop platform. You can use it side-by-side with your IDE.