Кажется тяжело, но попробуй разбить на маленькие подзадачи и максимально упрости проект:
т.е. на скрине достаточно сложный проект, хотя многое будет однотипно.
Попробуй сделать такой вариант - есть карта с клетками(используй canvas), где надо раставлять элементы ландшафта, дороги и т.п. Так же можно дома, здания расставлять и т.п.
И сделай кнопку сохранения, если это редактор игровых карт. Т.е. чтобы сохранял эту карту. Все остальные элементы интерфейса к данной задаче мало относятся.
если кратко разобрать эту задачу, то будет примерно так - карта представляет из себя, например, массив, в массиве можешь указать число, которое будет соответствовать рисунку текстуры, например - 0 - трава, 1 - деревья, 2 - дорога и т.д.
попробуй разбить на маленькие подзадачи:
1) загрузить изображение
2) сделать несколько изображений
3) сделать в памяти массив, где будут храниться номер текстуры соответствующей клеточки
4) сделать визуал, который считает сохраненный массив с текстурами и расставить их по нужным координатам
5) сделать функцию с тремя параметрами, которая будет ставить текстуру клетки в нужное место(можно проверить в консоли)
6) сделать окошко, откуда будем вытягивать текстуры
7) разместить текстуры в окошке из пункта 6
8) реализовать перетягивание из окошка в поле и сохранение. этот пункт лучше разбить на подпункты:
8.1) сделать определение координат квадрата над которым находится мышка.
8.2) сделать определение текстуры в окошке из п.6 над которым находится мышка.
8.3) сделать перетягивание текстуры мышкой при клике и сохранение в нужном месте при отпускании
9) сделать сохранение результата
Это будет конечно не уровня senior, но хотя бы поймешь суть и что к чему, для себя думаю пойдет. Потом можно поискать библиотеки для разработки игр на js и т.п., если будет необходимо.
Посмотри несколько видео на ютубе по созданию простых игр на js, там весь нужный функционал разбирается. Т.е. как загружать изображение, события клавиатуры и мышки и т.д., но если не знаешь азов js, то будет тяжко
