Off Topic - ayuda para realizar este proyecto

Buenas, hace poco conocí un página web donde hay una aplicación para hacer formaciones de equipos de futbol, me gustó mucho la idea y quiero replicarla ya que la pagina ha quedado desactualizada por lo que se ve.
La página es: https://chosen11.com/
Tengo entendido que la pagina fue diseñada usando javascript, entonces: como puedo hacer una página similar? hace un tiempo deje la programación pero aun creo poder desarrollarlo, algún consejo de como empezar este proyecto?

Bueno es un proyecto muy complejo y no creo que nadie desarrolle aquí el código y te lo haga, menos en el lenguaje que tu sugieras.
Deberías empezar por facilitar la información básica para desarrollar el proyecto y dejarla en archivos de texto, separado por comas, esto lo puedes hacer mas facil si lo haces en excel y al final exportas a cvs, que permita trabajarlos y consultarlos mucho mas facil, por ejemplo, nombre del equipo, con los colores del uniforme, las alineaciones posibles, y el numero de jugadores, finalmente creo lo que quieres es la foto de la alineación en la cancha, o que es lo que quieres, debes definirlo desde el principio, que quieres que te entregue el programa. , luego abria que averiguar todo lo que puedas con respecto a como trabajar graficos en html y javascript.

REsumiendo:
1. Base de datos con los equipos, los colores de los uniformes, las alineaciones y en lo posible los nombres de los jugadores en excel.
2. Ir aprendiendo todo con respecto a canvas en html, te dejo este vinculo que te enseña a programar en html con canvas para que puedas sacar una foto de lo que vayas a dibujar en la pantalla.https://www.w3schools.com/graphics/canvas_intro.asp

3. ir pensando en como se forman las alineaciones si solo sabes los numeros 4-4-4, realmente ve haciendolo a mano en un cuaderno.

El programaador debe conocer a la perfección el procedimiento que va a programar para que después lo redacte en el lenguaje y el computador se lo entienda, esto facilita, que se entienda la logica que lleva todo el proceso.

Gracias por responder, hace unos días he iniciado este proyecto en JavaScript y voy subiendo los avances diarios a GitHub para poder recibir ayuda y consejos, dejare aquí mi repositorio por si alguien tiene una sugerencia de cómo mejorar el código.
https://github.com/marcodiazpa/py_fcb

agregando las imágenes de los jugadores aumentas el Desafío y yo me inclinaria más a hacer la parte gráfica en SVG y al final poner el SVG en un canvas html para sacar la captura y guardar en PNG o en bitmap.

porque me inclino por SVG, porque SVG puede hacer una máscara de una fotografía.

las fotografías las puedes tener generalmente cuadradas, pero si las quieres redondas, y pequeñas eso lo hace más fácilmente en SVG y no con javascript.
también con SVG PUEDES PONER TEXTO DONDE quieras y como quieras, hacerlo en javascript tendrías que programar cada función por aparte.

además en SVG, podría luego animar las figurillas y recrear el juego real.

Hola, en realidad las imágenes son rectangulares y pueden ser extraídas de una API de la página transfermarket (actualmente las tengo descargadas en una carpeta imágenes dentro del proyecto), lo que las hace circulares es el código de estilos que le puse. Eso del SVG si lo he considerado, la imagen del campo es SVG pero la copie del código original, no la hice yo, aunque también tengo que aprender a trabajar con imágenes SVG para mejorar la carga de la aplicación. Lo del canvas aún no lo tengo claro, tenía entendido que era más para diseño.