agentlas
Marketplace
Team10 credits

Visual HTML Studio

by Lucia Ito

초안이나 데이터, 발표 주제만 주세요. 영문 피치덱이나 핸드북, 리포트, 인포그래픽을 브라우저에서 바로 도는 고급 HTML 한 벌로 뽑아드려요. 좋은 레퍼런스의 구조만 분석하고, 쓸 수 있는 이미지와 폰트, 차트를 합법적으로 정리해서 디자인을 짜고, 데스크탑부터 모바일과 PDF까지 깨지는 데 없는지 다 확인하고 넘겨요.

The team

One lead + 10 specialists

스튜디오 총괄프로젝트 총괄·대화 담당기억 담당기준·검증 담당레퍼런스 조사 담당에셋 정리 담당레이아웃 설계 담당아트 디렉션 담당데이터 시각화 담당HTML 렌더링 담당최종 품질 검수 담당
The members

Who does what

HQ스튜디오 총괄

요청을 받아 어떤 형태로 만들지 정하고, 조사와 디자인, 렌더링, 검수 본부에 일을 나눠 보낸 뒤 최종 파일과 출처 기록, 남은 문제를 모아 돌려줘요.

1프로젝트 총괄·대화 담당

누가 읽는 자료인지, 무슨 결정을 끌어내야 하는지 잡아서 막연한 요청을 이야기 흐름과 합격 기준으로 바꿔놔요.

Produces · 대상 독자와 목적 정의, 슬라이드·섹션 흐름, 통과 기준 목록
2기억 담당

한 번 정한 톤이나 디자인 규칙을 기억해서 다음 작업에 다시 살리고, 민감한 초안이나 권리 없는 자료는 기억에서 걸러내요.

Produces · 재사용할 결정 기록, 걸러낸 항목 사유
3기준·검증 담당

이미지와 폰트, 로고, 차트가 써도 되는 것인지 출처를 따지고, 상업 자료를 그대로 베끼는 일과 무단 공개를 막아요.

Produces · 사용 가능·차단 자산 판정, 필수 출처 표기, 공개 전 위험 점검
4레퍼런스 조사 담당

좋은 덱이나 리포트, 핸드북을 찾아 격자, 위계, 여백, 차트 다루는 방식 같은 구조만 뽑아내고 이미지는 베끼지 않아요.

Produces · 참고 출처와 점검 날짜, 구조 패턴 분석 노트
5에셋 정리 담당

내가 가진 자료나 무료·오픈 라이선스 자산, 직접 만든 그래픽을 모아 출처와 라이선스를 적은 목록으로 정리하고, 마땅한 게 없으면 코드로 그려요.

Produces · 출처·라이선스 적힌 에셋 목록, 코드로 만든 그래픽 자산
6레이아웃 설계 담당

색과 글자 크기, 간격, 격자를 디자인 토큰으로 묶고 자료 성격에 맞는 레이아웃 틀을 골라 화면 크기마다 어떻게 흐를지 정해요.

Produces · 디자인 토큰과 격자 규칙, 레이아웃 구성 세트, 인쇄·반응형 규칙
7아트 디렉션 담당

투자자용인지 연구소용인지 잡지풍인지 무드를 정하고, 표지와 페이지 리듬, 강조 순간을 짜서 흔한 템플릿 느낌을 걷어내요.

Produces · 비주얼 무드와 방향, 표지·페이지 리듬, 피할 시각 클리셰 목록
8데이터 시각화 담당

숫자와 흐름, 비교를 차트나 표, 다이어그램, 타임라인으로 풀되 단위와 기간, 출처를 늘 보이게 두고 오해를 주는 눈금은 막아요.

Produces · 차트·도표 설계, 단위·출처 라벨, 대체 텍스트와 표 백업
9HTML 렌더링 담당

정해진 디자인을 실제 HTML과 CSS로 구현하고 버튼이나 카드, 슬라이드에서 글자가 삐져나오지 않게, 인쇄와 PDF에서도 멀쩡하게 만들어요.

Produces · 완성된 HTML 파일 한 벌, 재사용 컴포넌트, 구현 메모
10최종 품질 검수 담당

브라우저에서 직접 열어 데스크탑과 모바일, 인쇄 화면이 빈 화면이나 잘림, 색 대비 문제 없이 도는지 확인하고 통과 증거를 남겨요.

Produces · 화면별 점검 리포트, 고쳐야 할 항목, 남은 위험 메모
How they work

How work flows

스튜디오 총괄프로젝트 총괄·대화 담당요청을 받아 어떤 자료를 누구에게 줄지 정하고 흐름과 합격 기준을 잡아요.
프로젝트 총괄·대화 담당기준·검증 담당쓰려는 이미지와 폰트, 레퍼런스가 권리상 괜찮은지 먼저 확인해요.
기준·검증 담당레퍼런스 조사 담당베끼지 않고 참고할 좋은 자료의 구조를 뽑아와요.
레퍼런스 조사 담당에셋 정리 담당쓸 수 있는 이미지와 폰트, 그래픽을 출처와 함께 모아요.
에셋 정리 담당디자인 본부(레이아웃·아트·데이터)디자인 토큰과 무드, 차트 설계를 한 벌로 맞춰요.
디자인 본부(레이아웃·아트·데이터)HTML 렌더링 담당정해진 디자인을 실제로 도는 HTML로 구현해요.
HTML 렌더링 담당최종 품질 검수 담당데스크탑과 모바일, PDF에서 깨지는 데가 없는지 확인하고 통과시켜요.
최종 품질 검수 담당스튜디오 총괄완성 파일과 출처 기록, QA 결과, 남은 문제를 모아 돌려줘요.
Best for

What it's good for

투자자용 영문 피치덱을 디자인 외주 없이 빠르게 뽑고 싶은 창업자
텍스트만 잔뜩인 핸드북이나 리포트를 보기 좋은 웹 문서로 바꾸고 싶은 사람
숫자와 차트가 많은 자료를 신뢰감 있게 시각화하고 싶은 기획자
What's inside

What's in this agent

11 agents2 memory1 command
Outputs

What it produces

바로 열리는 HTML 파일 한 벌 (단일 파일 또는 index.html 폴더)
쓴 이미지와 폰트, 차트의 출처와 라이선스를 적은 에셋 목록
참고한 레퍼런스 출처와 점검 날짜를 적은 소스 기록
데스크탑과 모바일, 인쇄 화면을 확인한 QA 리포트와 남은 위험 메모
Prerequisites

Before you start

담을 내용 초안이나 개요, 또는 만들 주제 한 줄
넣고 싶은 이미지나 폰트, 로고가 있다면 내가 권리를 가졌는지 여부
원하는 형태(피치덱, 핸드북, 리포트, 인포그래픽)와 내보낼 방식(HTML이나 PDF)
Safety

What it can touch

Where a human approves
외부 이미지·폰트·로고를 쓰기 전 권리 확인
외부 공개나 브랜드 자산 사용 전 사람 승인
완성 전 데스크탑·모바일·PDF 품질 검수
Cost guardrails
권리 없는 자산은 안 넣고, 마땅한 게 없으면 코드로 그린 그래픽으로 대체해요
라이선스가 재배포를 허용하지 않는 다운로드 자산은 패키지에 담지 않아요
Access
Files: scoped
Network: none
External API: yes
Be careful with
외부 이미지나 폰트, 로고는 권리가 확인돼야 넣어요. 검색 결과나 상업 자료를 그대로 긁어 박지 않아요
유명 덱이나 연차보고서를 똑같이 복제하는 건 막아요. 구조만 참고하고 디자인은 새로 짜요
외부에 공개하거나 브랜드 자산을 쓰는 단계는 게시 전에 사람 확인을 받아요
Safety

Inspect everything before it runs

A security scan runs before publish or install, and Agentlas never hosts or proxies models — it runs on your own account and keys.