Add Why and Demo sections to README

vovacodes · Apr 1, 2021 · 23a4e7e · 23a4e7e
1 parent a00be6b
commit 23a4e7e
Showing 1 changed file with 30 additions and 1 deletion.
diff --git a/packages/react-sunbeam/README.md b/packages/react-sunbeam/README.md
@@ -1,6 +1,6 @@
 <div align="center">
 <div align="center"><img src="./logo.svg" width="170" height="170" alt="Sunbeam Logo"/></div>
-<h1 align="center">react-sunbeam</h1>
+<h1 align="center">React Sunbeam</h1>
 <p>
     Spatial navigation and key press management solution for React apps
 </p>
@@ -23,6 +23,35 @@ or
 yarn add react-sunbeam
 ```
 
+## Why
+
+React Sunbeam provides a flexible and easy-to-use solution for spacial navigation and focus management.
+There is wide variety of applications that can benefit from it.
+
+### TV and Gaming Console Apps
+
+Most of the applications that are running on leanback devices and controlled with a remote or gaming controller need an implementation of directional navigation.
+A lot of companies end up rolling out their own custom solutions for that.
+Usually those solutions are either very simple, like using column and row indices, or implementing spatial navigation which works much better for the end user but is tricky to implement correctly and hard to maintain.
+React Sunbeam provides a well-tested, opensource implementation of spatial navigation that is easy to integrate into any existing React app.
+
+### Web Apps with Keyboard Navigation
+
+React Sunbeam can also be very useful in the regular web apps that want to add support for directional keyboard navigation and thus make this app more accessible to the keyboard-only users.
+Spreadsheets and tables, different kinds of dashboards etc, all can benefit from React Sunbeam.
+
+## Demo
+
+Try our [demos](https://sunbeam.vova.codes/#demo-selector) on the documentation website to see what kind of interactions you can build with React Sunbeam.
+
+### [Home Screen](https://sunbeam.vova.codes/console-ui)
+
+![demo_home_screen](https://user-images.githubusercontent.com/1524432/113286891-1577a880-92ed-11eb-9119-0d8d4a781180.gif)
+
+### [Setting Menu](https://sunbeam.vova.codes/settings-menu)
+
+![demo_setting_menu](https://user-images.githubusercontent.com/1524432/113286880-114b8b00-92ed-11eb-983f-a2a9086a2042.gif)
+
 ## Usage
 
 ```js