피그마 MCP 활용한 디자인 생성 테스트

소개

Figma MCP가 최근에 이슈가 되었는데 알고보니 MCP를 통해 피그마에서 작업한 컴포넌트를 코드로 쉽게 변경이 가능한게 이유더라구요. 그런데 이건 캡쳐한 이미지로 예전부터 가능했고 제가 궁금한건 프롬프트를 통해 피그마에서 디자인 생성이 가능한가였습니다.

그래서 최근에 Figma MCP 관련 정보를 찾다가 아래에 Cursor Talk to Figma MCP를 찾았는데 사용한 후기를 정리하겠습니다.

https://github.com/sonnylazuardi/cursor-talk-to-figma-mcp

진행 방법

저장소에 있는 설명대로 Cursor에서 설정을 하고 아래 이미지 왼쪽에 있는 와이어프레임을 Shadcn UI 라이브러리 스타일로 디자인해달라고 요청을 했습니다.

결과와 배운 점

화면에 로고가있는 모바일 앱

결과는 좀 아쉬운데요.

  • 와이어프레임에서는 소셜 로그인인데 단순 이메일 로그인으로 디자인

  • 요소들이 중앙정렬도 되어 있지않음

  • 피그마 레이어에서도 요소들이 그룹화가 전혀 되어있지않음

저장소에 있는 문서를 읽어보다가 어느 정도 납득이 되었는데요. 제공하는 MCP Tools가 아주 기초적인 기능밖에 없어서 정상적으로 디자인이 되지않았더군요. 추후에 Tools에 추가적인 기능들 예를 들어 정렬, 요소 구조화, props 등 기능이 추가되면 퀄리티가 좋아지지않을까 생각중입니다.

3
1개의 답글

👉 이 게시글도 읽어보세요