# ๐ค AI ์์ฐ๊ด๋ฆฌ ์ด์์คํดํธ ์ฌ์ฉ ๊ฐ์ด๋
## ๐ ๋ชฉ์ฐจ
1. [๊ฐ์](#๊ฐ์)
2. [์ฃผ์ ๊ธฐ๋ฅ](#์ฃผ์-๊ธฐ๋ฅ)
3. [์ค์น ๋ฐฉ๋ฒ](#์ค์น-๋ฐฉ๋ฒ)
4. [์ฌ์ฉ ๋ฐฉ๋ฒ](#์ฌ์ฉ-๋ฐฉ๋ฒ)
5. [์ค์ ์์คํ
์ฐ๋](#์ค์ -์์คํ
-์ฐ๋)
6. [๊ณ ๊ธ ์ค์ ](#๊ณ ๊ธ-์ค์ )
7. [FAQ](#faq)
---
## ๊ฐ์
**AI ์์ฐ๊ด๋ฆฌ ์ด์์คํดํธ**๋ ์ค์๊ฐ์ผ๋ก ์ ๊ท ์์ฃผ๋ฅผ ๊ฐ์งํ๊ณ , AI๊ฐ ์ํฅ์ ๋ถ์ํ์ฌ ์ต์ ์ ๋์ ๋ฐฉ์์ ์ ์ํ ํ, ๋ด๋น์๊ฐ ์ ํํ ์ต์
์ ์๋์ผ๋ก ์์คํ
์ ์ ์ฉํ๋ ์ง๋ฅํ ์ด์์คํดํธ์
๋๋ค.
### ๐ฏ ํต์ฌ ๊ฐ์น
- โก **์ฆ๊ฐ ๋์**: ์์ฃผ ์
๋ ฅ ํ ์ ์ด ๋ด์ AI ๋ถ์ ์๋ฃ
- ๐ง **์ง๋ฅํ ๋ถ์**: ์์ฐ/์ถํ/๋ฐ์ฃผ ์ ์ฒด๋ฅผ ํตํฉ ๋ถ์
- ๐ค **ํธ๋ฆฌํ ์ธํฐํ์ด์ค**: ์์ฑ ์๋ฆผ ๋ฐ ์์ฑ ์ ํ ์ง์
- ๐ค **์๋ ์ ์ฉ**: ์ ํํ ์ต์
์ ์์คํ
์ ์๋ ๋ฐ์
---
## ์ฃผ์ ๊ธฐ๋ฅ
### 1. ๐ ์ค์๊ฐ ๊ฐ์ง
- ์ ๊ท ์์ฃผ๊ฐ ์
๋ ฅ๋๋ฉด ์ฆ์ ๊ฐ์ง
- ๋ณ๊ฒฝ์ฌํญ ์ค์๊ฐ ๋ชจ๋ํฐ๋ง
### 2. ๐ค AI ์ํฅ ๋ถ์
- **๊ธฐ์กด ๊ณํ ์ํฅ๋ ๋ถ์**
- ์ง์ฐ ์์๋๋ ์์ฐ๊ณํ ํ์
- ์ค๋น ๊ฐ๋๋ฅ ๋ณํ ๊ณ์ฐ
- ์์์ฌ ๋ถ์กฑ๋ ์์ธก
- **3๊ฐ์ง ๋์ ๋ฐฉ์ ์๋ ์์ฑ**
- ์ต์
1: ์ผ๊ฐ ์์
์ถ๊ฐ (์ฃผ๋ก ์ถ์ฒ)
- ์ต์
2: ๊ธฐ์กด ์ฃผ๋ฌธ ์ง์ฐ
- ์ต์
3: ์ธ์ฃผ ์์ฐ
- **๊ฐ ์ต์
๋ณ ์ฅ๋จ์ ๋ถ์**
- ๋น์ฉ ์ํฅ
- ๋ฉ๊ธฐ ์ค์ ์ฌ๋ถ
- ๋ฆฌ์คํฌ ์์ธ
### 3. ๐ ๋ค์ํ ์๋ฆผ ๋ฐฉ์
```javascript
// 1. ๋ธ๋ผ์ฐ์ ์๋ฆผ
new Notification('๐จ ๊ธด๊ธ ์์ฃผ ๋ฐ์!')
// 2. ์์ฑ ์๋ฆผ (TTS)
aiAssistant.speak('๊ธด๊ธ ์์ฃผ๊ฐ ๋ฐ์ํ์ต๋๋ค')
// 3. ํ๋ฉด ํ ์คํธ
aiAssistant.showToast('์ ๊ท ์์ฃผ ์
๋ ฅ๋จ')
```
### 4. ๐ค ์์ฑ ์ ์ด
- "์ต์
1", "์ฒซ ๋ฒ์งธ", "์ผ๊ฐ ์์
" ๋ฑ์ผ๋ก ์ ํ
- ํ๊ตญ์ด ์์ฑ ์ธ์ ์ง์
### 5. โก ์๋ ์ ์ฉ
- ์์ฐ๊ณํ ์์
- ์ถํ๊ณํ ์กฐ์
- ๊ธด๊ธ ๋ฐ์ฃผ ์์ฑ
- ์์
์ ๋ฐฐ์
- ์ธ์ฃผ ๋ฐ์ฃผ ์ฒ๋ฆฌ
### 6. ๐ ๊ฐ์ฌ ๋ก๊ทธ
- ๋ชจ๋ AI ๊ฒฐ์ ๊ธฐ๋ก
- ๋ณ๊ฒฝ ์ด๋ ฅ ์ถ์
- ๋กค๋ฐฑ ๊ฐ๋ฅ
---
## ์ค์น ๋ฐฉ๋ฒ
### 1๏ธโฃ ํ์ผ ๋ณต์ฌ
ํ๋ก์ ํธ์ ๋ค์ ํ์ผ๋ค์ ์ถ๊ฐํ์ธ์:
```
ํ๋ฉด๊ฐ๋ฐ/
โโโ js/
โ โโโ aiProductionAssistant.js โ AI ์ด์์คํดํธ ํต์ฌ ๋ก์ง
โโโ css/
โ โโโ aiAssistant.css โ UI ์คํ์ผ
โโโ ai-assistant-demo.html โ ๋ฐ๋ชจ ํ์ด์ง (์ฐธ๊ณ ์ฉ)
```
### 2๏ธโฃ HTML ํ์ผ์ ์ถ๊ฐ
๊ธฐ์กด HTML ํ์ผ (์: `์์ฃผ๊ด๋ฆฌ.html`)์ `
` ํ๊ทธ์ ์ถ๊ฐ:
```html
```
### 3๏ธโฃ ์๋ฃ! ๐
์ด์ `aiAssistant` ๊ฐ์ฒด๋ฅผ ์ฌ์ฉํ ์ ์์ต๋๋ค.
---
## ์ฌ์ฉ ๋ฐฉ๋ฒ
### ๊ธฐ๋ณธ ์ฌ์ฉ (3๋จ๊ณ)
#### Step 1: AI ํ์ฑํ
```javascript
// AI ์ด์์คํดํธ ํ์ฑํ
aiAssistant.activate();
```
#### Step 2: ์์ฃผ ๋ฐ์ดํฐ ์ ๋ฌ
```javascript
// ์ ๊ท ์์ฃผ ๋ฐ์ ์
const newOrder = {
id: 'ORD-001',
item: '์ ํA',
quantity: 5000,
dueDate: '2025-10-28',
customer: '๊ณ ๊ฐ์ฌ๋ช
'
};
aiAssistant.onNewOrderDetected(newOrder);
```
#### Step 3: AI๊ฐ ์๋ ์ฒ๋ฆฌ
1. ์ํฅ ๋ถ์ (10์ด ๋ด์ธ)
2. 3๊ฐ์ง ์ต์
์ ์
3. ๋ด๋น์ ์ ํ
4. ์๋ ์ ์ฉ ์๋ฃ!
---
## ์ค์ ์์คํ
์ฐ๋
### ๐ ์์ฃผ๊ด๋ฆฌ ํ๋ฉด ์ฐ๋ ์์
```html
์์ฃผ๊ด๋ฆฌ
```
### ๐ ์์ฐ๊ณํ๊ด๋ฆฌ ํ๋ฉด ์ฐ๋
```javascript
// ์์ฐ๊ณํ๊ด๋ฆฌ.html ๋๋ ์์ฐ๊ณํ.js
// ํ์ฌ ์์ฐ๊ณํ ๋ฐ์ดํฐ๋ฅผ AI๊ฐ ์ ๊ทผํ ์ ์๋๋ก ์ ์ญ ๋ณ์๋ก ์ค์
window.productionPlans = [
{
id: 'P001',
item: '์ ํA',
quantity: 1000,
startDate: '2025-10-26',
endDate: '2025-10-28',
status: 'in_progress'
},
// ... ๋ ๋ง์ ๊ณํ
];
// AI ์ด์์คํดํธ๊ฐ ์์ฐ๊ณํ์ ์์ ํ ๋ ํธ์ถ๋๋ ํจ์
function onProductionPlanUpdated(updatedPlan) {
console.log('AI๊ฐ ์์ฐ๊ณํ์ ์์ ํ์ต๋๋ค:', updatedPlan);
// UI ์
๋ฐ์ดํธ
refreshProductionTable();
// ์๋ฒ ๋๊ธฐํ
syncToServer(updatedPlan);
}
// AI ์ด์์คํดํธ์๊ฒ ์ฝ๋ฐฑ ๋ฑ๋ก
aiAssistant.onProductionUpdate = onProductionPlanUpdated;
```
### ๐ ์ถํ๊ณํ๊ด๋ฆฌ ํ๋ฉด ์ฐ๋
```javascript
// ์ถํ๊ณํ.js
window.shipmentPlans = [
{
id: 'S001',
orderId: 'ORD-001',
shipmentDate: '2025-10-29',
quantity: 1000
}
];
// AI๊ฐ ์ถํ๊ณํ์ ์กฐ์ ํ ๋
function onShipmentPlanUpdated(updatedPlan) {
console.log('์ถํ๊ณํ ์กฐ์ :', updatedPlan);
refreshShipmentTable();
}
aiAssistant.onShipmentUpdate = onShipmentPlanUpdated;
```
---
## ๊ณ ๊ธ ์ค์
### ๐ OpenAI API ์ฐ๋ (์ค์ AI ์ฌ์ฉ)
```javascript
// API ํค ์ค์
aiAssistant.apiKey = 'sk-your-openai-api-key';
// ์ด์ ์ค์ GPT-4๋ฅผ ์ฌ์ฉํ์ฌ ๋ถ์ํฉ๋๋ค
// API ํค๊ฐ ์์ผ๋ฉด ๊ท์น ๊ธฐ๋ฐ ๋ถ์์ด ์ฌ์ฉ๋ฉ๋๋ค
```
### ๐จ UI ์ปค์คํฐ๋ง์ด์ง
`css/aiAssistant.css`๋ฅผ ์์ ํ์ฌ ๋์์ธ์ ๋ณ๊ฒฝํ ์ ์์ต๋๋ค:
```css
/* ์: ๋ชจ๋ฌ ์์ ๋ณ๊ฒฝ */
.ai-modal-header {
background: linear-gradient(135deg, #your-color-1, #your-color-2);
}
/* ๋ฒํผ ์์ ๋ณ๊ฒฝ */
.btn-primary {
background: linear-gradient(135deg, #your-color-1, #your-color-2);
}
```
### ๐ง ๋ถ์ ๋ก์ง ์ปค์คํฐ๋ง์ด์ง
`js/aiProductionAssistant.js`์ `ruleBasedAnalysis` ํจ์๋ฅผ ์์ :
```javascript
ruleBasedAnalysis(newOrder, currentState) {
// ์ฌ๊ธฐ์ ํ์ฌ ํน์ฑ์ ๋ง๊ฒ ๋ก์ง ์์
// ์: ์ผ์ผ ์์ฐ๋ ๋ณ๊ฒฝ
const dailyCapacity = 1500; // ๊ธฐ๋ณธ 1000์์ 1500์ผ๋ก
// ์: ์์ ์ฌ๊ณ ๊ณ์ฐ ๋ฐฉ์ ๋ณ๊ฒฝ
const safetyStock = newOrder.quantity * 0.2; // 20% ์์ ์ฌ๊ณ
// ... ๋๋จธ์ง ๋ก์ง
}
```
### ๐ ๋ฐ์ดํฐ ์์ง ํจ์ ์ฐ๋
์ค์ ์์คํ
๋ฐ์ดํฐ๋ฅผ ๊ฐ์ ธ์ค๋๋ก ์์ :
```javascript
// js/aiProductionAssistant.js ์์
getProductionPlans() {
// ๋ฐฉ๋ฒ 1: ์ ์ญ ๋ณ์์์ ๊ฐ์ ธ์ค๊ธฐ
return window.productionPlans || [];
// ๋ฐฉ๋ฒ 2: API์์ ์ค์๊ฐ ๊ฐ์ ธ์ค๊ธฐ (๊ถ์ฅ)
// return fetch('/api/production-plans').then(r => r.json());
}
getInventory() {
// ์ค์ ์ฌ๊ณ ๋ฐ์ดํฐ
return window.inventory || {};
}
// ๋ค๋ฅธ ํจ์๋ค๋ ๋ง์ฐฌ๊ฐ์ง๋ก ์์
```
---
## ๋ฐ๋ชจ ํ์ด์ง
### ๐ฎ ํ
์คํธ ๋ฐฉ๋ฒ
1. **๋ฐ๋ชจ ํ์ด์ง ์ด๊ธฐ**
```
http://localhost:8080/ํ๋ฉด๊ฐ๋ฐ/ai-assistant-demo.html
```
2. **AI ํ์ฑํ**
- "AI ํ์ฑํ/๋นํ์ฑํ" ๋ฒํผ ํด๋ฆญ
- ์ํ๊ฐ "ํ์ฑํ๋จ"์ผ๋ก ๋ณ๊ฒฝ๋จ
3. **์๋๋ฆฌ์ค ํ
์คํธ**
- ์๋๋ฆฌ์ค 1~3 ์ค ํ๋ ์ ํ
- AI ๋ถ์ ๊ฒฐ๊ณผ ํ์ธ
- ์ต์
์ ํ ํ "์๋ ์ ์ฉ" ํด๋ฆญ
4. **์์ฑ ๊ธฐ๋ฅ ํ
์คํธ**
- "์์ฑ ํ
์คํธ" ๋ฒํผ์ผ๋ก TTS ํ์ธ
- ๋ชจ๋ฌ์์ "๐ค ์์ฑ์ผ๋ก ์ ํ" ๋ฒํผ์ผ๋ก ์์ฑ ์ธ์ ํ
์คํธ
---
## FAQ
### Q1. AI ์์ด๋ ์ฌ์ฉํ ์ ์๋์?
**A:** ๋ค! OpenAI API ์์ด๋ ๊ท์น ๊ธฐ๋ฐ ๋ถ์์ด ์๋์ผ๋ก ์๋ํฉ๋๋ค. ๊ธฐ๋ณธ ๊ธฐ๋ฅ์ ๋ชจ๋ ์ฌ์ฉ ๊ฐ๋ฅํฉ๋๋ค.
### Q2. ์ด๋ค ๋ธ๋ผ์ฐ์ ๋ฅผ ์ง์ํ๋์?
**A:**
- โ
Chrome, Edge (๊ถ์ฅ)
- โ
Firefox
- โ ๏ธ Safari (์ผ๋ถ ๊ธฐ๋ฅ ์ ํ)
- โ IE (๋ฏธ์ง์)
์์ฑ ์ธ์์ Chrome/Edge์์ ๊ฐ์ฅ ์ ์๋ํฉ๋๋ค.
### Q3. ์ค์๊ฐ ๊ฐ์ง๋ ์ด๋ป๊ฒ ์๋ํ๋์?
**A:** ์์ฃผ ์ ์ฅ ํจ์์์ `aiAssistant.onNewOrderDetected()`๋ฅผ ํธ์ถํ๋ฉด ์ฆ์ AI ๋ถ์์ด ์์๋ฉ๋๋ค. WebSocket ์ฐ๋์ ์ ํ์ฌํญ์
๋๋ค.
### Q4. ์๋ ์ ์ฉ์ด ์์ ํ๊ฐ์?
**A:**
- โ
๋ชจ๋ ๋ณ๊ฒฝ์ฌํญ์ ๋ก๊ทธ๋ก ๊ธฐ๋ก๋ฉ๋๋ค
- โ
๋ด๋น์๊ฐ ์ง์ ์ต์
์ ์ ํํด์ผ ์ ์ฉ๋ฉ๋๋ค
- โ
๋กค๋ฐฑ ๊ธฐ๋ฅ ๊ตฌํ ๊ฐ๋ฅ
- โ ๏ธ ์ค์ํ ๊ฒฝ์ฐ ์ถ๊ฐ ์น์ธ ํ๋ก์ธ์ค ๊ถ์ฅ
### Q5. ๋ค๋ฅธ ํ๋ฉด๋ค๊ณผ ๋ฐ์ดํฐ ๋๊ธฐํ๋?
**A:** AI๊ฐ ๋ฐ์ดํฐ๋ฅผ ์์ ํ๋ฉด ๊ฐ ํ๋ฉด์ ์ฝ๋ฐฑ ํจ์๊ฐ ํธ์ถ๋ฉ๋๋ค:
```javascript
// ์์ฐ๊ณํ ์์ ์
aiAssistant.onProductionUpdate = (plan) => {
refreshProductionTable();
};
// ์ถํ๊ณํ ์์ ์
aiAssistant.onShipmentUpdate = (plan) => {
refreshShipmentTable();
};
```
### Q6. ์ฑ๋ฅ์ ์ด๋ค๊ฐ์?
**A:**
- ๊ท์น ๊ธฐ๋ฐ ๋ถ์: 1์ด ๋ฏธ๋ง
- OpenAI API ๋ถ์: 5-15์ด
- ์๋ ์ ์ฉ: 2-5์ด
### Q7. ๋น์ฉ์ ์ผ๋ง๋ ๋๋์?
**A:**
- ๊ท์น ๊ธฐ๋ฐ ๋ถ์: ๋ฌด๋ฃ
- OpenAI API: ์์ฒญ๋น ์ฝ $0.01-0.05 (GPT-4 ๊ธฐ์ค)
- ํ๋ฃจ 100๊ฑด ๋ถ์ ์: ์ฝ $1-5
### Q8. ๊ธฐ์กด ์์คํ
์ ๋ง์ด ์์ ํด์ผ ํ๋์?
**A:** ์๋์! ์ต์ ์์ ์ผ๋ก ์ฐ๋ ๊ฐ๋ฅ:
```javascript
// ๊ธฐ์กด ์ ์ฅ ํจ์์ ๋ฑ 3์ค๋ง ์ถ๊ฐ
function saveOrder(data) {
saveToDatabase(data); // ๊ธฐ์กด ์ฝ๋
// ์๋ก ์ถ๊ฐ๋๋ ์ฝ๋ (3์ค)
if (aiAssistant.isActive) {
aiAssistant.onNewOrderDetected(data);
}
}
```
### Q9. ๋ชจ๋ฐ์ผ์์๋ ์๋ํ๋์?
**A:**
- โ
ํ๋ฉด์ ๋ฐ์ํ์ผ๋ก ๋์
- โ ๏ธ ์์ฑ ์ธ์์ ๋ชจ๋ฐ์ผ์์ ์ ํ์
- โ
ํฐ์น ์ธํฐํ์ด์ค ์ง์
### Q10. ์ฌ๋ฌ ๋ช
์ด ๋์์ ์ฌ์ฉํ๋ฉด?
**A:** ๊ฐ ์ฌ์ฉ์์ ๋ธ๋ผ์ฐ์ ์์ ๋
๋ฆฝ์ ์ผ๋ก ์๋ํฉ๋๋ค. ์๋ฒ ๊ณต์ ๊ฐ ํ์ํ ๊ฒฝ์ฐ WebSocket ์๋ฒ ๊ตฌ์ถ์ ๊ถ์ฅํฉ๋๋ค.
---
## ๐ ๋ค์ ๋จ๊ณ
### ๋จ๊ณ๋ณ ๊ตฌํ ๋ก๋๋งต
#### โ
Phase 1: ํ๋กํ ํ์
(ํ์ฌ)
- [x] ๊ธฐ๋ณธ AI ๋ถ์
- [x] ์์ฑ ์๋ฆผ
- [x] ๋ชจ๋ฌ UI
- [x] ์๋ ์ ์ฉ ์๋ฎฌ๋ ์ด์
#### ๐ Phase 2: ์ค์ ์ฐ๋ (2-3์ผ)
- [ ] ์์ฃผ๊ด๋ฆฌ ํ๋ฉด ์ฐ๋
- [ ] ์์ฐ๊ณํ ๋ฐ์ดํฐ ์ฐ๋
- [ ] ์ถํ๊ณํ ๋ฐ์ดํฐ ์ฐ๋
- [ ] ์๋ฒ API ์ฐ๋
#### ๐ฏ Phase 3: ๊ณ ๋ํ (1-2์ฃผ)
- [ ] OpenAI API ํตํฉ
- [ ] ํ์ต ๋ฐ์ดํฐ ์์ง
- [ ] ์ ํ๋ ํฅ์
- [ ] ๋์๋ณด๋ ์ถ๊ฐ
#### ๐ Phase 4: ํ์ฅ (1๊ฐ์+)
- [ ] ์ฌ๊ณ ์ต์ ํ AI
- [ ] ์ค๋น ๊ณ ์ฅ ์์ธก
- [ ] ํ์ง ๊ด๋ฆฌ AI
- [ ] ๋ชจ๋ฐ์ผ ์ฑ
---
## ๐ ์ง์
๋ฌธ์ ๊ฐ ๋ฐ์ํ๊ฑฐ๋ ์ถ๊ฐ ๊ธฐ๋ฅ์ด ํ์ํ ๊ฒฝ์ฐ:
1. **๋ฐ๋ชจ ํ์ด์ง๋ก ๋จผ์ ํ
์คํธ**
- `ai-assistant-demo.html` ์ด๊ธฐ
- ๋ธ๋ผ์ฐ์ ์ฝ์(F12) ํ์ธ
2. **๋ก๊ทธ ํ์ธ**
```javascript
// ์ฝ์์์ ํ์ฌ ์ํ ํ์ธ
console.log(aiAssistant);
console.log(aiAssistant.isActive);
```
3. **ํ
์คํธ ํจ์ ์ฌ์ฉ**
```javascript
// ์ฝ์์์ ์ง์ ํ
์คํธ
testAI(); // ์ ์ฒด ํ๋ก์ฐ ํ
์คํธ
```
---
## ๐ ๋ณ๊ฒฝ ์ด๋ ฅ
### v1.0.0 (2025-10-25)
- ๐ ์ด๊ธฐ ๋ฒ์ ๋ฆด๋ฆฌ์ค
- โ
์ค์๊ฐ ๊ฐ์ง
- โ
AI ๋ถ์ (๊ท์น ๊ธฐ๋ฐ)
- โ
์์ฑ ์๋ฆผ/์ธ์
- โ
์๋ ์ ์ฉ
- โ
๋ฐ๋ชจ ํ์ด์ง
---
**์ฆ๊ฑฐ์ด AI ์ฒดํ ๋์ธ์! ๐คโจ**