Uploaded March 2025 | Updated September 2026, 1 week ago

---

#ShinyConf #ShinyConf2024

Abstract: The Shiny comunity put a lot of effort to enhance the way we build User Interfaces (UIs) for our Shiny Dashboards. Some important packages include imola, gridLayout, and shinyUIEditor. Here, I propose a method that I have been using in recent years for constructing all the User Interfaces I create. The method is based on the {imola} package and pure CSS concepts.

The method consists of three steps:

First: ("App Grid Design") - defining rows/columns and responsiveness for the app (Notebooks and Desktops). Here, there is no concern for the aesthetic aspect of the app.

Second: Widgets and outputs for charts/tables are added to the code (ui.code). Here I start to use pure CSS.

Third: Finally, considering a sample of the data, the charts are constructed, and the App UI is finalized (using pure CSS). Here, I use CSS to wrap up the final touches, dealing with the aesthetic aspects, responsiveness, and alignment of the UI elements.

____________________________

Join us this year! Sign up for ShinyConf 2025 here: go.appsilon.com/register-shinyconf2025