Spaces:
Running
Running
| <html lang="ko"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>SiteAgent — AI 웹 어시스턴트 by Ginigen AI</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;700;900&display=swap" rel="stylesheet"> | |
| <style> | |
| :root{--bg:#f8f9fc;--white:#fff;--surface:#f0f2f8;--border:#e2e5ee;--accent:#5856D6;--accent2:#4f46e5;--green:#059669;--text:#1a1a2e;--muted:#64748b;--lp:#eeedfe;--lb:#e6f1fb;--lg:#e1f5ee;--la:#faeeda;} | |
| *{margin:0;padding:0;box-sizing:border-box;} | |
| body{background:var(--bg);color:var(--text);font-family:'Noto Sans KR',-apple-system,sans-serif;min-height:100vh;overflow-x:hidden;} | |
| .ct{max-width:800px;margin:0 auto;padding:0 20px;} | |
| .hero{text-align:center;padding:56px 20px 40px;background:linear-gradient(180deg,#fff,var(--bg));} | |
| .logo{display:inline-flex;align-items:center;gap:10px;margin-bottom:14px;} | |
| .logo-ic{width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent2));display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(88,86,214,.25);} | |
| .logo-tx{font-size:28px;font-weight:900;letter-spacing:-1px;}.logo-tx b{color:var(--accent);} | |
| .hero h2{font-size:18px;font-weight:700;margin-bottom:8px;} | |
| .hero p{font-size:14px;color:var(--muted);line-height:1.7;max-width:520px;margin:0 auto;} | |
| .notice{margin:0 auto 28px;max-width:800px;padding:16px 20px;background:var(--lp);border:1px solid rgba(88,86,214,.12);border-radius:14px;display:flex;gap:12px;align-items:flex-start;} | |
| .notice-ic{font-size:20px;flex-shrink:0;margin-top:2px;} | |
| .notice h3{font-size:13px;font-weight:700;color:var(--accent);margin-bottom:4px;} | |
| .notice p{font-size:12px;color:#3C3489;line-height:1.7;} | |
| .notice strong{color:var(--accent);} | |
| .vs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0 auto 32px;max-width:800px;padding:0 20px;} | |
| .vs-card{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:20px;position:relative;overflow:hidden;} | |
| .vs-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;} | |
| .vs-card.bm::before{background:linear-gradient(90deg,#5856D6,#007AFF);} | |
| .vs-card.ext::before{background:linear-gradient(90deg,#059669,#34d399);} | |
| .vs-badge{display:inline-block;padding:3px 10px;border-radius:6px;font-size:10px;font-weight:700;margin-bottom:10px;} | |
| .vs-card.bm .vs-badge{background:var(--lp);color:#3C3489;} | |
| .vs-card.ext .vs-badge{background:var(--lg);color:#085041;} | |
| .vs-card h3{font-size:15px;font-weight:700;margin-bottom:6px;} | |
| .vs-card p{font-size:12px;color:var(--muted);line-height:1.6;margin-bottom:10px;} | |
| .vs-feat{font-size:11px;color:var(--text);line-height:1.8;} | |
| .vs-feat span{color:var(--green);margin-right:4px;} | |
| .install{max-width:800px;margin:0 auto 36px;padding:0 20px;} | |
| .install-card{background:var(--white);border:1px solid var(--border);border-radius:16px;padding:28px;text-align:center;} | |
| .install-card h3{font-size:16px;font-weight:700;margin-bottom:6px;} | |
| .install-card>p{font-size:12px;color:var(--muted);margin-bottom:18px;} | |
| .bookmarklet-btn{display:inline-flex;align-items:center;gap:8px;padding:14px 32px;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#fff;font-size:15px;font-weight:700;border-radius:12px;text-decoration:none;cursor:grab;box-shadow:0 4px 20px rgba(88,86,214,.3);transition:all .15s;} | |
| .bookmarklet-btn:hover{box-shadow:0 6px 28px rgba(88,86,214,.4);transform:translateY(-1px);} | |
| .drag-hint{margin-top:14px;font-size:11px;color:var(--muted);line-height:1.8;}.drag-hint b{color:var(--accent);} | |
| .sec-title{max-width:800px;margin:0 auto 16px;padding:0 20px;font-size:16px;font-weight:700;display:flex;align-items:center;gap:8px;} | |
| .tbl-wrap{max-width:800px;margin:0 auto 32px;padding:0 20px;} | |
| .tbl-card{background:var(--white);border:1px solid var(--border);border-radius:14px;padding:20px;overflow-x:auto;} | |
| table{width:100%;border-collapse:collapse;font-size:11.5px;min-width:640px;} | |
| thead tr{border-bottom:2px solid var(--border);} | |
| th{padding:10px 6px;font-weight:500;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.3px;} | |
| td{padding:8px 6px;border-bottom:1px solid #f0f2f8;vertical-align:top;} | |
| tr:last-child td{border-bottom:none;} | |
| .bg{display:inline-block;padding:2px 8px;border-radius:5px;font-size:10px;font-weight:600;} | |
| .bg-free{background:var(--lp);color:#3C3489;}.bg-b2b{background:var(--lg);color:#085041;}.bg-b2c{background:var(--la);color:#633806;}.bg-sa{background:var(--lp);color:#3C3489;} | |
| .chk{color:var(--green);font-weight:500;}.na{color:#c0c4cc;} | |
| .marl-box{margin-top:14px;padding:14px 16px;background:var(--lp);border:1px solid rgba(88,86,214,.1);border-radius:10px;font-size:11px;color:#3C3489;line-height:1.7;} | |
| .marl-box b{color:#26215C;} | |
| .tbl-note{font-size:10px;color:var(--muted);margin-top:10px;} | |
| .feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;max-width:800px;margin:0 auto 36px;padding:0 20px;} | |
| .feat{background:var(--white);border:1px solid var(--border);border-radius:12px;padding:14px;display:flex;gap:10px;align-items:flex-start;} | |
| .feat-ic{font-size:18px;flex-shrink:0;}.feat h4{font-size:12px;font-weight:700;margin-bottom:2px;}.feat p{font-size:10.5px;color:var(--muted);line-height:1.5;} | |
| .feat-hl{border-color:rgba(88,86,214,.2);background:var(--lp);} | |
| .feat-hl h4{color:#3C3489;}.feat-hl p{color:#534AB7;} | |
| .footer{text-align:center;padding:40px 20px;border-top:1px solid var(--border);margin-top:20px;font-size:11px;color:var(--muted);} | |
| .footer a{color:var(--accent);text-decoration:none;} | |
| @media(max-width:600px){.vs{grid-template-columns:1fr;}.feat-grid{grid-template-columns:1fr;}} | |
| </style> | |
| </head> | |
| <body> | |
| <div class="hero"> | |
| <div class="logo"> | |
| <div class="logo-ic"><svg width="24" height="24" viewBox="0 0 26 26" fill="none"><path d="M4 2L4 18L8 14L10.5 20.5L13 19.5L10.5 13L15.5 13Z" fill="white" stroke="rgba(255,255,255,.3)" stroke-width=".5" stroke-linejoin="round"/><text x="15.5" y="9" font-size="7.5" font-weight="800" fill="rgba(255,255,255,.95)">AI</text></svg></div> | |
| <div class="logo-tx"><b>Site</b>Agent</div> | |
| </div> | |
| <h2>어떤 웹 페이지에서든 동작하는 AI 어시스턴트</h2> | |
| <p>요약 · 번역 · 검색 · 딥분석 · 아이디어 · 이미지 생성 · 금융 · X-Ray · 날씨 · 타이머<br>MARL 메타인지 엔진 탑재 — <strong>12가지 AI 도구를 하나의 패널</strong>에서</p> | |
| </div> | |
| <div class="notice"> | |
| <div class="notice-ic">🚀</div> | |
| <div> | |
| <h3>크롬 웹 스토어 심사 진행 중</h3> | |
| <p>브라우저 설치 버전(크롬 확장)은 <strong>크롬 웹 스토어 심사 완료 후 공개 예정</strong>입니다.<br>심사 기간 동안에는 아래 <strong>북마클릿 버전</strong>을 사용하실 수 있습니다. 핵심 AI 기능은 동일합니다.</p> | |
| </div> | |
| </div> | |
| <div class="vs"> | |
| <div class="vs-card bm"> | |
| <div class="vs-badge">지금 사용 가능</div> | |
| <h3>📌 북마클릿 버전</h3> | |
| <p>설치 없이 북마크바에 드래그만 하면 끝. 어떤 브라우저에서도 동작합니다.</p> | |
| <div class="vs-feat"> | |
| <span>✓</span> Zero-Install — 드래그 한 번<br> | |
| <span>✓</span> AI 채팅 · 요약 · 번역 · 검색<br> | |
| <span>✓</span> MARL 딥분석 · 아이디어 9엔진<br> | |
| <span>✓</span> AI 이미지 생성/편집<br> | |
| <span>✓</span> 금융 · X-Ray · 날씨 · 타이머<br> | |
| <span style="color:#c0c4cc;">✗</span> <span style="color:#94a3b8;">페이지 간 자동 이동</span><br> | |
| <span style="color:#c0c4cc;">✗</span> <span style="color:#94a3b8;">Gmail 자동 연동 · 활동 기록</span> | |
| </div> | |
| </div> | |
| <div class="vs-card ext"> | |
| <div class="vs-badge">심사 후 공개</div> | |
| <h3>🧩 크롬 확장 버전</h3> | |
| <p>크롬 스토어 1클릭 설치. 페이지 이동해도 AI가 유지되며, 모든 활동을 기록합니다.</p> | |
| <div class="vs-feat"> | |
| <span>✓</span> 북마클릿 기능 전부 포함<br> | |
| <span>✓</span> <b>페이지 간 자동 이동</b> (크로스탭)<br> | |
| <span>✓</span> <b>Gmail 자동 로그인</b><br> | |
| <span>✓</span> <b>사용자 활동 DB 기록</b><br> | |
| <span>✓</span> <b>관리자 대시보드</b><br> | |
| <span>✓</span> OpenAI API 직접 연결 가능<br> | |
| <span>✓</span> 페이지 이동 시 에이전트 자동 재주입 | |
| </div> | |
| </div> | |
| </div> | |
| <div class="install"> | |
| <div class="install-card"> | |
| <h3>북마클릿 설치 (3초)</h3> | |
| <p>아래 버튼을 브라우저 북마크바로 드래그하세요. 설치 끝!</p> | |
| <a id="bookmarkletLink" href="javascript:%28function%28%29%7Bif%28window.__SA_AGENT%29%7Bif%28window.__sa_panel_open%29window.__sa_panel_open%28%29%3Breturn%3B%7Dvar%20B%3D%27https%3A//ginigen-ai-site-agent.hf.space%27%3Bwindow.__SA_BASE%3DB%3Bfetch%28B%2B%27/api/agent-script%27%2C%7Bmode%3A%27cors%27%7D%29.then%28function%28r%29%7Bif%28%21r.ok%29throw%20new%20Error%28%27HTTP%20%27%2Br.status%29%3Breturn%20r.json%28%29%3B%7D%29.then%28function%28d%29%7Bvar%20bin%3Datob%28d.js%29%3Bvar%20bytes%3Dnew%20Uint8Array%28bin.length%29%3Bfor%28var%20i%3D0%3Bi%3Cbin.length%3Bi%2B%2B%29bytes%5Bi%5D%3Dbin.charCodeAt%28i%29%3Bvar%20blob%3Dnew%20Blob%28%5Bbytes%5D%2C%7Btype%3A%27application/javascript%27%7D%29%3Bvar%20url%3DURL.createObjectURL%28blob%29%3Bvar%20s%3Ddocument.createElement%28%27script%27%29%3Bs.src%3Durl%3Bs.onload%3Dfunction%28%29%7BURL.revokeObjectURL%28url%29%3Bif%28%21window.PageAgent%29%7Balert%28%27PageAgent%20%EC%97%86%EC%9D%8C%27%29%3Breturn%3B%7Dif%28window.pageAgent%29try%7Bwindow.pageAgent.dispose%28%29%3B%7Dcatch%28x%29%7B%7Dvar%20ag%3Dnew%20window.PageAgent%28%7BbaseURL%3AB%2B%27/api%27%2CapiKey%3A%27demo%27%2Cmodel%3A%27gpt-oss-120b%27%2Clanguage%3A%27ko-KR%27%2CexperimentalScriptExecutionTool%3Atrue%2CmaxSteps%3A15%7D%29%3Bwindow.__SA_AGENT%3Dag%3Btry%7Bag.panel.show%3Dfunction%28%29%7B%7D%3Bag.panel.hide%3Dfunction%28%29%7B%7D%3Bag.panel.expand%3Dfunction%28%29%7B%7D%3Bag.panel.collapse%3Dfunction%28%29%7B%7D%3Bif%28ag.panel.wrapper%29ag.panel.wrapper.remove%28%29%3B%7Dcatch%28e%29%7B%7Dif%28window.__SA_INIT_UI%29window.__SA_INIT_UI%28ag%29%3B%7D%3Bs.onerror%3Dfunction%28%29%7BURL.revokeObjectURL%28url%29%3Balert%28%27%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8%20%EC%98%A4%EB%A5%98%27%29%3B%7D%3Bdocument.head.appendChild%28s%29%3B%7D%29.catch%28function%28e%29%7Balert%28%27SiteAgent%3A%20%27%2Be.message%29%3B%7D%29%3B%7D%29%28%29%3B" class="bookmarklet-btn"> | |
| <svg width="16" height="16" viewBox="0 0 26 26" fill="none"><path d="M4 2L4 18L8 14L10.5 20.5L13 19.5L10.5 13L15.5 13Z" fill="currentColor"/></svg> | |
| 🤖 SiteAgent | |
| </a> | |
| <div class="drag-hint"><b>방법 1.</b> 위 버튼을 브라우저 북마크바로 드래그 | <b>방법 2.</b> 북마크바 안 보이면 <b>Ctrl+Shift+B</b></div> | |
| </div> | |
| </div> | |
| <!-- 얼리 액세스 --> | |
| <div style="max-width:800px;margin:0 auto 32px;padding:0 20px;"> | |
| <div style="background:linear-gradient(135deg,#5856D6 0%,#4f46e5 100%);border-radius:16px;padding:32px 28px;color:#fff;text-align:center;position:relative;overflow:hidden;"> | |
| <div style="position:absolute;top:-40px;right:-40px;width:160px;height:160px;border-radius:50%;background:rgba(255,255,255,.06);"></div> | |
| <div style="position:absolute;bottom:-60px;left:-30px;width:200px;height:200px;border-radius:50%;background:rgba(255,255,255,.04);"></div> | |
| <div style="position:relative;z-index:1;"> | |
| <div style="font-size:13px;font-weight:600;opacity:.85;margin-bottom:6px;letter-spacing:1px;">EARLY ACCESS</div> | |
| <h3 style="font-size:20px;font-weight:900;margin-bottom:8px;">크롬 확장 버전 얼리 액세스</h3> | |
| <p style="font-size:13px;opacity:.8;line-height:1.7;margin-bottom:20px;">크롬 웹 스토어 출시 시 가장 먼저 알려드립니다.<br>얼리 액세스 사용자에게는 <b>프리미엄 기능 우선 체험</b> 기회를 드립니다.</p> | |
| <div id="wl-form" style="max-width:440px;margin:0 auto;"> | |
| <div style="display:flex;gap:8px;margin-bottom:8px;"> | |
| <input type="email" id="wl-email" placeholder="이메일 주소" style="flex:1;padding:12px 14px;border:2px solid rgba(255,255,255,.25);border-radius:10px;background:rgba(255,255,255,.12);color:#fff;font-size:14px;outline:none;font-family:inherit;" onfocus="this.style.borderColor='rgba(255,255,255,.5)'" onblur="this.style.borderColor='rgba(255,255,255,.25)'"> | |
| <button onclick="submitWaitlist()" style="padding:12px 24px;background:#fff;color:#5856D6;border:none;border-radius:10px;font-size:14px;font-weight:700;cursor:pointer;white-space:nowrap;font-family:inherit;transition:all .15s;" onmouseover="this.style.transform='scale(1.03)'" onmouseout="this.style.transform='scale(1)'">등록하기</button> | |
| </div> | |
| <div style="display:flex;gap:8px;max-width:300px;margin:0 auto;"> | |
| <select id="wl-interest" style="flex:1;padding:9px 12px;border:1.5px solid rgba(255,255,255,.15);border-radius:8px;background:rgba(255,255,255,.08);color:#fff;font-size:12px;outline:none;font-family:inherit;cursor:pointer;"> | |
| <option value="" style="color:#333;">관심 분야 (선택)</option> | |
| <option value="general" style="color:#333;">일반 사용</option> | |
| <option value="business" style="color:#333;">비즈니스/업무</option> | |
| <option value="developer" style="color:#333;">개발/기술</option> | |
| <option value="creator" style="color:#333;">콘텐츠 제작</option> | |
| <option value="research" style="color:#333;">연구/분석</option> | |
| <option value="enterprise" style="color:#333;">기업 도입 검토</option> | |
| </select> | |
| </div> | |
| </div> | |
| <div id="wl-result" style="margin-top:12px;font-size:13px;font-weight:600;display:none;"></div> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| async function submitWaitlist(){ | |
| var email=document.getElementById('wl-email').value.trim(); | |
| if(!email||!email.includes('@')){document.getElementById('wl-result').textContent='⚠️ 유효한 이메일을 입력해주세요.';document.getElementById('wl-result').style.display='block';return;} | |
| var interest=(document.getElementById('wl-interest')||{}).value||''; | |
| try{ | |
| var r=await fetch('/api/waitlist',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({email:email,interest:interest,source:'landing'})}); | |
| var d=await r.json(); | |
| var el=document.getElementById('wl-result'); | |
| if(d.status==='ok'){ | |
| el.textContent='🎉 등록 완료! 출시 시 가장 먼저 알려드리겠습니다.';el.style.color='#6ee7b7'; | |
| document.getElementById('wl-form').style.display='none'; | |
| }else if(d.status==='already'){ | |
| el.textContent='✅ '+d.message;el.style.color='#fcd34d'; | |
| }else{ | |
| el.textContent='⚠️ '+(d.error||'오류가 발생했습니다.');el.style.color='#fca5a5'; | |
| } | |
| el.style.display='block'; | |
| }catch(e){ | |
| document.getElementById('wl-result').textContent='⚠️ 서버 연결 실패. 잠시 후 다시 시도해주세요.'; | |
| document.getElementById('wl-result').style.display='block'; | |
| } | |
| } | |
| document.getElementById('wl-email').addEventListener('keydown',function(e){if(e.key==='Enter')submitWaitlist();}); | |
| </script> | |
| <div class="sec-title">⚡ 12가지 AI 도구</div> | |
| <div class="feat-grid"> | |
| <div class="feat"><div class="feat-ic">📝</div><div><h4>요약</h4><p>현재 페이지를 3줄로 요약</p></div></div> | |
| <div class="feat"><div class="feat-ic">📸</div><div><h4>분석</h4><p>페이지 구조와 내용 심층 분석</p></div></div> | |
| <div class="feat"><div class="feat-ic">🌐</div><div><h4>번역</h4><p>다국어 번역</p></div></div> | |
| <div class="feat"><div class="feat-ic">🔍</div><div><h4>검색</h4><p>AI 기반 웹 검색</p></div></div> | |
| <div class="feat feat-hl"><div class="feat-ic">🧠</div><div><h4>딥분석 (MARL)</h4><p>메타인지 5단계 심층 조사</p></div></div> | |
| <div class="feat feat-hl"><div class="feat-ic">💡</div><div><h4>아이디어 (MARL)</h4><p>9개 전문 창발 엔진</p></div></div> | |
| <div class="feat"><div class="feat-ic">📊</div><div><h4>금융</h4><p>실시간 글로벌 시장 대시보드</p></div></div> | |
| <div class="feat"><div class="feat-ic">🔬</div><div><h4>X-Ray</h4><p>SEO · 보안 · 기술스택 분석</p></div></div> | |
| <div class="feat"><div class="feat-ic">🌤</div><div><h4>날씨</h4><p>한국 주요 도시 실시간</p></div></div> | |
| <div class="feat"><div class="feat-ic">⏱</div><div><h4>타이머</h4><p>뽀모도로 + 커스텀 시간</p></div></div> | |
| <div class="feat"><div class="feat-ic">🎨</div><div><h4>이미지 생성</h4><p>Grok Imagine AI</p></div></div> | |
| <div class="feat"><div class="feat-ic">🖌️</div><div><h4>이미지 편집</h4><p>AI 기반 이미지 편집</p></div></div> | |
| </div> | |
| <div class="sec-title">📋 SiteAgent 제품 라인업</div> | |
| <div class="tbl-wrap"><div class="tbl-card"> | |
| <p style="font-size:11px;color:var(--muted);margin-bottom:14px;line-height:1.6;"> | |
| 모든 에디션의 AI 추론 엔진은 <b style="color:#3C3489;">MARL</b>(Metacognitive Amplification & Reasoning Layer)을 탑재합니다. | |
| MARL은 하나의 LLM 호출을 <b>5단계 전문가 파이프라인</b>으로 분화시켜, AI가 스스로 의심하고 고쳐서 다시 쓰는 <b style="color:#3C3489;">메타인지 + 창발성 발현 미들웨어</b>입니다. | |
| </p> | |
| <table><thead><tr> | |
| <th style="text-align:left;width:14%;"></th> | |
| <th style="text-align:center;width:21.5%;"><span class="bg bg-free">FREE</span><br><b>북마클릿</b><br><span style="font-size:9px;color:var(--muted);">Zero-Install · 무료 공개</span></th> | |
| <th style="text-align:center;width:21.5%;"><span class="bg bg-free">FREE</span><br><b>크롬 확장</b><br><span style="font-size:9px;color:var(--muted);">브라우저 설치 · 무료 공개</span></th> | |
| <th style="text-align:center;width:21.5%;"><span class="bg bg-b2b">B2B</span><br><b>서버사이드</b><br><span style="font-size:9px;color:var(--muted);">엔터프라이즈 직접 운용</span></th> | |
| <th style="text-align:center;width:21.5%;"><span class="bg bg-b2c">B2C</span><br><b>워크시트</b><br><span style="font-size:9px;color:var(--muted);">도메인 특화 자동화</span></th> | |
| </tr></thead><tbody> | |
| <tr><td style="font-weight:600;">핵심 목적</td> | |
| <td style="text-align:center;">어디서든 즉시 AI<br><span style="font-size:10px;color:var(--muted);">드래그 한 번이면 끝</span></td> | |
| <td style="text-align:center;">올인원 AI + 자동 추적<br><span style="font-size:10px;color:var(--muted);">12가지 도구</span></td> | |
| <td style="text-align:center;">기업 사이트에 AI 삽입<br><span style="font-size:10px;color:var(--muted);">쿠팡·코레일 등 자율 에이전트</span></td> | |
| <td style="text-align:center;">시트 위 AI 자동화<br><span style="font-size:10px;color:var(--muted);">재무·세무·법률 8개 전문 탭</span></td></tr> | |
| <tr><td style="font-weight:600;">설치</td> | |
| <td style="text-align:center;" class="chk">북마크바 드래그</td> | |
| <td style="text-align:center;" class="chk">크롬 스토어 1클릭</td> | |
| <td style="text-align:center;">기업 서버에 HTML 배포</td> | |
| <td style="text-align:center;">구글 시트 열기</td></tr> | |
| <tr><td style="font-weight:600;color:#3C3489;">MARL 딥분석<br><span style="font-size:9px;color:var(--muted);">메타인지 5단계</span></td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="na">—</td></tr> | |
| <tr><td style="font-weight:600;color:#3C3489;">MARL 창발 9엔진<br><span style="font-size:9px;color:var(--muted);">전문 도메인 AI</span></td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="na">—</td> | |
| <td style="text-align:center;" class="na">—</td></tr> | |
| <tr><td style="font-weight:600;">DOM 분석·조작</td> | |
| <td style="text-align:center;">현재 페이지</td> | |
| <td style="text-align:center;font-weight:600;">크로스탭 이동</td> | |
| <td style="text-align:center;">지정 사이트</td> | |
| <td style="text-align:center;" class="na">—</td></tr> | |
| <tr><td style="font-weight:600;">AI 이미지 생성</td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="na">—</td> | |
| <td style="text-align:center;" class="na">—</td></tr> | |
| <tr><td style="font-weight:600;">금융·날씨·타이머</td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="chk">✓</td> | |
| <td style="text-align:center;" class="na">—</td> | |
| <td style="text-align:center;" class="na">—</td></tr> | |
| <tr><td style="font-weight:600;">사용자 추적·DB</td> | |
| <td style="text-align:center;" class="na">—</td> | |
| <td style="text-align:center;font-weight:600;">Gmail + DB + HF 백업</td> | |
| <td style="text-align:center;">기업 DB 연동</td> | |
| <td style="text-align:center;" class="na">—</td></tr> | |
| <tr><td style="font-weight:600;">도메인 특화</td> | |
| <td style="text-align:center;color:var(--muted);">범용</td> | |
| <td style="text-align:center;color:var(--muted);">범용</td> | |
| <td style="text-align:center;font-weight:600;">커머스·교통·고객응대</td> | |
| <td style="text-align:center;font-weight:600;">재무·세무·법률·차트·카톡</td></tr> | |
| <tr><td style="font-weight:600;">API 키</td> | |
| <td style="text-align:center;" class="chk">불필요</td> | |
| <td style="text-align:center;" class="chk">불필요</td> | |
| <td style="text-align:center;">기업 자체 키</td> | |
| <td style="text-align:center;">Groq 무료 키</td></tr> | |
| <tr><td style="font-weight:600;">대상</td> | |
| <td style="text-align:center;font-size:10px;">누구나</td> | |
| <td style="text-align:center;font-size:10px;">일반·크리에이터</td> | |
| <td style="text-align:center;font-size:10px;">기업 IT팀·SI 파트너</td> | |
| <td style="text-align:center;font-size:10px;">사무직·1인 사업자</td></tr> | |
| </tbody></table> | |
| <div class="marl-box"> | |
| <b>MARL (Metacognitive Amplification & Reasoning Layer)</b> — 하나의 LLM 호출을 <b>가설 설계 → 심층 추론 → 감사 → 적대적 검증 → 재합성</b> 5단계로 분화하는 <b>메타인지 + 창발성 발현 미들웨어</b>.<br> | |
| 어떤 LLM이든 base_url 한 줄이면 적용. <b>9개 창발 엔진</b>(발명·신약·유전체·화학·생태·법률 등 5,538개 전문 데이터) 내장.<br> | |
| FINAL Bench 실증: 메타인지 적용 시 최상위 난이도 문제에서 <b>성능 70% 이상 향상</b>, 효과의 94.8%가 자기 교정에서 발생. | |
| </div> | |
| </div></div> | |
| <div class="sec-title">🌍 글로벌 AI 에이전트 심층 비교</div> | |
| <div class="tbl-wrap"><div class="tbl-card"> | |
| <p style="font-size:11px;color:var(--muted);margin-bottom:14px;line-height:1.6;">2026년 3월 기준. 각 제품의 실제 한계점과 SiteAgent의 차별 우위를 중심으로 분석했습니다.</p> | |
| <table style="min-width:760px;"><thead><tr> | |
| <th style="text-align:left;width:16%;">비교 항목</th> | |
| <th style="text-align:center;width:14%;"><span class="bg bg-sa">SiteAgent</span><br><span style="font-size:9px;color:var(--muted);">Ginigen AI</span></th> | |
| <th style="text-align:center;width:14%;">Page Agent<br><span style="font-size:9px;color:var(--muted);">Alibaba</span></th> | |
| <th style="text-align:center;width:14%;">OpenClaw<br><span style="font-size:9px;color:var(--muted);">오픈소스</span></th> | |
| <th style="text-align:center;width:14%;">Operator<br><span style="font-size:9px;color:var(--muted);">OpenAI 종료</span></th> | |
| <th style="text-align:center;width:14%;">Gemini / Claude<br><span style="font-size:9px;color:var(--muted);">Google / Anthropic</span></th> | |
| </tr></thead><tbody> | |
| <tr><td style="font-weight:600;">가격</td> | |
| <td style="text-align:center;" class="chk"><b>완전 무료</b><br><span style="font-size:9px;color:var(--muted);">API 키 불필요</span></td> | |
| <td style="text-align:center;">무료이나<br><span style="font-size:9px;color:#e24b4a;">자체 API 키 필수</span></td> | |
| <td style="text-align:center;">무료이나<br><span style="font-size:9px;color:#e24b4a;">API 키 + 서버 운영비</span></td> | |
| <td style="text-align:center;color:#e24b4a;">$200/월<br><span style="font-size:9px;">서비스 종료</span></td> | |
| <td style="text-align:center;">$20/월~<br><span style="font-size:9px;color:var(--muted);">구독 필수</span></td></tr> | |
| <tr><td style="font-weight:600;">설치 난이도</td> | |
| <td style="text-align:center;" class="chk"><b>드래그 1회</b></td> | |
| <td style="text-align:center;">북마클릿/확장<br><span style="font-size:9px;color:#e24b4a;">API 키 설정 별도</span></td> | |
| <td style="text-align:center;color:#e24b4a;"><b>Node.js 필수</b><br><span style="font-size:9px;">터미널 숙련 필요</span></td> | |
| <td style="text-align:center;">웹 접속<br><span style="font-size:9px;color:var(--muted);">미국 한정</span></td> | |
| <td style="text-align:center;">웹 접속<br><span style="font-size:9px;color:var(--muted);">계정 필요</span></td></tr> | |
| <tr><td style="font-weight:600;">한국어 지원</td> | |
| <td style="text-align:center;" class="chk"><b>네이티브 최적화</b><br><span style="font-size:9px;color:#3C3489;">프롬프트·UI·결과 전부</span></td> | |
| <td style="text-align:center;color:#e24b4a;">영어 중심<br><span style="font-size:9px;">한국어 UI 없음</span></td> | |
| <td style="text-align:center;color:#e24b4a;">영어 전용<br><span style="font-size:9px;">한국어 문서 없음</span></td> | |
| <td style="text-align:center;color:#e24b4a;">미국 한정<br><span style="font-size:9px;">한국 서비스 불가</span></td> | |
| <td style="text-align:center;">부분 지원</td></tr> | |
| <tr><td style="font-weight:600;">패널 UI / UX</td> | |
| <td style="text-align:center;" class="chk"><b>드래그 이동 가능</b><br><span style="font-size:9px;color:#3C3489;">크기 조절·최소화·탭 전환</span></td> | |
| <td style="text-align:center;color:#e24b4a;">하단 고정 패널<br><span style="font-size:9px;">드래그 불가·위치 변경 불가</span></td> | |
| <td style="text-align:center;">메시징 앱 UI<br><span style="font-size:9px;color:var(--muted);">브라우저 내장 아님</span></td> | |
| <td style="text-align:center;">전용 브라우저 창<br><span style="font-size:9px;color:var(--muted);">내 브라우저 아님</span></td> | |
| <td style="text-align:center;">별도 웹사이트<br><span style="font-size:9px;color:var(--muted);">현재 페이지와 분리</span></td></tr> | |
| <tr><td style="font-weight:600;color:#3C3489;">MARL 메타인지<br>멀티턴 추론</td> | |
| <td style="text-align:center;"><b style="color:#3C3489;">5단계 파이프라인</b><br><span style="font-size:9px;color:#534AB7;">가설→추론→감사→검증→재합성</span></td> | |
| <td style="text-align:center;" class="na">없음 (단일 호출)</td> | |
| <td style="text-align:center;" class="na">없음 (단일 호출)</td> | |
| <td style="text-align:center;" class="na">없음 (CUA 단일)</td> | |
| <td style="text-align:center;" class="na">없음 (단일 모델)</td></tr> | |
| <tr><td style="font-weight:600;color:#3C3489;">MARL 창발 엔진</td> | |
| <td style="text-align:center;"><b style="color:#3C3489;">9개 엔진 내장</b><br><span style="font-size:9px;color:#534AB7;">발명·신약·유전체·화학·법률 등<br>5,538개 전문 데이터</span></td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;" class="na">없음</td></tr> | |
| <tr><td style="font-weight:600;">보안 안전성</td> | |
| <td style="text-align:center;" class="chk"><b>안전</b><br><span style="font-size:9px;color:var(--muted);">브라우저 DOM만 접근<br>시스템 권한 없음</span></td> | |
| <td style="text-align:center;">안전<br><span style="font-size:9px;color:var(--muted);">클라이언트 실행</span></td> | |
| <td style="text-align:center;color:#e24b4a;"><b>심각한 위험</b><br><span style="font-size:9px;">CVE 512건 (8건 치명적)<br>악성 스킬 820+건<br>MS·카스퍼스키 경고</span></td> | |
| <td style="text-align:center;">보통<br><span style="font-size:9px;color:var(--muted);">관리형</span></td> | |
| <td style="text-align:center;">보통<br><span style="font-size:9px;color:var(--muted);">클라우드 관리</span></td></tr> | |
| <tr><td style="font-weight:600;">내장 도구</td> | |
| <td style="text-align:center;" class="chk"><b>12가지 올인원</b><br><span style="font-size:9px;color:#3C3489;">딥분석·이미지·금융·X-Ray 등</span></td> | |
| <td style="text-align:center;">DOM 조작만<br><span style="font-size:9px;color:#e24b4a;">검색·이미지·금융 없음</span></td> | |
| <td style="text-align:center;">스킬 설치 필요<br><span style="font-size:9px;color:#e24b4a;">기본 내장 없음</span></td> | |
| <td style="text-align:center;">브라우저만<br><span style="font-size:9px;color:#e24b4a;">도구 없음</span></td> | |
| <td style="text-align:center;">대화만<br><span style="font-size:9px;color:#e24b4a;">페이지 조작 불가</span></td></tr> | |
| <tr><td style="font-weight:600;">이미지 생성/편집</td> | |
| <td style="text-align:center;" class="chk"><b>내장</b> (Grok Imagine)</td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;">플러그인<br><span style="font-size:9px;color:#e24b4a;">악성 스킬 위험</span></td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;">Gemini만</td></tr> | |
| <tr><td style="font-weight:600;">복잡한 웹앱 호환<br><span style="font-size:9px;color:var(--muted);">content-editable 등</span></td> | |
| <td style="text-align:center;" class="chk">호환 (JS 실행 지원)</td> | |
| <td style="text-align:center;color:#e24b4a;"><b>제한적</b><br><span style="font-size:9px;">X 포스팅 실패 확인<br>content-editable 미지원</span></td> | |
| <td style="text-align:center;">가능<br><span style="font-size:9px;color:var(--muted);">Playwright 기반</span></td> | |
| <td style="text-align:center;color:#e24b4a;">제한적<br><span style="font-size:9px;">캘린더·슬라이드 실패</span></td> | |
| <td style="text-align:center;" class="na">해당 없음</td></tr> | |
| <tr><td style="font-weight:600;">사용자 활동 추적</td> | |
| <td style="text-align:center;" class="chk"><b>내장</b> (크롬 확장)<br><span style="font-size:9px;color:#3C3489;">Gmail·DB·관리자 대시보드</span></td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;">로컬 메모리만<br><span style="font-size:9px;color:#e24b4a;">평문 저장·보안 위험</span></td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;" class="na">없음</td></tr> | |
| <tr><td style="font-weight:600;color:#3C3489;">학술적 실증</td> | |
| <td style="text-align:center;"><b style="color:#3C3489;">FINAL Bench</b><br><span style="font-size:9px;color:#534AB7;">HF 글로벌 5위 · 언론 4개사<br>SOTA 9종 1,800건 검증</span></td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;" class="na">없음</td> | |
| <td style="text-align:center;">WebArena 58.1%<br><span style="font-size:9px;color:var(--muted);">인간 수준 미달</span></td> | |
| <td style="text-align:center;" class="na">자체 벤치만</td></tr> | |
| </tbody></table> | |
| <div style="margin-top:14px;padding:14px 16px;background:var(--lp);border:1px solid rgba(88,86,214,.1);border-radius:10px;"> | |
| <p style="font-size:12px;font-weight:700;color:#3C3489;margin:0 0 8px;">SiteAgent만의 독보적 강점</p> | |
| <div style="display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:10.5px;color:#3C3489;line-height:1.7;"> | |
| <div> | |
| <b>1. MARL 메타인지 미들웨어</b> — 유일하게 5단계 자기교정 추론 탑재. 최상위 난이도 70%+ 성능 향상<br> | |
| <b>2. 완전 무료 + Zero-Install</b> — API 키·구독·서버 불필요. 드래그 한 번이면 즉시 사용<br> | |
| <b>3. 한국어 네이티브</b> — 프롬프트·UI·결과 전체 한국어 최적화 | |
| </div> | |
| <div> | |
| <b>4. 12가지 올인원 도구</b> — 딥분석·이미지·금융·X-Ray 등 경쟁사에 없는 도구<br> | |
| <b>5. 안전한 아키텍처</b> — 브라우저 DOM만 접근. OpenClaw처럼 시스템 권한 노출 없음<br> | |
| <b>6. FINAL Bench 실증</b> — 세계 최초 AI 메타인지 벤치마크로 기술력 검증 | |
| </div> | |
| </div> | |
| </div> | |
| <div class="tbl-note">OpenClaw 보안 출처: Microsoft·Kaspersky·CrowdStrike·Dark Reading (2026.02) · Operator 2025.8 종료 → ChatGPT Agent 통합 · PageAgent 한계: GIGAZINE 리뷰 (2026.03)</div> | |
| </div></div> | |
| <div class="footer"> | |
| <p style="margin-bottom:6px;"><strong>Ginigen AI (지니젠AI)</strong> · 서울 강남구 · <a href="/privacy">개인정보처리방침</a></p> | |
| <p>FINAL Bench 글로벌 5위 · HF Star AI Top 12 · 월 100만 Active Users</p> | |
| <p style="margin-top:8px;">© 2025–2026 Ginigen AI. All rights reserved.</p> | |
| </div> | |
| </body> | |
| </html> |