diff --git a/public/chapter-1-admin-login.md b/public/chapter-1-admin-login.md
index c584af51..fec3a40e 100644
--- a/public/chapter-1-admin-login.md
+++ b/public/chapter-1-admin-login.md
@@ -15,7 +15,7 @@
 > หมายเลข 2 ช่องสำหรับกรอกรหัสผ่านใช้งาน  
 > หมายเลข 3 ปุ่มสำหรับคลิกเข้าสู่ระบบใช้งาน  
 > หมายเลข 4 ช่องสำหรับคลิก หากต้องการให้ระบบจดจำการเข้าสู่ระบบ  
-> หมายเลข 5ช่องสำหรับคลิกหากลืมรหัสผ่านเพื่อให้ทำระบบทำการรีเซ็ตรหัสผ่านใหม่    
+> หมายเลข 5 ช่องสำหรับคลิกหากลืมรหัสผ่านเพื่อให้ทำระบบทำการรีเซ็ตรหัสผ่านใหม่    
 > หมายเลข 6 ช่องสำหรับคลิกเพื่อลงทะเบียนผู้ใช้งานใหม่   
 
 - เมื่อเข้าสู่ระบบบริหารทรัพยากรบุคคลกรุงเทพมหานคร ระบบแสดงหน้าจอของระบบบริหาร
@@ -25,12 +25,55 @@
 
 ## การเปลี่ยนรหัสผ่านผู้ใช้งาน
 
-- สามารถกดเลือกไอคอน ![close](images/button/close-grey.png) จากนั้นระบบจะหน้า “ลืมรหัสผ่าน” ให้ทำการกรอกชื่อผู้ใช้งานหรือที่อยู่อีเมลของผู้ใช้งานลงไปจากนั้นทำการคลิก
-![close](images/button/close-grey.png) ระบบจะทำการรีเซ็ต
-รหัสผ่านใหม่ให้โดยการส่งคำแนะนำไปทางอีเมลของผู้ใช้งานหรือหากไม่ต้องการ ให้ทำการใช้เมาส์คลิก ![close](images/button/close-grey.png) เพื่อกลับไปยังหน้าเข้าสู่ระบบเพื่อใช้งาน
+- สามารถกดเลือกไอคอน ![close](images/button/forget-password.png) จากนั้นระบบจะหน้า “ลืมรหัสผ่าน” ให้ทำการกรอกชื่อผู้ใช้งานหรือที่อยู่อีเมลของผู้ใช้งานลงไปจากนั้นทำการคลิก
+![close](images/button/confirm.png) ระบบจะทำการรีเซ็ต
+รหัสผ่านใหม่ให้โดยการส่งคำแนะนำไปทางอีเมลของผู้ใช้งานหรือหากไม่ต้องการ ให้ทำการใช้เมาส์คลิก ![close](images/button/back-login.png) เพื่อกลับไปยังหน้าเข้าสู่ระบบเพื่อใช้งาน
 
-![รูปภาพที่ 1 – 4 แสดงการกรอกข้อมูลหากลืมรหัสผ่านใช้งาน](images/chapter1/chapter1_2.png)
+![รูปภาพที่ 1 – 4 แสดงการกรอกข้อมูลหากลืมรหัสผ่านใช้งาน](images/chapter1/chapter1_4.png)
+
+> หมายเลข 1 ช่องสำหรับกรอกชื่อหรืออีเมลของผู้ใช้งาน  
+> หมายเลข 2 ปุ่มสำหรับคลิกเพื่อยืนยันการให้ระบบส่งข้อมูลการรีเซ็ตรหัสผ่านให้  
+> หมายเลข 3 ปุ่มสำหรับคลิกเพื่อย้อนกลับไปหน้าเข้าสู่ระบบ
+
+## การลงทะเบียนผู้ใช้งานใหม่
+- หากเป็นผู้ใช้งานใหม่ต้องการที่จะลงทะเบียนเพื่อใช้งานระบบทรัพยากรบุคคลกรุงเทพมหานครให้ทำการใช้เมาส์คลิก ![close](images/button/register-blue.png) จากนั้นระบบแสดงหน้าลงทะเบียนผู้ใช้งาน ทำการกรอกข้อมูลให้ครบตามที่ระบบแนะนำจากนั้นทำการใช้เมาส์คลิก ![close](images/button/register-green.png) หรือหากไม่ต้องการลงทะเบียนผู้ใช้งานแล้วให้ทำการคลิก ![close](images/button/back-login-green.png) เพื่อยกเลิกการลงทะเบียนผู้ใช้งานใหม่หรือย้อนกลับไปยังหน้าเข้าสู่ระบบ
+
+![รูปภาพที่ 1 – 5 แสดงการกรอกข้อมูลลงทะเบียนผู้ใช้งานใหม่](images/chapter1/chapter1_5.png)
+
+> หมายเลข 1 ช่องสำหรับกรอกชื่อผู้ลงทะเบียนใช้งาน     
+> หมายเลข 2 ช่องสำหรับกรอกนามสกุลผู้ลงทะเบียนใช้งาน    
+> หมายเลข 3 ช่องสำหรับกรอกอีเมลผู้ลงทะเบียนใช้งาน     
+> หมายเลข 4 ช่องสำหรับกรอกชื่อผู้ใช้งานของผู้ลงทะเบียนใช้งาน   
+> หมายเลข 5 ช่องสำหรับกรอกตั้งรหัสผ่านสำหรับใช้งานระบบ     
+> หมายเลข 6 ช่องสำหรับกรอกยืนยันรหัสผ่านสำหรับใช้งานระบบ    
+> หมายเลข 7 ปุ่มสำหรับคลิกยืนยันการลงทะเบียนผู้ใช้งาน       
+> หมายเลข 8 ปุ่มสำหรับคลิกเพื่อย้อนกลับหน้าเข้าสู่ระบบ  
+   
+## การออกจากระบบ
+- หากต้องการออกจากระบบหลังจากที่ใช้งานเสร็จแล้ว ให้ทำการใช้เมาส์คลิก ![close](images/button/dropdown-grey.png)  ระบบแสดง
+เมนูย่อย ให้ทำการคลิก ![close](images/button/logout.png) เพื่อออกจากระบบ ดังรูป 
+
+![รูปภาพที่ 1 – 6 แสดงการออกจากระบบผู้ใช้งาน](images/chapter1/chapter1_6.png)
+
+## การแสดงแจ้งเตือน
+- ระบบจะทำการแจ้งเตือนการขอคำร้องแก้ไขข้อมูลต่างๆ ให้ทำการใช้เมาส์คลิก ![close](images/button/notifications.png) เพื่อดูการ
+แจ้งเตือนหรือการขอคำร้องต่างๆ จากนั้นทำการคลิกเข้าไปในการขอคำร้อง ระบบจะทำการแสดงข้อมูล
+รายละเอียดการขอคำร้องต่างๆ ให้ โดยที่สามารถทำการคลิก ![close](images/button/close.png) เพื่อลบแจ้งเตือนข้อมูลคำร้องทิ้ง
+
+![รูปภาพที่  1 – 7 แสดงการดูการแจ้งเตือนคำร้องขอต่างๆ](images/chapter1/chapter1_7.png)
 
 
+- หากต้องการดูข้อมูลการร้องขอต่างๆให้ทำการใช้เมาส์คลิกเลือกการแจ้งเตือนจากนั้นระบบจะทำการแสดงข้อมูลการแจ้งเตือนเป็นกล่องข้อความ โดยที่สามารถทำการลบข้อมูลร้องขอโดยการคลิก ![close](images/button/delete-grey.png)  หรือหากต้องการจัดการข้อมูลคำร้องอื่นๆ ให้ทำการคลิก  ![close](images/button/dot-grey.png)   หรือหากจะย้อนกลับก็ทำการคลิก   ![close](images/button/back-grey.png) เพื่อย้อนกลับไปยังหน้าข้อมูลก่อนหน้านี้
+
+![รูปภาพที่  1 – 8 แสดงการดูรายละเอียดการแจ้งเตือน](images/chapter1/chapter1_8.png)
+
+> หมายเลข 1 ช่องสำหรับแสดงข้อความการแจ้งเตือนคำร้องขอต่างๆ  
+> หมายเลข 2 ช่องแสดงข้อมูลรายละเอียดข้อความ  
 
 
+- การดาวน์โหลดไฟล์เอกสารแนบคำร้องขอต่างๆ เพื่อดูเอกสารเพิ่มเติมการร้องขอให้ทำการใช้เมาส์คลิก ![close](images/button/download-all.png) จากนั้นระบบทำการดาวน์โหลดไฟล์เอกสารแนบ หรือหากคำร้องขอไหนที่สำคัญสามารถทำการใช้เมาส์คลิก ![close](images/button/star-grey.png) ให้เป็น ![close](images/button/star-yellow.png) เพื่อให้ข้อความคำร้องนี้ขึ้นไปอยู่บนสุดของกล่องข้อความหรือให้ความสำคัญกับกล่องข้อความนี้ก่อน
+
+![รูปภาพที่  1 – 9 แสดงการดาวน์โหลดไฟล์เอกสารแนบคำร้อง](images/chapter1/chapter1_9.png)
+
+> หมายเลข 1 ปุ่มดาวสำหรับคลิกเพื่อดันข้อความไว้บนสุด  
+> หมายเลข 2 ปุ่มสำหรับคลิกดาวน์โหลดไฟล์เอกสารแนบคำร้อง  
\ No newline at end of file
diff --git a/public/images/button/back-grey.png b/public/images/button/back-grey.png
new file mode 100644
index 00000000..17649ac0
Binary files /dev/null and b/public/images/button/back-grey.png differ
diff --git a/public/images/button/back-login-green.png b/public/images/button/back-login-green.png
new file mode 100644
index 00000000..f0f29de0
Binary files /dev/null and b/public/images/button/back-login-green.png differ
diff --git a/public/images/button/delete-grey.png b/public/images/button/delete-grey.png
new file mode 100644
index 00000000..451df4cf
Binary files /dev/null and b/public/images/button/delete-grey.png differ
diff --git a/public/images/button/ืnotifications.png b/public/images/button/notifications.png
similarity index 100%
rename from public/images/button/ืnotifications.png
rename to public/images/button/notifications.png
diff --git a/public/images/chapter1/chapter1_4.png b/public/images/chapter1/chapter1_4.png
new file mode 100644
index 00000000..bc2e3bf9
Binary files /dev/null and b/public/images/chapter1/chapter1_4.png differ
diff --git a/public/images/chapter1/chapter1_5.png b/public/images/chapter1/chapter1_5.png
new file mode 100644
index 00000000..2e574eac
Binary files /dev/null and b/public/images/chapter1/chapter1_5.png differ
diff --git a/public/images/chapter1/chapter1_6.png b/public/images/chapter1/chapter1_6.png
new file mode 100644
index 00000000..980a2d9e
Binary files /dev/null and b/public/images/chapter1/chapter1_6.png differ
diff --git a/public/images/chapter1/chapter1_7.png b/public/images/chapter1/chapter1_7.png
new file mode 100644
index 00000000..e62ed906
Binary files /dev/null and b/public/images/chapter1/chapter1_7.png differ
diff --git a/public/images/chapter1/chapter1_8.png b/public/images/chapter1/chapter1_8.png
new file mode 100644
index 00000000..f95d1c97
Binary files /dev/null and b/public/images/chapter1/chapter1_8.png differ
diff --git a/public/images/chapter1/chapter1_9.png b/public/images/chapter1/chapter1_9.png
new file mode 100644
index 00000000..08618274
Binary files /dev/null and b/public/images/chapter1/chapter1_9.png differ