docs: 팀프로젝트 readme 업데이트

리드미 업데이트

README.md

@@ -33,11 +33,61 @@
 
 
 
-## 🚀 핵심 기능
+## 🚀 프로젝트 기능 소개
+**주최자**
+
+- 퀴즈 생성 → 게임 발행 → 퀴즈 풀이 관전
+
+**참가자**
+
+- 게임 참가 → 퀴즈 풀이 진행
+
+### **<게임 대기 페이지 - 공통>**  
+![image](https://github.com/user-attachments/assets/79349eca-55cc-469c-b738-4195e34321eb)
+
+- 게임 대기 페이지로 들어오면 참여자의 고유의 캐릭터가 배정되고, 자신의 캐릭터는 파란색 배경으로 확인할 수 있습니다.
+- 실시간으로 채팅을 참여할 수 있으며,  `/` 버튼을 눌러서 보내고자하는 텍스트를 실시간으로 전송이 가능합니다.
+- 채팅은 `Enter` 버튼을 눌러 종료할 수 있습니다.
+
+### **<게임 진행 페이지 - 참여자>**  
+![image](https://github.com/user-attachments/assets/0395c21e-c4c6-4479-b50b-d5553bd4daad)
+
+- 정답을 제출한 참여자들은 풀이 시간에 따른 점수를 할당 받습니다.
+- 이모지 기능을 통해서 퀴즈에 대한 참여자들의 반응을 실시간으로 볼 수 있습니다.
+
+### **<정답 제출 후 게임 진행 페이지 - 참여자>**  
+![image](https://github.com/user-attachments/assets/87b490b8-38a5-4f37-884c-bb2d146581ab)
+
+- 실시간으로 변하는 총 제출, 정답률, 평균 풀이 시간, 평균 참여율 정보를 확인할 수 있습니다.
+- 참여자 본인의 제출 등수를 확인할 수 있습니다.
+
+### **<게임 진행 관리 및 통계 페이지 - 주최자>**  
+![image](https://github.com/user-attachments/assets/c13b18bd-d334-4aa6-bc4f-187ff6d90965)
+
+
+- 주최자는 실시간으로 퀴즈를 진행한 참여자들의 제출과 반응을 볼 수 있습니다.
+- 볼 수 있는 통계 항목
+    - 총 제출
+    - 정답률
+    - 평균 풀이 시간
+    - 평균 참여율
+    - 참여자들이 제출한 선택지
+    - 참여자들의 제출 현황
+    - 참여자들의 반응
+
+### **<게임 중간 집계 페이지 - 참여자>**  
+![image](https://github.com/user-attachments/assets/d22a3741-89f5-4d6a-9762-dcb4eaadf8e1)
+
+
+- 퀴즈의 제한시간이 종료된 이후에 해당 화면을 볼 수 있습니다.
+- 게임의 Top3를 점수와 함께 확인할 수 있습니다.
+- 참여자 본인의 등수 및 점수를 확인할 수 있습니다.
 
-## 📐 프로젝트 구조
 
 ## ⚒️ 기술 스택
+
+
+
 ### 💻 Common
 ![TypeScript](https://img.shields.io/badge/TypeScript-3178C6?style=flat-square&logo=TypeScript&logoColor=white)
 ![Prettier](https://img.shields.io/badge/Prettier-F7B93E?style=flat-square&logo=prettier&logoColor=white)
@@ -47,7 +97,7 @@
 
 ### 🎨 Frontend
 ![React](https://img.shields.io/badge/React-61DAFB?style=flat-square&logo=React&logoColor=black)
-![Emotion](https://img.shields.io/badge/Emotion-DB7093?style=flat-square&logo=styled-components&logoColor=white)
+![Tailwind](https://img.shields.io/badge/Tailwind-06B6D4?style=flat-square&logo=Tailwind-CSS&logoColor=white)
 ![Storybook](https://img.shields.io/badge/Storybook-FF4785?style=flat-square&logo=Storybook&logoColor=white)
 ![Tanstack Query](https://img.shields.io/badge/Tanstack_Query-FF4154?style=flat-square&logo=ReactQuery&logoColor=white)
 ![Vite](https://img.shields.io/badge/Vite-646CFF?style=flat-square&logo=Vite&logoColor=white)