Welcome to the support center for

Fancy Product Designer & Multistep Product Configurator


Doyle interface improvement on mobile


it would be good to have some improvement on Doyle interface on mobile, because generally it is very good but there are some room for improvement.

1. The DONE button in the header may overlap some function icons/buttons

2. According to main function buttons in the lower bar, there are 3 problems
2.1. If there are more icons/buttons in the lower bar then 4, the other buttons are out of the screen and there is NO any icon/sign telling the user that "you can swap the icon row left and right.

2.2. When I choose an element on the canvas, the lower bar changing to a function bar according to what element it is. I need an icon/sign for left-right swapping as well. And I think the Delete function should be the first ion the row not last because if the user don't recognize the swapping function of the function bar, he can't delete the actual object.

In this interface there is a CLOSE function on the bar, it is OK but it may has more accent.

2.3. But the main problem is with the main bar closing. It has a tap-open , tap-close  working method now, but for closing a function there was another method using the closing icon on the interface. So if I want to close an element function bar, I have a close icon, but if I want to close a full screen main module bar, now I have to tap on the icon/button again, there is NO any close icon on the interface. And if I tap on another module icon, the full screen content changing according to the choosen module, but no any close function.

This interface works well if the user knows how the interface works. But starters non- experienced users may get lost in questions for example how to close this function or how to delete this element.

7 people like this idea

Hello devs any news on this request?

Added close button for mobile version.

Thank you for answering us, how can I activate? I did the update but I can't find the option.

The close button is visible by default.


For everyone who does not use the default ui-l-c - The button does not exist or is only visible when the FPD is directly on the page.

Just add this CSS in the UI layout composer CSS (or CSS global).

top: 0px !Important;
z-index: 100000 !Important;
box-shadow: 1px 1px 4px 1px rgb(0 0 0 / 20%);

Then the button is also visible. 



Thanks Nils, send your CV to the radi kal team they need someone like you!

Login or Signup to post a comment