메인 콘텐츠로 건너뛰기
Flowstep은 Model Context Protocol을 통해 설계 도구를 노출하여 AI 어시스턴트가 편집기를 떠나지 않고 UI 화면을 생성하고 반복할 수 있습니다. 서버는 https://api.flowstep.ai/mcp에서 호스팅됩니다(Streamable HTTP 전송). 실행할 로컬 프로세스가 없습니다.

수행할 수 있는 작업

서버는 6개 카테고리에 걸쳐 19개의 도구를 노출합니다:

일반적인 사용 사례

프롬프트에서 화면 생성 — 설명과 함께 create-new-design을 호출합니다. Flowstep은 파일과 화면을 한 번에 만듭니다. 반환된 screenIdsget-screen-image를 호출하여 결과를 인라인으로 봅니다. React 컴포넌트 시각화upload-attachment를 통해 .jsx 또는 .tsx 파일을 업로드합니다(mimeType: text/javascript 사용). 반환된 첨부 파일을 컴포넌트를 설명하는 메시지와 함께 create-new-design에 전달합니다. Flowstep은 소스를 읽고 일치하는 설계 화면을 생성합니다. 설계에서 반복 — 대상 screenId와 수정 지침으로 edit-design을 호출하거나, regenerate-design으로 화면을 처음부터 다시 만듭니다. 디자인 가이드라인 유지get-design-guidelines을 호출하여 현재 스타일 규칙(색, 타이포그래피, 간격, 톤)을 검색한 후 update-design-guidelines을 사용하여 설계가 진화할 때 동기화 상태를 유지합니다. 일관된 가이드라인을 create-new-design 또는 edit-design에 전달하면 생성된 모든 화면이 브랜드에 맞게 유지됩니다. delete-design-guidelines을 사용하여 완전히 초기화합니다. 할당량 감사 — 생성 배치를 시작하기 전에 get-plan-details를 호출하여 남은 일일 및 월간 사용량을 확인합니다.

엔드포인트

전송: Streamable HTTP. 세션 모델: 상태 비저장(각 요청은 독립적이며 세션 ID 없음).

다음 단계

빠른 시작

Cursor를 사용하여 5분 이내에 첫 도구 호출을 수행합니다.

인증

OAuth 2.1 PKCE 작동 방식 및 토큰 발급 방법입니다.

도구

모든 19개 도구에 대한 전체 입력/출력 참조입니다.

예제

일반적인 작업에 대한 엔드-투-엔드 워크플로입니다.