diff --git a/source/_posts/2024-03-06-release-20243.markdown b/source/_posts/2024-03-06-release-20243.markdown index 25cab4febf8..d424091454f 100644 --- a/source/_posts/2024-03-06-release-20243.markdown +++ b/source/_posts/2024-03-06-release-20243.markdown @@ -48,8 +48,8 @@ Enjoy the (beta) release! -- [Dashboard sections view](#dashboard-sections-view) -- [Dungeons and Dragons](#dungeons-and-dragons) +- [A new experimental sections view](#a-new-experimental-sections-view) +- [Drag-and-drop rearrangement of cards and sections!](#drag-and-drop-rearrangement-of-cards-and-sections) - [Running script from your dashboard with user input](#running-script-from-your-dashboard-with-user-input) - [New energy graph for individual devices](#new-energy-graph-for-individual-devices) - [New sentences for Assist](#new-sentences-for-assist) @@ -68,15 +68,107 @@ Don't forget to [join our release party live stream on YouTube](https://www.yout -## Dashboard sections view +## A new experimental sections view -A brand new, experimental, view has been added this release: Sections! +Our dashboard currently comes with three view layout types: +[Panel](/dashboards/panel/), [Sidebar](/dashboards/sidebar/), +and [Masonry](/dashboards/masonry/). Since the past year, we have been working +hard to research and ideate on how to make dashboards easier to customize +and use, and we learned that our current layouts are not the best for such +purposes. Drag-and-drop rearrangement of cards cannot work well with the +Masonry layout. -Temporary image that needs replacement. +We came up with a few solutions, and the first thing we would like to share +with you is a new view layout type called "Sections". -## Dungeons and Dragons +Home Assistant dashboards are robust and packed with information. Users will +often place dozens of cards for all sorts of buttons, switches, graphs, +indicators, and more. -Lorem ipsum +

+ Example of a dashboard section + Example of a dashboard section +

+ +By grouping cards into “sections”, you can reduce the number of items you +need to scan through when you are looking for a certain card, as you'll be +able to look for the relevant group title first and then reduce the scope to +scan that particular group for the information. + +By packing cards in a section into a grid with a fixed number of columns, +the relative positions of the cards within a section are not affected by +changes in screen sizes, and so the spatial memory of the cards is retained, +leading to a faster and less cumbersome experience. + +

+ A fully populated dashboard in Sections view layout + A fully populated dashboard in the Sections view layout +

+ +Cards in the new sections view type are all aligned in a tidy grid to ensure +consistency and predictability of their positions when the screen size changes. +We currently have three cards reworked to fit the grid: +[Tile](/dashboards/tile/), [Sensor](/dashboards/sensor/), +and [Button](/dashboards/button/) cards. These cards will occupy the right +amount of space in the grid, while other cards will occupy the full width +of a section by default at the moment. Moreover, we have tweaked our +"Add Cards" dialogs to recommend Tile cards by default when the sections +view type is in use. + +
+ The new Sections view is experimental! Please do not build your daily dashboard on top of it yet! We are releasing this early so that we can collect your feedback. +
+ +To get started with the new Sections view type, create a new view on your +dashboard and select **Sections (experimental)** as the view type. +We currently do not have the option to migrate your current dashboard over yet. + +For more information, check out our blog post about our new +series [A Home-Approved Dashboard: Chapter 1](/blog/2024/03/04/dashboard-chapter-1/). + +Amazing work! Thanks [Paul](https://github.com/piitaya), +[Matthias](https://github.com/matthiasdebaat), +and [Madelena](https://github.com/madelena)! + +## Drag-and-drop rearrangement of cards and sections! + +Wow! At long last!! The stars have aligned, and our experimental drag-and-drop +feature for dashboards is finally here! 🥲 + +With the new sections view type, we can finally implement a way to arrange +cards and sections that is intuitive with drag-and-drop gestures and predictable +with how the cards will rearrange while creating a dashboard that is easy to +navigate and remember. You will no longer need to pray and guess where the cards +will land when they change their orders! + +### How to drag and drop + +While your dashboard is in edit mode: + +

+ Rearranging sections with drag-and-drop + Rearranging sections with drag-and-drop +

+ +- To rearrange sections, tap and hold the + Edit icon + **Move** handle and then move your cursor or finger towards your desired + location. Other sections will move out of the way for where the selected + section will drop. + +

+ Rearranging cards with drag-and-drop + Rearranging sections with drag-and-drop +

+ +- To rearrange cards, tap and hold anywhere on the card and then move your + cursor or finger towards your desired location. + +Don’t you love it when instructions are so short? Simplicity FTW! 🦄 + +Thanks again [Paul](https://github.com/piitaya), +[Matthias](https://github.com/matthiasdebaat), +and [Madelena](https://github.com/madelena)! ## Running script from your dashboard with user input