Best way of creating a custom mobile thumbstick?

i've got a topdown shooter i'm working on, trying to make it mobile friendly.

for gameplay reasons i want to create 2 custom fixed position thumbsticks, one on the left side of the screen and the other on the right side of the screen, i did read the developer pages and searched wide on the internet but i can only find how to create normal buttons for mobile users using ContextActionService:BindAction() but there was no article or a video showing how a thumbstick can made and how to detect input from it.

more about the controls specificaly:
i got the scripts made, on pc, the default WASD controls are for moving the character, theres a fake pointer, a part in workspace that follows the mouse, which is then used as a looking point for the character to rotate towards, i want the left thumbstick to control the movement of the character like wasd, normaly like the default one (but there is a reason for which i need to use a scriptable control system from starterplayer), the other one would control the part rotating arround the player, so it controls the angle the player is looking at.

any places i can find out more? i'd be glad if anyone explained this indepth because i want to know as much as i can for mobile controls. only thing i know is generic press to do function buttons...