Improve readme (#39)

* improve the readme

* move docs readme

* add citation

* more detailed bib

* Update CITATIONS.bib

Co-authored-by: Juniper Tyree <[email protected]>

* add video link to readme

---------

Co-authored-by: Juniper Tyree <[email protected]>

CITATIONS.bib

@@ -0,0 +1,14 @@
+@misc{tanaka2023xiplot,
+  title         = {$\chi$iplot: Web-First Visualisation Platform for Multidimensional Data},
+  shorttitle    = {$\chi$iplot},
+  author        = {Tanaka, Akihiro and Tyree, Juniper and Bj{\"o}rklund, Anton and M{\"a}kel{\"a}, Jarmo and Puolam{\"a}ki, Kai},
+  year          = {2023},
+  month         = {06},
+  number        = {arXiv:2306.12110},
+  eprint        = {2306.12110},
+  archiveprefix = {arXiv},
+  primaryclass  = {cs.HC}
+  publisher     = {{arXiv}},
+  doi           = {10.48550/arXiv.2306.12110},
+  url           = {http://arxiv.org/abs/2306.12110}
+}

README.md

@@ -6,13 +6,21 @@
 
 ## Description
 
-χiplot is built on top of the [`dash`](https://github.com/plotly/dash) framework with its various extensions (see the [requirements.txt](requirements.txt) file). The goal of the χiplot is to explore new insights from the collected data and to make data exploring user-friendly and intuitive.
+χiplot is built on top of the [`dash`](https://github.com/plotly/dash) framework. The goal of the χiplot is to explore new insights from the collected data and to make data exploring user-friendly and intuitive.
 
-χiplot can be executed in server version or WASM-based browser version. 
+χiplot can be run as a local server or as a [WASM-based browser version](https://edahelsinki.fi/xiplot). 
+
+You can find more details in the [user guide](docs/user_guide) and [the paper](https://arxiv.org/abs/2306.12110).
+For a quick demonstration see [the video](https://helsinkifi-my.sharepoint.com/:v:/g/personal/tanakaki_ad_helsinki_fi/EcIIGy0bfP5FlW-0Lr4AMEYBbKoyuo6u7px3zu_K5Vk4xw?e=TPGGf8&nav=eyJyZWZlcnJhbEluZm8iOnsicmVmZXJyYWxBcHAiOiJTdHJlYW1XZWJBcHAiLCJyZWZlcnJhbFZpZXciOiJTaGFyZURpYWxvZyIsInJlZmVycmFsQXBwUGxhdGZvcm0iOiJXZWIiLCJyZWZlcnJhbE1vZGUiOiJ2aWV3In19) or try the [WASM version](https://edahelsinki.fi/xiplot).
+
+## Screenshot
+
+![Screenshot of xiplot](docs/images/cluster_by_drawing.png#gh-light-mode-only)
+![Screenshot of xiplot](docs/images/dark_mode.png#gh-dark-mode-only)
 
 ## Dependencies
 
-Install the depencies by running `pip install -r requirements.txt`
+Install the dependencies by running `pip install -r requirements.txt`
 
 ## Execution
 
@@ -22,11 +30,7 @@ Run `python3 -m xiplot` at the root directory.
 
 ### Serverless WASM version
 
-You can try out the serverless WASM version of χiplot at [www.edahelsinki.fi/xiplot](https://www.edahelsinki.fi/xiplot). Please refer to the [wasm](https://github.com/edahelsinki/xiplot/tree/wasm#readme) branch for more information on how the WASM version is implemented.
-
-## User guide
-
-You can find the user guide [here](docs/user_guide).
+You can try out the serverless WASM version of χiplot at [edahelsinki.fi/xiplot](https://edahelsinki.fi/xiplot). Please refer to the [wasm](https://github.com/edahelsinki/xiplot/tree/wasm#readme) branch for more information on how the WASM version is implemented.
 
 ## Funding
 

docs/README.md

@@ -1,4 +1,23 @@
-This directory has following directories/files:
+# User guide
 
- - images directory, which has images used in documents
- - user_guide directory, which has a user guide for χiplot
+This is a user guide that has a documentation of features of the χiplot.
+By reading this user guide, users can have a better understanding of things that are possible to do in χiplot.
+
+## Data files
+
+In [data_files.md](user_guide/data_files.md), you can find how to load example data files, upload your own data files and download the data files and save the plots and cluster
+information into your device.
+
+In addition, you can find the format that is used to save the plots and data into a `.tar` file.
+
+## Plots
+
+In [plots.md](user_guide/plots.md), you can find how the plots are connected with each other and how to interact with them.
+
+## Clustering
+
+In [clustering.md](user_guide/clustering.md), you can find how to create clusters in χiplot.
+
+## Plugin
+
+In [plugin.md](user_guide/plugin.md), you can learn how to create plugins for χiplot.