mirror of
https://github.com/home-assistant/home-assistant.io.git
synced 2025-07-21 16:27:19 +00:00
edits
This commit is contained in:
parent
b5868d884c
commit
a4dcc136b3
@ -13,34 +13,37 @@ og_image: /images/blog/2019-01-release-86/components.png
|
||||
|
||||
Today we're happy to announce that our new Lovelace UI, which has been in beta for the last 8 months, is becoming the new default interface of Home Assistant. With Lovelace we're taking a new approach to building user interfaces for Home Assistant. We're no longer storing the look and feel of your UI in your configuration.yaml, requiring restarts for changes. With Lovelace we're keeping the UI concerns in the UI<sup>1</sup>, unlocking a whole new set of features:
|
||||
|
||||
- A configuration UI to manage your Lovelace UI including live preview when editing cards.
|
||||
- Full support for custom cards.
|
||||
- UI Editor. A configuration UI to manage your Lovelace UI including live preview when editing cards.
|
||||
- Fast. Using a static config allows us to build up the UI once.
|
||||
- Customizable. Each card has many options to configure how it shows it's data. Change themes on a per card basis or override the name or icon of an entity.
|
||||
- Customizable.
|
||||
- Cards have numerous options to configure how your data is presented.
|
||||
- Themes; even at a per card basis.
|
||||
- Ability to override names and icons of entities.
|
||||
- Custom Cards from our amazing community are fully supported.
|
||||
|
||||
In case you're reading this and want to give it a try right now: we've updated [the Home Assistant demo](https://demo.home-assistant.io). It now features multiple Lovelace configuration examples. The demo is fully interactive, including the configuration UI (accessible via the menu in the top right).
|
||||
|
||||
TODO - rephrase: Interview with Zac about the Lovelace release on the Home Assistant Podcast: https://hasspodcast.io/ha042 .
|
||||
|
||||
<sup>1</sup>: If you prefer YAML, Lovelace also includes a [YAML mode](/lovelace/yaml-mode/).
|
||||
<sup>1</sup>: If you prefer YAML, Lovelace also includes a [YAML mode](/lovelace/yaml-mode/) that supports the use of `!include` and `!secret`.
|
||||
|
||||
## {% linkable_title History %}
|
||||
|
||||
With Lovelace we've build a foundation that improves things bigly today, but will also allow us add many new exciting features in the future. The main difference with the old UI is that we no longer store any UI concerns in the state machine.
|
||||
With Lovelace we've built a foundation that not only provides a lean and sleek interface, but will also allow us to add many new exciting features in the future. The main difference with the old UI is that we no longer store any UI concerns in the state machine.
|
||||
|
||||
When Home Assistant was started, I came up with an algorithm that would automatically organize the available entities in badges, cards and tabs and show that on the screen. Users demanded more influence so over time, we've added a bunch of components and features who'se main or sole purpose is to influence how the algorithm shows and organizes the UI.
|
||||
When Home Assistant was started, I came up with an algorithm that would automatically organize the available entities in badges, cards and tabs; and then show that on the screen. Users demanded more influence; so over time, we've added a bunch of components and features who'se main or sole purpose were to influence how the algorithm shows and organizes the UI.
|
||||
|
||||
As this kept growing, I realized that we made a mistake: the backend shouldn't be aware of anything in the frontend. It should just deliver the entities and the frontend should figure it out together with the user.
|
||||
As this kept growing, I realized that we had made a mistake: the backend shouldn't be aware of anything in the frontend. It should just deliver the entities and the frontend should figure out how to display things together with the user.
|
||||
|
||||
At the same time as this was happening, we've also had some discussions in the frontend. Users wanted more control on what is shown, when it's shown and how it's shown. Eventually, [@andrey-git] came up with Custom UI for the old interface. This allowed users to do whatever we want.
|
||||
At the same time as this was happening, we also had some discussions about the development of the frontend. Users wanted more control on what is shown, when it's shown and how it's shown. Eventually, [@andrey-git] came up with Custom UI for the old interface. This allowed users to do whatever they wanted.
|
||||
|
||||
Lovelace was built [from the start](https://github.com/home-assistant/architecture/issues/14) to tackle these problems. The inital version completely dropped the algorithm and required users to add each card to their configuration. We went from full automatic UI to nothing. We launched it under the nomer "experimental UI" and it quickly gained traction. People loved the control and the ability to inject custom cards or entity rows at will.
|
||||
Lovelace was built [from the start](https://github.com/home-assistant/architecture/issues/14) to tackle these problems. The inital version completely dropped the algorithm and required users to add each card to their configuration. We went from afully automatic UI to nothing. We launched it under the nomer "experimental UI" and it quickly gained traction. People loved the control and the ability to inject custom cards or entity rows at will.
|
||||
|
||||
The enthusiasm was great among our power users, however by going to no automatic UI, we were no longer beginner friendly. A new user would open Home Assistant and it would see a blank, unconfigured UI. This had to be solved or else we would not be able to retain any new users.
|
||||
The enthusiasm was great among our power users, however switching away from an automatic UI, we were no longer beginner-friendly. A new user would open Home Assistant and they would see a blank, unconfigured UI. This had to be solved or else we would not be able to retain any new users.
|
||||
|
||||
To make the Lovelace UI beginner friendly again, we actually re-introduced our automatic algorithm. However, this time the algorithm will generate a Lovelace configuration. However, this time, if the user no longer agrees with the algorithm, they can take control. By taking control, we'll copy the automatically generated configuration and store it for the user. Now the user is in control and can make any change that it wants.
|
||||
To make the Lovelace UI beginner-friendly again, we actually re-introduced our automatic algorithm. However, this time the algorithm generates a Lovelace configuration that matches existing entities/groups to our core cards. And if a user doesn't like the automatic configuration, they can take control and configure it to their liking.
|
||||
|
||||
To make configuration as easy as possible, Lovelace UI allows (custom) cards to include a config editor. This way the user will be able to quickly edit a card while a live preview shows how the changes look. If a card does not include an editor, the user will be presented with a YAML editor in the browser.
|
||||
To make configuration as easy as possible, Lovelace UI allows (custom) cards to include a config editor. This way the user will be able to quickly edit a card while a live preview shows how the changes look. If a card does not include an editor (yet), the user will be presented with a YAML editor in the browser.
|
||||
|
||||
Because of the ease to customize and share customizations, we've already seen a big community be created around Lovelace. They are very active in the #lovelace channel on [our chat](/join-chat/), and work is shared on [ShareTheLove.io](https://sharethelove.io/) and the [Lovelace section on Awesome HA](https://www.awesome-ha.com/#lovelace-ui).
|
||||
|
||||
@ -52,7 +55,7 @@ Lovelace UI has been 8 months in the making and it has been a big undertaking. W
|
||||
- [@bramkragten] / Bram Kragten
|
||||
- [@c727]
|
||||
- [@ciotlosm]
|
||||
- [@iantrich]
|
||||
- [@iantrich] / Ian Richardson
|
||||
- [@jeradM]
|
||||
- [@thomasloven]
|
||||
- [@zsarnett]
|
||||
|
Loading…
x
Reference in New Issue
Block a user