Flutterflow | Best Practices

Milestone estimate

• When creating milestones, developers will be required to estimate the time required for each milestone. Please use the following points as a guide for providing accurate estimates:
• 1 point = Less than half a day (minimum)
• 2 points = Approximately one full day
• 3 points = A full day

These guidelines aim to ensure consistent and realistic time estimates for project milestones.

Client input

DB choice

• If the client needs phone auth, we most likely go with Firebase
• If the client needs a lot of filtering/sorting (directory apps) we most likely go with Supabase
• (Advanced) if the client has their own DB and auth, we can build an app around it, BUT they need to provide an API which will allow us to work with the DB.

Other input

• Make.com - sending emails, automations etc.
• Google Workspace / Outlook - sending emails - they should connect it in make.com
• If we use search, and we went with Firebase - Algolia
• App name, app website, app icon

Design Stage

Low Fidelity

• Try to design the app so we can reuse components
• For forms (editing/adding) - leave comments in whimsical and let’s discuss them
• For search and filters - let's have them in a separate screen - user clicks search and it opens up a new screen with search results. Then they can go back and search again. Same with filtering.
• In Supabase it's possible to search by multiple fields. This means, that sometimes we don't have to add filter as they can just search by role or city or any other field.
• Let's do hours of operation of a business as single input text if we only need to display it, so users can input Monday - Friday, AM, PM freely. Unless we need some calculations on these.
  Q: How easy is to move something in FF? To move a section above another section. Does it just drag and drop as with Glide?
  A: Most of the time, yes, it's drag and drop. We have to be careful, though, because sometimes we might be using Custom Components. And then if we wanted to move something in this custom component, it would move everywhere where we're using that.

High Fidelity

• When designing, use components from FlutterFlow Components Library. In Figma, add a note with the name of a component "Card 07".
• It is possible to change properties of a component, BUT it will change this component globally for the whole app.
• Example: We want to use "Card 07" component, but with favorite heart icon in Home tab, and without it in Search tab. In Home tab we add a note "Card 07 - with heart icon" and in Search tab we add "Card 07".
• Note: we don’t need to name a new version every time. For example, if we add and icon to "Card 07", we can just add a note "Card 07" and we’ll just add an icon to that component. Adding names such as "Card 07 - with heart icon" is useful, when we have multiple versions of components in the app.
• We can design and create our own components from scratch, although we should use FF library components if that’s possible.
• Let’s think about it as designing an app with Glide but imagine that Glide has a possibility to add and design custom components. Most of the time we would be using their pre-designed components.
• It’s better to create a component from scratch and add a note "Our component" or something like that, THAN try to find something in FF library and then do many changes to that and leave a note "Card 07" for example.
• There is no need to leave the comments on every component in the design, just so it’s clear to the dev what’s what.

Handoff

• Build on our account, then change the ownership of the project to their email.

Known bugs

• If there is a null error on a list made with "generate children", and it's sorted by some field or filtered, check if this sort/filter is not null in the DB - add condition or make sure there are no rows with a null title for example.