notwaldorf / ama

:raising_hand: Ask @notwaldorf anything!
94 stars 13 forks source link

Visual Tools for Polymer Development #73

Closed dreyn74 closed 6 years ago

dreyn74 commented 7 years ago

Hi Monica. At the end of your 2017 Polymer Summit talk about Wizzywid, you said that you would like to see more visual tools for Polymer Development. I couldn't agree more with this sentiment, and I wanted your opinion a visual programming tool called "visual scripting" In visual scripting, functions, operators, and variables are represented by nodes or shapes with input and output pins which are connected to each other by wires on a canvas or grid. Do you think that there is a use for visual scripting in Polymer or JavaScript development, and how would you go about making a visual scripting tool in Polymer?

notwaldorf commented 6 years ago

I think visual scripting may be good for beginners, or to allow non-developers to prototype something that outputs code (sort of like wizzywid). Scratch, for example, is a pretty popular visual scripting language that's popular with kids!

You could build this in a ton of different ways, tbh. Maybe each visual "block" is a component, and it has a specific api about where it can attach to other blocks. The UI itself can definitely be broken down in smaller visual components (the block-picker, the current code, the output, etc). It's very hard to give any specific advice, since I think everything can be built "correcty" in many different ways :)

The way I make apps is to build first, then refactor later. I tend to start with one giant component, and when it gets too big and unmanageable, I break it down into smaller ones. Maybe that can work for you too!