diff --git a/docs/DeveloperGuide.md b/docs/DeveloperGuide.md
index 6593cd26c43..d5399cee03e 100644
--- a/docs/DeveloperGuide.md
+++ b/docs/DeveloperGuide.md
@@ -161,6 +161,18 @@ Classes used by multiple components are in the `seedu.addressbook.commons` packa
This section describes some noteworthy details on how certain features are implemented.
+### View Specific Person feature
+Step 1: The user launches the application for the first time. The `SampleAddressBook` will be initialised.
+
+Step 2: The user executes `addclient n/John Doe p/98765432 e/johnd@example.com a/John street, block 123, #01-01` to add a new Client.
+
+Step 3: The user executes a `view 1` command to view the 1st person in the address book. The user’s command is parsed by `ViewCommandParser` which extracts the target index. The `ViewCommand` class is instantiated with the extracted index. `ViewCommand` class interacts with `Model#FilteredPersonList` to verify the validity of the index and retrieve the corresponding person’s details. The command execution would be encapsulated as a `CommandResult` object that is then returned back from `Logic`.
+
+**Note:** If the index given is more than the size of the list or when the index given is 0, `ViewCommand` will not call `Model#view(Person personToView)`. Instead, a `MESSAGE_INVALID_PERSON_DISPLAYED_INDEX` exception will be thrown. The Main Window display continue displaying the `PersonListPanel` UI instead of the `ViewWindow` UI
+
+The following sequence diagram shows how the View Command works:
+
+
### \[Proposed\] Undo/redo feature
#### Proposed Implementation
@@ -610,6 +622,19 @@ testers are expected to do more *exploratory* testing.
1. _{ more test cases … }_
+### Viewing a person
+
+1. Viewing a person while all persons are being shown
+
+ 1. Prerequisites: List all persons using the `list` command. Multiple persons in the list.
+
+ 1. Test case: `view 0`
+ Expected: Entire list remains displayed. Error details shown in status message. Status bar remains the same.
+ 1. Other incorrect view commands to try: `view`, `view x` (where x is larger than the list size, or x is a negative index)
+ Expected: Similar to previous.
+ 1. Test case: `view 1`, `view x` (where x is an integer within the size of the list)
+ Expected: The full details of the first person is displayed. Success message: `Viewed Person Successfully`
+
### Saving data
1. Dealing with missing/corrupted data files
diff --git a/docs/diagrams/UiClassDiagram.png b/docs/diagrams/UiClassDiagram.png
index f104adb37c9..d46fdc84bd7 100644
Binary files a/docs/diagrams/UiClassDiagram.png and b/docs/diagrams/UiClassDiagram.png differ
diff --git a/docs/diagrams/UiClassDiagram.puml b/docs/diagrams/UiClassDiagram.puml
index 95473d5aa19..b860e0c6df6 100644
--- a/docs/diagrams/UiClassDiagram.puml
+++ b/docs/diagrams/UiClassDiagram.puml
@@ -1,5 +1,6 @@
@startuml
!include style.puml
+!pragma layout smetana
skinparam arrowThickness 1.1
skinparam arrowColor UI_COLOR_T4
skinparam classBackgroundColor UI_COLOR
@@ -15,6 +16,7 @@ Class PersonListPanel
Class PersonCard
Class StatusBarFooter
Class CommandBox
+Class ViewWindow
}
package Model <> {
@@ -35,6 +37,7 @@ MainWindow *-down-> "1" ResultDisplay
MainWindow *-down-> "1" PersonListPanel
MainWindow *-down-> "1" StatusBarFooter
MainWindow --> "0..1" HelpWindow
+MainWindow --> "0..1" ViewWindow
PersonListPanel -down-> "*" PersonCard
@@ -46,6 +49,7 @@ PersonListPanel --|> UiPart
PersonCard --|> UiPart
StatusBarFooter --|> UiPart
HelpWindow --|> UiPart
+ViewWindow --|> UiPart
PersonCard ..> Model
UiManager -right-> Logic
@@ -57,4 +61,4 @@ CommandBox -[hidden]left- ResultDisplay
ResultDisplay -[hidden]left- StatusBarFooter
MainWindow -[hidden]-|> UiPart
-@enduml
+@enduml
\ No newline at end of file
diff --git a/docs/diagrams/ViewSequenceDiagram.png b/docs/diagrams/ViewSequenceDiagram.png
new file mode 100644
index 00000000000..93dfaf4d045
Binary files /dev/null and b/docs/diagrams/ViewSequenceDiagram.png differ
diff --git a/docs/diagrams/ViewSequenceDiagram.puml b/docs/diagrams/ViewSequenceDiagram.puml
new file mode 100644
index 00000000000..46423f7fe6e
--- /dev/null
+++ b/docs/diagrams/ViewSequenceDiagram.puml
@@ -0,0 +1,70 @@
+@startuml
+!include style.puml
+skinparam ArrowFontStyle plain
+
+box Logic LOGIC_COLOR_T1
+participant ":LogicManager" as LogicManager LOGIC_COLOR
+participant ":AddressBookParser" as AddressBookParser LOGIC_COLOR
+participant ":ViewCommandParser" as ViewCommandParser LOGIC_COLOR
+participant "d:ViewCommand" as ViewCommand LOGIC_COLOR
+participant ":CommandResult" as CommandResult LOGIC_COLOR
+end box
+
+box Model MODEL_COLOR_T1
+participant ":Model" as Model MODEL_COLOR
+end box
+
+[-> LogicManager : execute("view 1")
+activate LogicManager
+
+LogicManager -> AddressBookParser : parseCommand("view 1")
+activate AddressBookParser
+
+create ViewCommandParser
+AddressBookParser -> ViewCommandParser
+activate ViewCommandParser
+
+ViewCommandParser --> AddressBookParser
+deactivate ViewCommandParser
+
+AddressBookParser -> ViewCommandParser : parse("1")
+activate ViewCommandParser
+
+create ViewCommand
+ViewCommandParser -> ViewCommand
+activate ViewCommand
+
+ViewCommand --> ViewCommand : v
+deactivate ViewCommand
+
+ViewCommandParser --> AddressBookParser : v
+deactivate ViewCommandParser
+'Hidden arrow to position the destroy marker below the end of the activation bar.
+ViewCommandParser -[hidden]-> AddressBookParser
+destroy ViewCommandParser
+
+AddressBookParser --> LogicManager : v
+deactivate AddressBookParser
+
+LogicManager -> ViewCommand : execute()
+activate ViewCommand
+
+ViewCommand -> Model : view(person)
+activate Model
+
+Model --> ViewCommand
+deactivate Model
+
+create CommandResult
+ViewCommand -> CommandResult
+activate CommandResult
+
+CommandResult --> ViewCommand
+deactivate CommandResult
+
+ViewCommand --> LogicManager : result
+deactivate ViewCommand
+
+[<--LogicManager
+deactivate LogicManager
+@enduml
\ No newline at end of file