복잡한 질문을 구조화된 웹페이지로 답변하는 에이전트 스킬
QingYunA/answer-me-with-html
GitHub복잡한 질문을 던지면 단순 텍스트가 아닌 다이어그램, 시퀀스 다이어그램 등 전문적인 정보가 담긴 구조화된 웹페이지로 답변해 주는 에이전트 스킬입니다.
복잡한 개념을 단순 텍스트가 아닌 다이어그램이나 비교표 같은 구조화된 웹페이지로 받아볼 수 있어 이해하기 쉽고, 정보 습득 시간이 단축돼요.
- 모델에게 모든 HTML 코드를 직접 작성하게 하는 대신 콘텐츠만 생성하여 출력 토큰을 획기적으로 줄이고 결과 페이지 생성 시간을 크게 단축했습니다.
- 네트워크 프로토콜이나 시스템 아키텍처 같은 복잡한 개념을 요청하면, 순서도, 비교표, 타임라인 등 직관적이고 전문적인 시각 자료로 즉시 이해할 수 있습니다.
- 에이전트 플러그인 형태로 작동하며, 토큰 비용 절감보다는 긴 설명을 기다리느라 지치는 시간적 효율성을 극대화하는 것이 가장 큰 장점입니다.
본 스킬은 복잡한 개념에 대해 단순 텍스트 대신 다이어그램, 시퀀스 다이어그램 등 전문적인 정보가 담긴 구조화된 웹페이지를 생성하는 기능입니다. 모델에게 모든 HTML 코드를 직접 작성하게 하는 방식과 비교했을 때, 이 스킬은 콘텐츠만 작성하여 출력 을 크게 줄이고 결과 페이지 생성 시간을 단축합니다. 예를 들어, 특정 주제에 대한 질문 시 직접 HTML을 요청할 경우 평균 6,873개의 출력 토큰이 필요하고 46초가 소요되는 반면, 본 스킬 사용 시에는 923개로 감소하며 13초 만에 결과물을 얻을 수 있습니다.
질문 내용에 따라 다양한 형태의 전문적인 시각 자료를 제공합니다. 예를 들어, 'TCP 세 단계 핸드셰이크'와 같은 네트워크 프로토콜 질문에는 순서도나 상태 다이어그램이 생성되며, 시스템 아키텍처 관련 질문에는 폴더 트리나 콜 그래프가 제시됩니다. 또한, 비교 분석을 요청하면 체크 표시(✓)와 엑스표(✗)를 사용한 비교표와 최종 결론을 포함하여 답변합니다.
고급 기능으로는 설명 비디오 생성과 '항상 켜기 모드'가 있습니다. 특정 주제에 대해 "3Blue1Brown 스타일의 영상" 생성을 요청할 수 있으며, 에이전트는 이 경우 나레이션과 함께 단계별 다이어그램을 포함한 플레이어 페이지를 만듭니다. 또한, 항상 켜기 모드를 활성화하면 결론, 요약, 계획 등 중요한 내용이 나올 때마다 별도의 페이지를 자동으로 생성하여 사용자가 놓치지 않도록 합니다.
용어 풀이
- 에이전트
- 목표를 받으면 스스로 계획을 세우고 도구를 써서 여러 단계의 작업을 해내는 AI.
- 토큰
- AI 모델이 글을 처리하는 단위. 단어보다 작은 조각이며 사용량과 요금을 셀 때 기준이 돼요.
일반적인 HTML 요청과 비교했을 때 어떤 효율성이 있나요?
모델에게 모든 HTML 코드를 직접 작성하게 하는 방식 대신 콘텐츠만 생성하여 출력 토큰을 크게 줄이고 결과 페이지를 더 빠르게 만들 수 있어요. 예를 들어, 기존 방식은 6,873개 토큰에 46초가 걸렸지만, 이 스킬을 사용하면 923개 토큰으로 13초 만에 결과를 얻을 수 있습니다.
어떤 종류의 전문적인 시각 자료를 제공할 수 있나요?
질문 내용에 따라 다양한 형태의 시각 자료가 생성돼요. 네트워크 프로토콜 관련 질문에는 순서도나 상태 다이어그램이, 시스템 아키텍처 관련 질문에는 폴더 트리나 콜 그래프가 제시됩니다. 비교 분석을 요청하면 체크 표시와 엑스표를 사용한 비교표도 제공해요.
이 에이전트의 고급 기능에는 무엇이 있나요?
'3Blue1Brown 스타일의 영상' 생성을 요청하면 나레이션과 단계별 다이어그램을 포함한 플레이어 페이지를 만들 수 있어요. 또한, '항상 켜기 모드'를 활성화하면 결론이나 요약 등 중요한 내용이 나올 때마다 별도의 페이지가 자동으로 생성되어 사용자가 놓치지 않도록 도와줍니다.