From 08802ac32f6ea72cb9c9300c1bdf04b5d1f66f53 Mon Sep 17 00:00:00 2001
From: Euryn <crossdeltavi@gmail.com>
Date: Mon, 22 Jan 2024 01:50:04 +0100
Subject: [PATCH] renamed second section

---
 docs/02-getting-started.md | 22 ----------------------
 docs/02-quick-start.md     | 36 ++++++++++++++++++++++++++++++++++++
 2 files changed, 36 insertions(+), 22 deletions(-)
 delete mode 100644 docs/02-getting-started.md
 create mode 100644 docs/02-quick-start.md

diff --git a/docs/02-getting-started.md b/docs/02-getting-started.md
deleted file mode 100644
index 3b61aec..0000000
--- a/docs/02-getting-started.md
+++ /dev/null
@@ -1,22 +0,0 @@
-# Getting started
-
-Visit [https://eurydia.github.io/project-nassi-shneiderman-diagram-builder-online/](https://eurydia.github.io/project-nassi-shneiderman-diagram-builder-online/) for the live editor.
-
-## Hello World
-
-Clicking on the "SHOW CODE" or "HIDE CODE" button will bring up or and put away the code editor.
-With the editor opened, type:
-
-```plaintext
-Hello World;
-```
-
-<iframe width="100%" style="aspect-ratio: 16/9; border:none;" loading="lazy" src="https://eurydia.github.io/project-nassi-shneiderman-diagram-builder-online/?preview=true&content="></iframe>
-
-You should see a diagram with "Hello World."
-Depending on the size of your device, you might need to click the "HIDE CODE" button to bring up the preview.
-
-## Export
-
-There are three export format available; PNG, SVG, and JPEG.
-Clicking on the "SHARE" button will copy a shareable link to your clipboard.
diff --git a/docs/02-quick-start.md b/docs/02-quick-start.md
new file mode 100644
index 0000000..71e1977
--- /dev/null
+++ b/docs/02-quick-start.md
@@ -0,0 +1,36 @@
+# Quick start
+
+## 1. Getting started
+
+To embark on your [Nassi–Shneiderman diagramming](https://en.wikipedia.org/wiki/Nassi%E2%80%93Shneiderman_diagram) journey, head over to the live editor at [https://eurydia.github.io/project-nassi-shneiderman-diagram-builder-online/](https://eurydia.github.io/project-nassi-shneiderman-diagram-builder-online/).
+
+## 2. Interface overview
+
+The editor presents two fundamental components:
+
+- **Code Editor**: This is where the magic happens. A piece of code written here will be interpreted and transformed into a diagram.
+- **Live Preview**: The resulting diagrams are displayed here in real-time.
+
+## 3. Hello World
+
+For those using smaller screens like smartphones or tablets, the code editor might be tucked away initially.
+If you find it hidden, simply tap on the "SHOW CODE" button to reveal it.
+
+Now, let's create a simple diagram.
+
+In the code editor, type Hello World;
+The project should generate the corresponding diagram:
+
+<iframe width="100%" style="aspect-ratio: 16/10; border:none;" loading="lazy" src="https://eurydia.github.io/project-nassi-shneiderman-diagram-builder-online/?preview=true&content=Hello+World%3B"></iframe>
+
+## 4. Export
+
+Once you are satisfied with the diagram, you can use the export feature to save your diagram in three different file formats: PNG, JPEG, and SVG.
+
+Moreover, sharing is made seamless with the ability to generate a unique link for your diagram.
+
+## 5. Advanced syntax
+
+As you grow more comfortable with the basics, delve into advanced features.
+Experiment with different diagram structures; loops, branches, and functions.
+The editor adapts to your coding style, offering a dynamic representation of diverse programming constructs.