How to create a design work-flow for mobile or web user interfaces?

When I start to design a new user interface or new feature for mobile or web applications, I feel that I'm doing the process randomly without having a strategy like I do when I write the code in React.

This mostly happened with Scratch Projects.

Let's say you opened your Invision or Adobe XD and you will start the design of new UI.

Sometimes for side projects, I don't have DESIGN SYSTEM for spacing, font types, and so on.

I have these issues :

• Should we design from top to bottom of the user interface?

• How to organize the versions of the UI? v1, v2

• Design the full-completed UI then implement it is good a process.

• Is there a tools for visual testing based on Best Practices especially with font-sizes and layouts?