TouchUI Dialog Designer

The translation of UX-specific requirements into technical requirements often poses a challenge for many teams in their daily work. Too little attention is often paid to the importance of a good user experience for the editorial maintenance of content. In many projects we observed that this leads to poorly or incorrectly implemented web components.

To solve this issue, we created a SPA that is hosted inside AEM which utilizes drag and drop of Coral-UI form components. That enables quick mockup and creation of AEMEditor dialogs.

The tool is designed to be easily used by the client in cooperation with an UX designer to create a visual preview of the AEM-Editor dialogs and later easily export it for developers.

That's helping us to make exact specifications about which content to maintain for a component and at the same time we ensure that the dialog is done with a good user experience in mind.

How we've developed and implemented this SPA within AEM and why it helps developers to focus on the actual development instead of the tedious task of dialog creation, that’s what we want to showcase.