How to slow down the rate of state of scene change

Phaser 3
1

We are creating an application which renders the same scene with DIFFERENT location of same assets everytime a button is clicked.
We want to slow down the rate at which the state of scene changes.
We do not have a physics attribute in our config
We did try referring to phaser3 examples and use fps, timeScale, timedEvent but we were not able to achieve what we wanted.

The scene:
The scene is pretty similar to ‘chess game’.
Scene has a 9*8 grid.
Scene has an image asset at one of the grid(be position 1,1)
Once user presses ‘next’ the grid is created and displayed again with the asset image on a different location
Essentially the image asset moves to 2,1 from 1,1
The movement is not a move function within the scene rather a whole different grid is rendered with the image on 2,1

The rendering of grid, every time ‘next’ button is clicked is very fast. I would like the rendering to slow down so the rendering looks like a smooth movement.
An example is shown below. (Image clipped from chess.com)
state1: https://ibb.co/DYt0Dts
state2: https:/ibb.co/WgPPNbW

2

Hi,
A tween that modify sprites alpha perhaps?

3

After 8 hours of research we ended up uisng JS function setTimeout:

setTimeoout(this.nextBtnFunction.bind());