How do i add custom widgets?

Hi all, i am new on here, and it appears i may need to stick around,

I am having a massive headache creating custom widgets for a site i am building in-house.

Essentially i require 6 custom widgets per page as illustrated in the attachement.

The boxes beneath the large slider.

I want the widgets to be managed from the widget section (sidebar widget) and moveable around the site .

site testing is live https://mediacrisp.byethost3.com/

i am working through this page by page, but need to get the widgets for the first page up and running tonight (next 12 hours)

could anyone advise me how to build them and what to code and where to code, once i have my head around the first page it should be very simple from there…

diagram of aim