Add instructions to try out Web UI

diff --git a/ui/web/README.md b/ui/web/README.md
index 1293c310d1fd3e13d8449f1044214e8ff809dbbd..aeb13d97447f41a09d60b2997c3474f0fa2e1ef3 100644 (file)
--- a/ui/web/README.md
+++ b/ui/web/README.md
@@ -25,8 +25,6 @@ See [here](../../README.md#charging-stations-simulator-configuration) for more d
 
 ### Run
 
-For both solution you can then follow the link displayed in the terminal at the end of compilation
-
 #### Compiles and run for production
 
 ```shell
@@ -38,6 +36,14 @@ npm start
 ```shell
 npm run serve
 ```
+#### Try it out
+
+For both options above you can then follow the link displayed in the terminal at the end of compilation. The Web UI looks like the following
+
+![webui](./assets/webui.png)
+
+1. With the top 2 buttons you can now stop and afterwards start the simulator and inspect the server console for the number of charging stations, e.g. with the default configuration: `Charging stations simulator ... started with 10 charging station(s)`
+2. Each charging station is a row in the table below, try "Stop Charging Station" and refresh with the large blue button and see the status Started turns from Yes into No.
 
 ### Compiles and minifies for production