It would be great to have visual editing controls for the margin and padding if an element. Something similar to Webflow. They have an excellent design to allow the user to edit (visually), the margin and padding of an element.
I don’t believe in copying design but, when something just makes sense (similar to how the Mailbox app introduced us all to swipe on an email list view to snooze an email), then I feel that it is something others should benefit from.
In general, I too have been wondering about this concerning the UI overall, ever since talk of an improved UI was coming in Pinegrow Version 3.
It was discussed briefly here in this previous thread by @matjaz (via the link) & @MhdAljuboori, concerning the “Properties Panel”, etc., being reworked, and a few overall thoughts from myself there as well.
Just for the sake of discussion and comparison - here are just a few gathered GUI’s showing various structure, organization, segmentation, along with inputs, etc., Some being more logical and natural than others.
// ——————————————————————
EDIT:
Added app names to picture.
Here are the names as well, from left to right they are:
Pinegrow, Bootstrap Studio, Macaw, Scarlet, Tandem Code, GrapeJS, Xpressive, Webflow, Blocs
Obviously there are many others as well. I really didn’t touch upon the various cloud offerings (Aside from Webflow since it was mentioned to begin the thread). Those are “just a few” as mentioned above, others exist as well.
However, some are yet to be released like Tandem. While others are abandoned like, Macaw and sadly the followup which was to be Scarlet as it looked brilliant. Xpressive also seems inactive, but it seems like a really nice idea and execution overall. For the Blocs image I actually merged all the tabs into one stacked image. All the other UI’s are as they appear, while some have further inputs as well that were not included.
Of course you don’t see the general functionality and user interaction aspects from the static picture. Things such as popups, slider bars, expanding and collapsing, units types (px, em, rem, etc.), color pickers, etc., etc.,
But non the less each offers good nuggets of inspiration that can be gleaned from all regarding UI inspiration.
PS: Tandem Code - is the one which has “potential” aspects which somewhat remind me of Pinegrow, it seems like an interesting project, time will tell. Perhaps the similarities are just my own perception however.
// ——————————————————————
I trust Pinegrow v3 will improve in these areas overall concerning the UI/UX. The underlying data is already there, so its just merely a matter of better improving it’s structure, organization, segmentation and the various user inputs [as discussed previously in the above linked thread].
Have faith …
^ So … I trust it will all work out.
It would be great to know what software these panels belong to. Not to have users going elsewhere but it might provide some users an opportunity to work with another editor until the UI is sorted out with pinegrow.
I am a bit hesitant to post the names, as one on that list could potentially be an upcoming Pinegrow competitor. But if @matjaz , does not mind then I will add the names to the image.
Feel free to post the names. I’m curious as well 
This is another reason why I support developers like @matjaz and apps like Pinegrow. Not afraid of competition and always wanting to make their products better. Anyone who reads this that is on the fence, need to purchase a subscription to Pinegrow as soon as possible and support development shops like this one!
@matjaz & @macphreak , I went ahead and added the names in my original post.
I agree, I too really appreciate Matjaz’s attitude as well as his confidence in Pinegrow, and life in general. The Pinegrow story [ see - Link 1 & Link 2 ] is truly inspiring, and I agree people should buy and get on board with Pinegrow. Keep up the great work Matjaz.
Thanks @Pinegrow_User & @macphreak, means a lot to me to hear that 
If all goes well we’ll show a part of our new CSS GUI interface in next
week’s Countdown to 3.0.
excellent! the CSS interface is the one that always tripped me up!.
and the way Macaw implemented the margin/padding with coloured borders and using the cursor keys for up/down values as you watched it move was really good.
I was on the Scarlet Beta testing program for a bit , but they dropped support for my OS, so I didn’t continue. I still have one or two of the earlier releases somewhere. It used standard HTML CSS instead of the proprietry .mcw format that you then needed to export as html css etc out of the project in earlier releases of the standard Macaw app. (before they sort of downgraded it to Indigo - not terribly ethical and asked kickstart backers and others to effectively Pay again.
Looking forward to the CSS teaser
I agree with adding a clearer view of the margins and padding to the panel, but I personally would appreciate seeing the margins/padding a little clearer in the page view too, when an element is selected. It seems like the transparency could just be tweaked down to be a little more opaque and easier to see.
I’m looking forward to see the first glimpse of Pinegrow’s new CSS GUI coming in version 3. Just for the record, I hope the UI improvements far exceed just the margin and padding aspects.
Along the same lines as the above examples:
Another rather interesting UI example (which I forgot about) is the “HTML Designer For Brackets” extension. Which is/was quite an ambitious and impressive accomplishment for a Brackets Extension. It’s nice that each panel is independent, moveable, collapsible. It also has some nice inputs such a radial dials, sliders, etc., and the concept for Transition and Keyframe input is rather nice as well. Xpressive also has/had a nice interface for Transitions and Keyframes as well.
So I thought the “HTML Designer For Brackets” montage screenshot was worth including also, as it too shows general ideas for structure, organization, segmentation and inputs, etc.,
However probably all a little late to be showing any of these which have been shown as examples for inspiration, especially if you’re gonna possibly show something next week. 
@matjaz - Also speaking of Brackets, it would be nice to have a Brackets Extension for Pinegrow like the one for Atom.
Edit:
Since I mentioned Xpressive again in this post, here is a better look at it’s 3 tabs shown in the original above. I feel those tabs offer a clean solid example of logical organization, segmentation and inputs, etc., much like a few of the other examples shown as well.
Curious to see what direction the Pinegrow UI/UX goes. 
Still waiting for the SublmeText2 one
anyway, I shall wait and see how the multiple text editing PG 3.0 works out first
Its a lot of effort for them to go to for that, for me to ignore really.
and yes, Brackets does rock! I LOVE the way the CSS styling POPS up at a short cut in the code! that is awesome
Pinegrow 3 - CSS GUI , sneak peak.
Great job, can’t wait to get the tool I was looking for so long.
O… M…G!
wow!!!@@fafssjafdl!!!
Much like the “HTML Designer For Brackets” example above, Brandcast utilizes panels, and has a solid logical structure, organization and segmentation. The inputs could however be expanded or improved. For instance when incrementing input numbers via the keyboard its rendering seems quite sluggish compared to Pinegrow.
From what I have seen Brandcast actually seems the closest to the standard Adobe UI from a look and feel standpoint, which should strongly help design minded users. Much more so than the UI’s of Webflow, Froont, Squarespace, Wix, Weebly, etc., and the various other many offerings in the “code free” designer focused cloud based product arena.
Of course the “Visual CSS Editor coming in Pinegrow 3” has already been shown as a sneak peak. But I thought the Brandcast UI was worth including as well for anyone whom likes UI examples and inspiration, some nice iconography design also.
Given all the screenshot of other apps, I posted in this thread, I thought it only fitting to now include the Pinegrow 3 / 4 new Visual CSS Editor screenshot as well. Job well done @matjaz and the Pinegrow team. You greatly exceeded margin and padding. 
Next up?
This seems like “one” of the next logical progressions for Pinegrow.
