Repository: AY2425S2-CS2103T-F10-3/tp
Pull request #95: Update User Guide (Jake's end)
Author: login: iamanoob44
Labels: name: priority.High
description: Must do
Created: 2025-03-24T18:26:29Z | Merged: 2025-03-25T13:32:15Z

Refine the format and structure of User Guide, as well as also updates the images that were used in the User Guide accordingly.

fix #94 

Linked issue #94: Update User Guide (Jake's end)
Update user guide by updating the images, as well as refining the format

Diff:
diff --git a/docs/UserGuide.md b/docs/UserGuide.md
index 9c77511271a..f2e825c3eae 100644
--- a/docs/UserGuide.md
+++ b/docs/UserGuide.md
@@ -9,42 +9,56 @@
 CollabSync is a **desktop app for managing contacts, optimized for use via a  Line Interface** (CLI) while still having the benefits of a Graphical User Interface (GUI). If you can type fast, CollabSync can get your contact management tasks done faster than traditional GUI apps.
 
 <!-- * Table of Contents -->
-<page-nav-print />
+## Quick Search
+1. [Quick Start](#Quick-start)
+2. [Features](#features)
+   - [Help](#feature-1--help)
+   - [Adding a person](#feature-2--add)
+   - [Listing all persons](#feature-3--list)
+   - [Editing a person](#feature-4--edit)
+   - [Finding persons by name](#feature-5--find)
+   - [Deleting a person](#feature-6--delete)
+   - [Clearing all entries](#feature-7--clear)
+   - [Data Management](#feature-8--data-management)
+   - [Exit](#feature-9--exit)
+3. [FAQ](#faq)
+4. [Known Issues](#Known-Issues)
+5. [Command Summary](#Command-Summary)
 
 --------------------------------------------------------------------------------------------------------------------
 
 ## Quick start
 
 1. Ensure you have Java `17` or above installed in your Computer.<br>
-   To check, click [here](#FAQ).<br>
-   **Mac users:** Ensure you have the precise JDK version prescribed [here](https://se-education.org/guides/tutorials/javaInstallationMac.html).
+   1.a. To check, click [here](#FAQ).<br>
+   1.b. **Mac users:** Ensure you have the precise JDK version prescribed [here](https://se-education.org/guides/tutorials/javaInstallationMac.html).
 
-1. Download the latest `.jar` file from [here](https://github.com/AY2425S2-CS2103T-F10-3/tp/releases/tag/v1.3).
+2. Download the latest `.jar` file from [here](https://github.com/AY2425S2-CS2103T-F10-3/tp/releases/tag/v1.3).
 
-1. Copy the file to the folder you want to use as the _home folder_ for your CollabSync.
+3. Copy the file to the folder you want to use as the _home folder_ for your CollabSync. Click [here](#additional-guides-for-setup) if you wish to see a pictorial illustration.
 
-1. Open a command terminal, `cd` into the folder you put the jar file in, and use the `java -jar CollabSync.jar` command to run the application.<br>
+4. Open a command terminal, `cd` into the folder you put the jar file in, and use the `java -jar CollabSync.jar` command to run the application.<br>
    A GUI similar to the below should appear in a few seconds. Note how the app contains some sample data.<br>
    ![Ui](images/Ui.png)
 
-1. Type the command in the command box and press Enter to execute it. e.g. typing **`help`** and pressing Enter will open the help window.<br>
+5. Type the command in the command box and press Enter to execute it. e.g. typing **`help`** and pressing Enter will open the help window.<br>
    Some example commands you can try:
 
-   * `list` : Lists all contacts.
+    * `list` : Lists all contacts.
 
-   * `add n/John Doe p/98765432 e/johnd@example.com a/John street, block 123, #01-01 y/2024` : Adds a contact named `John Doe` to the Address Book.
+    * `add n/John Doe p/98765432 e/johnd@example.com a/John street, block 123, #01-01 y/2024` : Adds a contact named `John Doe` to the Address Book.
 
-   * `delete 3` : Deletes the 3rd contact shown in the current list.
+    * `delete 3` : Deletes the 3rd contact shown in the current list.
 
-   * `clear` : Deletes all contacts.
+    * `clear` : Deletes all contacts.
 
-   * `exit` : Exits the app.
+    * `exit` : Exits the app.
 
-1. Refer to the [Features](#features) below for details of each command.
+6. Refer to the [Features](#features) below for details of each command.
 
 --------------------------------------------------------------------------------------------------------------------
 
-## Features
+# Features
 
 <box type="info" seamless>
 
@@ -66,61 +80,71 @@ CollabSync is a **desktop app for managing contacts, optimized for use via a  Li
   e.g. if the command specifies `help 123`, it will be interpreted as `help`.
 
 * If you are using a PDF version of this document, be careful when copying and pasting commands that span multiple lines as space characters surrounding line-breaks may be omitted when copied over to the application.
-</box>
+  </box>
 
-### Viewing help : `help`
+-----------------------------------------------------------------------------------------------------------------------
 
-Shows a help window with the basic commands needed for basic usage of CollabSync. <br>
-Also contains a message explaining how to access the help page.
+# Feature #1 : `help`
+## `help` : Shows a help window
+### Format: `help`
 
-![help message](images/helpMessage.png)
+* Shows a help window with the basic commands needed for basic usage of CollabSync. <br>
+* Also contains a message explaining how to access the help page.
 
-Format: `help`
+
+![help message](images/helpMessage.png)
 
 
-### Adding a person: `add`
 
-Adds a person to the address book.
+-----------------------------------------------------------------------------------------------------------------------
 
-Format: `add n/NAME p/PHONE_NUMBER e/EMAIL a/ADDRESS y/YEARNUMBER [t/TAG]…​`
+# Feature #2 : `add`
+## `add` : Adds a person to the address book.
+### Format: `add n/NAME p/PHONE_NUMBER e/EMAIL a/ADDRESS y/YEARNUMBER [t/TAG]…​`
 
 <box type="tip" seamless>
 
-**Tip:** A person can have any number of tags (including 0)
+**Tip:** A person can have any number of tags (You can choose to omit tags)
 </box>
 
-Examples:
+### Examples:
 * `add n/John Doe p/98765432 e/johnd@example.com a/John street, block 123, #01-01 y/2022 t/CS2103T`
 * `add n/Betsy Crowe t/CS2100 e/betsycrowe@example.com a/Newgate Prison p/1234567 y/2023 t/MA1521`
 
-### Listing all persons : `list`
+-----------------------------------------------------------------------------------------------------------------------
 
-Shows a list of all persons in the address book.
+# Feature #3 : `list`
+## `list` : Shows a list of all persons in the address book.
+### Format: `list`
 
-Format: `list`
+<box type="note" seamless>
+
+**Note:** You do not need to enter anything else behind `list`
+</box>
 
-### Editing a person : `edit`
 
-Edits an existing person in the address book.
+-----------------------------------------------------------------------------------------------------------------------
 
-Format: `edit INDEX [n/NAME] [p/PHONE] [e/EMAIL] [a/ADDRESS] [y/YEARNUMBER] [t/TAG]…​`
+# Feature #4 : `edit`
+## `edit` : Edits an existing person in the address book.
+### Format: `edit INDEX [n/NAME] [p/PHONE] [e/EMAIL] [a/ADDRESS] [y/YEARNUMBER] [t/TAG]…​`
 
 * Edits the person at the specified `INDEX`. The index refers to the index number shown in the displayed person list. The index **must be a positive integer** 1, 2, 3, …​
 * At least one of the optional fields must be provided.
 * Existing values will be updated to the input values.
 * When editing tags, the existing tags of the person will be removed i.e adding of tags is not cumulative.
 * You can remove all the person’s tags by typing `t/` without
-    specifying any tags after it.
+  specifying any tags after it.
 
-Examples:
+### Examples:
 *  `edit 1 p/91234567 e/johndoe@example.com` Edits the phone number and email address of the 1st person to be `91234567` and `johndoe@example.com` respectively.
 *  `edit 2 n/Betsy Crower t/` Edits the name of the 2nd person to be `Betsy Crower` and clears all existing tags.
 
-### Locating persons by name: `find`
+-----------------------------------------------------------------------------------------------------------------------
 
-Finds persons whose names contain any of the given keywords.
-
-Format: `find KEYWORD [MORE_KEYWORDS]`
+# Feature #5 : `find`
+## `find` : Finds persons whose names contain any of the given keywords.
+### Format: `find KEYWORD [MORE_KEYWORDS]`
 
 * The search is case-insensitive. e.g `hans` will match `Hans`
 * The order of the keywords does not matter. e.g. `Hans Bo` will match `Bo Hans`
@@ -130,50 +154,47 @@ Format: `find KEYWORD [MORE_KEYWORDS]`
   e.g. `Hans Bo` will return `Hans Gruber`, `Bo Yang`
 * The search can also search using other attributes, such as phone numbers and email addresses, to find a particular person.
 
-Examples:
+### Examples:
 * `find John` returns `john` and `John Doe`
 * `find alex david` returns `Alex Yeoh`, `David Li`<br>
   ![result for 'find alex david'](images/findAlexDavidResult.png)
 
-### Deleting a person : `delete`
-
-Deletes the specified person from the address book.
+-----------------------------------------------------------------------------------------------------------------------
 
-Format: `delete INDEX`
+# Feature #6 : `delete`
+## `delete` : Deletes the specified person from the address book.
+### Format: `delete INDEX`
 
 * Deletes the person at the specified `INDEX`.
 * The index refers to the index number shown in the displayed person list.
 * The index **must be a positive integer** 1, 2, 3, …​
 
-Examples:
+### Examples:
 * `list` followed by `delete 2` deletes the 2nd person in the address book.
 * `find Betsy` followed by `delete 1` deletes the 1st person in the results of the `find` command.
 
-### Clearing all entries : `clear`
+-----------------------------------------------------------------------------------------------------------------------
 
-Clears all entries from the address book.
+# Feature #7 : `clear`
+## `clear` : Clears all entries from the address book.
+### Format: `clear`
 
-Format: `clear`
+-----------------------------------------------------------------------------------------------------------------------
 
-### Exiting the program : `exit`
-
-Exits the program.
-
-Format: `exit`
+# Feature #8 : Data Management
 
 ### Saving the data
 
-CollabSync data are saved in the hard disk automatically after any command that changes the data. There is no need to save manually.
+* CollabSync data are saved in the hard disk automatically after any command that changes the data. There is no need to save manually.
 
 ### Editing the data file
 
-CollabSync data are saved automatically as a JSON file `[JAR file location]/data/addressbook.json`. Advanced users are welcome to update data directly by editing that data file.
+* CollabSync data are saved automatically as a JSON file `[JAR file location]/data/addressbook.json`. Advanced users are welcome to update data directly by editing that data file.
 
 <box type="warning" seamless>
 
-**Caution:**
-
-If your changes to the data file makes its format invalid, CollabSync will start with an empty data file at the next run. A warning prompt will also appear on your next CollabSync startup.
+## Caution
+* If your changes to the data file makes its format invalid, CollabSync will start with an empty data file at the next run. A warning prompt will also appear on your next CollabSync startup.
 
 <pic src="images/corruptedDataWarning.png">
     Example of warning prompt
@@ -185,6 +206,14 @@ Your existing data file will be automatically backed up at `/data/addressbook_ol
 Furthermore, certain edits can cause the CollabSync to behave in unexpected ways (e.g., if a value entered is outside the acceptable range). Therefore, edit the data file only if you are confident that you can update it correctly.
 </box>
 
+
+
+-----------------------------------------------------------------------------------------------------------------------
+
+# Feature #9 : `exit`
+## `exit` : Exits the program.
+### Format: `exit`
+
 --------------------------------------------------------------------------------------------------------------------
 
 ## FAQ
@@ -212,14 +241,47 @@ Furthermore, certain edits can cause the CollabSync to behave in unexpected ways
 
 --------------------------------------------------------------------------------------------------------------------
 
-## Command summary
-
-Action     | Format, Examples
------------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------
-**Add**    | `add n/NAME p/PHONE_NUMBER e/EMAIL a/ADDRESS [t/TAG]…​` <br> e.g., `add n/James Ho p/22224444 e/jamesho@example.com a/123, Clementi Rd, 1234665 t/friend t/colleague`
-**Clear**  | `clear`
-**Delete** | `delete INDEX`<br> e.g., `delete 3`
-**Edit**   | `edit INDEX [n/NAME] [p/PHONE_NUMBER] [e/EMAIL] [a/ADDRESS] [y/YEARNUMBER] [t/TAG]…​`<br> e.g.,`edit 2 n/James Lee e/jameslee@example.com`
-**Find**   | `find KEYWORD [MORE_KEYWORDS]`<br> e.g., `find James Jake tyrone@example.com`
-**List**   | `list`
-**Help**   | `help`
+## Command Summary
+
+### Command Summary
+| **Action** | **Format**                                                                              | **Examples**                                                                                       |
+|------------|------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------------------------|
+| **Add**    | `add n/NAME p/PHONE_NUMBER e/EMAIL a/ADDRESS [t/TAG]…​`                                  | `add n/James Ho p/22224444 e/jamesho@example.com a/123, Clementi Rd, 1234665 t/friend t/colleague` |
+| **Clear**  | `clear`                                                                                  | -                                                                                                  |
+| **Delete** | `delete INDEX`                                                                           | `delete 3`                                                                                         |
+| **Edit**   | `edit INDEX [n/NAME] [p/PHONE_NUMBER] [e/EMAIL] [a/ADDRESS] [y/YEARNUMBER] [t/TAG]…​`    | `edit 2 n/James Lee e/jameslee@example.com`                                                        |
+| **Find**   | `find KEYWORD [MORE_KEYWORDS]`                                                          | `find James Jake tyrone@example.com`                                                               |
+| **List**   | `list`                                                                                   | -                                                                                                  |
+| **Help**   | `help`                                                                                   | -                                                                                                  |
+| **Exit**   | `terminate and exit the program`                                                         | -                                                                                                  |
+
+
+
+--------------------------------------------------------------------------------------------------------------------
+# Miscellaneous information
+
+--------------------------------------------------------------------------------------------------------------------
+
+## Additional Guides for Setup
+
+1. Copy the file to the folder you want to use as the _home folder_ for your CollabSync.
+    * 1.a. _home folder_ used for this example is `AmazingProduct` , as seen from the image below.
+    * 1.b. `CollabSync.jar` is in the `AmazingProduct` folder, as seen from the image below too.
+
+![Guide_!](images/Guide_1.png)
+
+1. From the image above, move your cursor to the rectangular box and click it. For this example, the rectangular box contains `OneDrive > Teng .... > Desktop > AmazingProduct `
+
+
+2. Then, copy it. This would be the *`file path`* (the path to the `CollabSync.jar` file)
+
+
+3. You should see something similar, where the **file path** name is `C:\Users\tengc\OneDrive - National University of Singapore\Desktop\AmazingProduct` for this example.
+
+
+4. Open your command prompt, type `cd <file path copied from step 2>` into the folder you put the jar file in. For this example, we would type `cd C:\Users\tengc\OneDrive - National University of Singapore\Desktop\AmazingProduct`.
+   Then click `enter` for Window users or `return` for Mac users. Refer to the image below for your reference.
+
+
+5. Run `java -jar CollabSync.jar` on your command terminal. And that's it! You should be able to access the exciting features of CollabSync!
+![Guide_2](images/Guide_2.png)
diff --git a/docs/images/Guide_1.png b/docs/images/Guide_1.png
new file mode 100644
index 00000000000..d252a0335c2
Binary files /dev/null and b/docs/images/Guide_1.png differ
diff --git a/docs/images/Guide_2.png b/docs/images/Guide_2.png
new file mode 100644
index 00000000000..1ca746f7310
Binary files /dev/null and b/docs/images/Guide_2.png differ
diff --git a/docs/images/Ui.png b/docs/images/Ui.png
index 52a7afc4d6d..de5186d945b 100644
Binary files a/docs/images/Ui.png and b/docs/images/Ui.png differ
diff --git a/docs/images/findAlexDavidResult.png b/docs/images/findAlexDavidResult.png
index 649c67cdfde..a80dbbbe0ef 100644
Binary files a/docs/images/findAlexDavidResult.png and b/docs/images/findAlexDavidResult.png differ


Reviews:
user: login: pang-yy
body: LGTM!
state: COMMENTED
author_association: NONE
submitted_at: 2025-03-25T08:03:35Z
user: login: cyrolite
state: COMMENTED
author_association: NONE
submitted_at: 2025-03-25T10:51:45Z

Review comments:
diff_hunk: @@ -1,49 +1,58 @@
----
-  layout: default.md
-  title: "User Guide"
-  pageNav: 3
----
-
 # CollabSync User Guide
 
 CollabSync is a **desktop app for managing contacts, optimized for use via a  Line Interface** (CLI) while still having the benefits of a Graphical User Interface (GUI). If you can type fast, CollabSync can get your contact management tasks done faster than traditional GUI apps.
 
 <!-- * Table of Contents -->
-<page-nav-print />
+## Quick Search
+1. [Quick Start](#Quick-start)
+2. [Features](#features)
+   - [Help](#feature-1--help)
+   - [Adding a person](#feature-2--add)
+   - [Listing all persons](#feature-3--list)
+   - [Editing a person](#feature-4--edit)
+   - [Finding persons by name](#feature-5--find)
+   - [Deleting a person](#feature-6--delete)
+   - [Clearing all entries](#feature-7--clear)
+   - [Exiting the program](#feature-8--exit)
+3. [FAQ](#faq)
+4. [Known Issues](#Known-Issues)
+5. [Command Summary](#Command-Summary)
+
 
 --------------------------------------------------------------------------------------------------------------------
 
 ## Quick start
 
 1. Ensure you have Java `17` or above installed in your Computer.<br>
+   To check, click [here](#FAQ).<br>
    **Mac users:** Ensure you have the precise JDK version prescribed [here](https://se-education.org/guides/tutorials/javaInstallationMac.html).
 
-1. Download the latest `.jar` file from [here](https://github.com/se-edu/addressbook-level3/releases).
+1. Download the latest `.jar` file from [here](https://github.com/AY2425S2-CS2103T-F10-3/tp/releases/tag/v1.3).
 
-1. Copy the file to the folder you want to use as the _home folder_ for your AddressBook.
+1. Copy the file to the folder you want to use as the _home folder_ for your CollabSync.
 
-1. Open a command terminal, `cd` into the folder you put the jar file in, and use the `java -jar addressbook.jar` command to run the application.<br>
+1. Open a command terminal, `cd` into the folder you put the jar file in, and use the `java -jar CollabSync.jar` command to run the application.<br>
    A GUI similar to the below should appear in a few seconds. Note how the app contains some sample data.<br>
    ![Ui](images/Ui.png)
 
 1. Type the command in the command box and press Enter to execute it. e.g. typing **`help`** and pressing Enter will open the help window.<br>
    Some example commands you can try:
 
-   * `list` : Lists all contacts.
+    * `list` : Lists all contacts.
 
-   * `add n/John Doe p/98765432 e/johnd@example.com a/John street, block 123, #01-01` : Adds a contact named `John Doe` to the Address Book.
+    * `add n/John Doe p/98765432 e/johnd@example.com a/John street, block 123, #01-01 y/2024` : Adds a contact named `John Doe` to the Address Book.
 
-   * `delete 3` : Deletes the 3rd contact shown in the current list.
+    * `delete 3` : Deletes the 3rd contact shown in the current list.
 
-   * `clear` : Deletes all contacts.
+    * `clear` : Deletes all contacts.
 
-   * `exit` : Exits the app.
+    * `exit` : Exits the app.
path: docs/UserGuide.md
user: login: pang-yy
body: I like how you structure the command example.
created_at: 2025-03-25T08:02:23Z
author_association: NONE
diff_hunk: @@ -181,26 +207,25 @@ _Details coming soon ..._
 
 ## FAQ
 
-**Q**: How do I transfer my data to another Computer?<br>
-**A**: Install the app in the other computer and overwrite the empty data file it creates with the file that contains the data of your previous AddressBook home folder.
 
 --------------------------------------------------------------------------------------------------------------------
 
-## Known issues
+## Known Issues
path: docs/UserGuide.md
user: login: pang-yy
body: I like how you standardize the titles.
created_at: 2025-03-25T08:03:20Z
author_association: NONE
diff_hunk: @@ -1,49 +1,58 @@
----
-  layout: default.md
-  title: "User Guide"
-  pageNav: 3
----
-
 # CollabSync User Guide
 
 CollabSync is a **desktop app for managing contacts, optimized for use via a  Line Interface** (CLI) while still having the benefits of a Graphical User Interface (GUI). If you can type fast, CollabSync can get your contact management tasks done faster than traditional GUI apps.
 
 <!-- * Table of Contents -->
-<page-nav-print />
+## Quick Search
+1. [Quick Start](#Quick-start)
+2. [Features](#features)
+   - [Help](#feature-1--help)
+   - [Adding a person](#feature-2--add)
+   - [Listing all persons](#feature-3--list)
+   - [Editing a person](#feature-4--edit)
+   - [Finding persons by name](#feature-5--find)
+   - [Deleting a person](#feature-6--delete)
+   - [Clearing all entries](#feature-7--clear)
+   - [Exiting the program](#feature-8--exit)
+3. [FAQ](#faq)
+4. [Known Issues](#Known-Issues)
+5. [Command Summary](#Command-Summary)
path: docs/UserGuide.md
user: login: cyrolite
body: Nice provision of hyperlinks to ensure navigability and ease for users! Good job!
created_at: 2025-03-25T10:51:45Z
author_association: NONE

PR comments:
user: login: codecov[bot]
created_at: 2025-03-24T18:27:58Z
body: ## [Codecov](https://app.codecov.io/gh/AY2425S2-CS2103T-F10-3/tp/pull/95?dropdown=coverage&src=pr&el=h1&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=AY2425S2-CS2103T-F10-3) Report
All modified and coverable lines are covered by tests :white_check_mark:

<details><summary> :rocket: New features to boost your workflow: </summary>

- :snowflake: [Test Analytics](https://docs.codecov.com/docs/test-analytics): Detect flaky tests, report on failures, and find test suite problems.
</details>
author_association: NONE
user: login: cyrolite
created_at: 2025-03-25T01:53:41Z
body: I like how there is a navigation feature for each of the features in the user guide. Good job!
author_association: NONE
user: login: Melvan-Chan
created_at: 2025-03-25T12:39:59Z
body: Great update! Improving navigation helps users quickly locate relevant sections.
author_association: NONE