Personalize the Design Panel

A proposal to make panel navigation cleaner and more efficient.


I really appreciate the variety of CSS properties available.
However, since tabbed navigation is now history, this could become a bit of a problem.

A fairly simple example, where it is not quite so important:

image

Scroll-margin is a useful property, but how often do you use it per project? Maybe 1 time on average?

What do you think of the following approach?
CSS properties could be controlled globally, deactivated ones can be switched on as required individually per dropdown item.

Here is a clearer example, and there are assumably other areas where it gets even more important.

Every user has different priorities.
What the default of a new installation would be is not important to me, so I don’t want to influence this in a certain direction either.
It might be a smart decision to initially hide some stuff for the average user (remember, advanced users will usually find the available options anyway), but that’s another topic for itself.

Perhaps also a case for the role editor.
How exactly it is implemented is also of secondary importance to me. My only concern here is the functionality.

Another advantage of this is that now almost any other missing property without could be added, without overloading the interface.

Are there any disadvantages?
Well, since everything would be optional and you would have full control over each property, not really.
Consistency is also a given, as it is a global setting and every block would behave in the same way.

It would be just a smart option to respond to the individual needs of users.
I’ve seen similar approaches in other tools, kind of Figma like.
Display the basics, add more when required.


I think it would be conducive to a cleaner interface and a more efficient way of working.

4 Likes

Yes, this is a good plan.

The only additional point I will add is, let’s make the defaults configurable via the role editor (or whatever UI supersedes it), as non-technical clients and editors won’t want to choose the properties themselves and then we can provide the best experience for them tailored to their needs.

3 Likes

+1 on this. I think Louis mentioned somewhere that they want to optimize the onboarding process which would fit with your suggestion in my opinion. Open cwicly to a wider audience of users and also of course to users who are maybe not familiar with all CSS properties would maybe overwhelm them. With that feature you can make sure that the interface stays clean and as minimal as possible.

But having an export / import feature for all settings (roles, ui-settings like that, maybe some global settings, etc) would be very cool then. One can create his own way of interacting with cwicly and easily re-import those settings.

Maybe integrating it with the „cloud“ for pro users (monetizing feature for the future) where the getting started process also can import your preferred settings would be a cool addition I guess!

3 Likes

Or get asked for simple / pro mode while setting cwicly up which would toggle such stuff to some predefined defaults for the different choices…

Wow, @Marius, thanks for sharing and putting this all together.

Strangely enough, I have been wondering about this too, as I find Gutenberg core has a nice setup with their hidden options.

They put the property control in the panel, which might be something we could do to have some type of consistency.

I can see this very easily achieved, with both persistence for user specifics and role editor limitations.

Good point, @StrangeTech.

In your experience, do you currently use the role editor to filter out block properties with the specialised blocks settings or not? → Global Block Behaviour | Cwicly

This is really useful info for the onboarding part of things. We do need a more standardised way of quickly importing specific/all settings in one click.

4 Likes

@Louis, we don’t use this as the defaults provided by Cwicly create a consistent experience as it currently is. If there was more configurability for the general display, per @Marius 's feedback then we would definitely utilise that.

Flexibility and configurability are our #1 requests for these types of features because we work with clients with very different editing needs and want to provide the best experience for all of them.

Being able to tailor the interface to allow them to work in their preferred way will be excellent.

Ideally, because the roles ostensibly serve as editable presets, being able to import/export these between sites will give the optimal combination of power and control.

2 Likes

Just wanted to give some quick feedback based on the latest progress update.

Well implemented and thought out. Very clean, efficient and even more flexible.
Avoids the issue of a jumping interactable UI element (add/remove property when doing so).

I like it very much :+1:

3 Likes