Football Field Composer

Well, I've an idea since I saw the Star Wars Movie 'The Phantom Menace'. There was a little scene on a screen in the bar. Since then I've this idea, to build not exactly that, but something similar.

Now, since I'm older, and limited in what I can and want do, and finally the modern technologies and frameworks make it possible and feasible, I work towards to realise my idea.

One building step is this Football Field Composer. Surely not a perfect and feature complete Web App, but it fits my need and I'm pleased for now with it. You can find the code here and a demo here.

Background: The heart of the project is built around P5.JS and basic Javascript. I did this, cause I like p5.js and I didn't want to invest to much time in learning next.js or other Web UI frameworks. Even, in the long run, this would be the better decision.

Basically the Web App consists out of a (Canvas) drawing area and a settings area. In the setting area, you can set some parameters, which then reflect how the football field is drawn.

The football field is surely not drawn like official rules describe and defines it. It reflects more how I imagine how my football field needs to look for the next steps I have to take towards my idea.

So feel free to fork and improve and change, or write a better or different version. Hey it is up to you, what you want to do with it or not do with it. But for me and new it is good as it is.

As always apply this rule: "Questions, feel free to ask. If you have ideas or find errors, mistakes, problems or other things which bother or enjoy you, use your common sense and be a self-reliant human being."

Have a good one. Alex

Share this