Hello all, I would like to share an idea for feedback and discussion.
As part of modernizing the manufacturing component within OFBiz by building the application headless and making services API-driven, I have also started building a front-end for manufacturing that can run effectively on mobile devices, tablets, and desktops. For this work, I considered using the Ionic framework with Vue to create a progressive web application that can serve enterprise users across multiple form factors. While working through the design and implementation process, I identified an opportunity to make enterprise UI development more consistent, reusable, and accessible for the wider community. In many projects, UI design and front-end implementation are still approached as isolated efforts, which often leads to duplication, inconsistent patterns, and a steeper learning curve for contributors. To help address this, I started using a shared set of open-source assets that can support both design and development: 1. The Ionic 8 Material UI Kit in Figma https://www.figma.com/community/file/885791511781717756/ionic-8-material-ui-kit-community This open-source enterprise UI Kit already provides prebuilt Ionic components and enterprise-oriented UI patterns. It makes it much easier to design new application screens using established building blocks rather than starting from a blank canvas every time. 2. The HotWax Commerce open-source PWA applications https://github.com/hotwax Public applications listed here provide real, working Ionic/Vue implementation examples for enterprise workflows such as receiving, cycle count, fulfillment, and related operational use cases. Together, these two open-source resources create a practical bridge from design to implementation: the Ionic 8 Material UI Kit helps teams design enterprise screens using proven Ionic patterns, and the HotWax Commerce PWA apps show how those designs can be translated into real Ionic/Vue code. My proposal is that the OFBiz community consider adopting these resources as a shared design-and-development reference base for modern enterprise applications. The benefits would be significant: - Designers could create new enterprise UI in Figma using established Ionic component patterns. - Developers could implement those designs using proven Ionic/Vue coding patterns from real open-source applications. - As we build more UI for other components, the community could benefit from more consistent UI, code structure, and a lower barrier to building polished enterprise PWAs. This is especially relevant as OFBiz continues evolving toward headless and API-based architectures. If services are exposed cleanly and can be consumed as APIs, then the front-end becomes an equally important part of the user experience. Having a shared design and implementation system for enterprise PWAs can help us build modern applications on top of OFBiz APIs in a way that feels coherent and maintainable. To support this direction, I have started creating a first draft of skills for AI coding agents that can: - design enterprise UI in Figma using established Ionic patterns - interpret Figma designs and generate Ionic/Vue code from them - apply reusable coding patterns from open-source enterprise PWA applications - help ensure consistency in both UI design and front-end implementation The initial draft is here: https://github.com/diveshdut/enterprise-ui-ionic-vue-skills I am currently testing these skills while working on a manufacturing PWA application. If the community finds this approach useful, I would be interested in contributing it more broadly back to OFBiz, potentially as a plugin or shared resource for designing and implementing enterprise UI applications. One of the biggest benefits of using these skills is that contributors without formal design backgrounds or front-end coding experience (like me) , could still produce predictable and usable enterprise UI (both design and code) with the help of coding agents. I would appreciate feedback on the following questions: - Would the community find value in standardizing on the Ionic 8 Material UI Kit for Figma-based enterprise UI design? - Would a shared enterprise Ionic/Vue code pattern be useful for OFBiz contributors? - Would there be interest in turning this into a shared community resource or plugin for enterprise UI design and development? If there is interest, I am happy to share examples and details. Thanks -- Divesh Dutta www.hotwaxsystems.com
