Figma
Adobe XD
Blog
Frontier – 각각의 프런트엔드 코드에 최적화된 AI 코드 생성기1 min read
Reading Time: 3 minutes생성형 AI가 언제나 우리의 의도를 즉각적으로 이해해 준다면 얼마나 좋을까요? 대다수의 경우 생성형 AI는 맡은 업무를 잘 수행해 줍니다. 이 기술이 최소한의 정보를 가지고 우리가 원하는 바를 제공해 줄 때, 이는 감동적이기까지 합니다.
Anima의 목표는 프런트엔드 엔지니어링을 자동화하여 인간이 시간을 낭비하지 않도록 하는 것입니다. 2023년 Anima의 AI는 5만 개 이상의 코드 스니펫을 생산하여 1,000년의 코딩 시간을 절약했습니다. Anima는 Figma의 플랫폼에 100만 개 이상 설치되어 디자인투코드 공간을 선도하고 있습니다.
이제, 우리는 일상적인 프런트엔드 코딩의 자동화의 발전의 길을 선두합니다.
오늘날의 거대 언어 모델 (LLM)은 프런트엔드 UI를 이해하지 못합니다
코드 생성 주변에는 코드 완성부터 명령어까지 다양한 모델이 있습니다. 이러한 코드 모델은 더 빠른 코딩을 도와주는 코딩 어시스턴트인 Copilot을 기반으로 합니다.
그러나 우리는 프런트엔드 자동화에는 현존하는 기술과 가능한 기술 사이에 큰 격차가 있다고 생각합니다. 우리의 목표는 Anima의 역량과 프런트엔드 자동화에 대한 이해를 통해 이 격차를 해결하는 것입니다.
오늘, 프런트엔드 개발자를 위한 AI 코딩 어시스턴트인 Frontier를 여러분께 선보입니다.
Frontier – 각각의 프런트엔드 코드에 최적화된 AI 코드 생성기
Anima Frontier는 통합 개발 환경(IDE)입니다.
먼저 Frontier는 전체 코드 베이스를 분석하여 코드 설계 시스템, 프레임워크, 규칙 및 구성 요소를 매핑합니다. 이 절차는 단 몇 초가 걸리고 코드가 안전한 로컬 환경에서 수행됩니다.
둘째, Anima의 최첨단 디자인투코드 엔진을 사용하여 Frontier는 귀하의 디자인을 분석하고 디자인 버전과 디자인 시스템의 코드를 신속하게 학습합니다.
마지막으로, VS 코드 안에 있는 Figma 디자인의 부분을 선택하면 해당 부분에 대한 코드를 코드를 얻을 수 있습니다. 마법 같지요?
디자인 시스템 자동화의 증가
완성된 프로젝트에는 수백, 수천 개의 구성 요소가 있습니다.
디자인 시스템 거버넌스 및 채택은 이러한 프로젝트를 유지하는 데 중요한 어려운 작업입니다. 이에 대한 해답을 코드 자동화가 제시합니다.
AI 보안과 가드레일
애초부터 Frontier는 엔터프라이즈급 보안 솔루션을 제공하기 위해 구축되었습니다.
일반적인 개인 정보 보호 문제로 인해 많은 엔터프라이즈급 회사들은 AI를 채택하는 것을 망설입니다.
- 전송 보안: 어떻게 하면 거대 언어 모델 (LLM)의 학습 과정에서 코드가 타 회사로 유출되지 않도록 할 수 있을까요?
- 수신 보안: 어떻게 하면 거대 언어 모델 (LLM)에 의하여 조정되거나 훈련되었을 수 있는 다른 회사의 기존 코드가 유입되지 않도록 보장하여 보안 및 잠재적인 저작권 문제를 예방할 수 있을까요?
코드 베이스를 중심으로 거대 언어 모델 (LLM)을 훈련하면 Figma 디자인에 대한 Anima의 해석과 사용자의 코드 베이스에 있는 구성 요소를 사용하는 코드를 보다 쉽게 생성할 수 있습니다. 그러나 거대 언어 모델 (LLM)에 개별 사용자 혹은 기업 소유의 코드를 업로드하여 거대 언어 모델 (LLM)을 훈련시키는 것은 심각한 개인 정보 보호 및 보안 문제를 야기합니다. 특히 엔터프라이즈 환경의 개발자에게 보안과 개인 정보 보호가 매우 중요합니다. 따라서 우리는 코드를 로컬에서 처리하는 방향을 택했습니다.
저희는 코드를 클라우드에 업로드하는 대신 VS 코드 내부에 로컬로 데이터 수집, 인덱싱 및 ML 모델을 하는 시스템을 구현했습니다. 이 시스템은 개발자의 컴퓨터에서 관련 코드를 식별하고 인덱싱합니다. 수집된 정보는 코드 베이스의 일부로 로컬에 저장되므로 클라우드가 아닌 깃을 통해 팀 내에서 안전하게 공유할 수 있습니다. 특정 구성 요소를 인스턴스화해야 하는 경우 상당한 양의 전처리를 로컬에서 수행하고 거대 언어 모델 (LLM)에 필요한 극소량의 코드와 정보만 클라우드로 보낼 수 있으며, 이는 기업이 전송과 수신 보안의 위험에 노출되지 않습니다. 이러한 시스템은 대부분의 작업을 개발자의 컴퓨터에서 수행하기 때문에 신속하게 정보가 처리되는 성능의 이점이 있습니다.
Frontier – 거대 언어 모델 (LLM), ML, AI 아키텍쳐
Anima Frontier는 이 분야에서 가장 발전된 기술을 활용한 Anima의 방대한 경험을 바탕으로 AI로 프런트엔드를 자동화하고 있습니다.
우리는 종종 99%가 거대 언어 모델 (LLM)에 의해 구동되고 30%의 경우 놀라운 결과를 가져오는 인상적인 취미 프로젝트를 발견합니다. 멋진 프로젝트이지만, 프로페셔널에게 적합하지는 않습니다.
거대 언어 모델 (LLM)은 강력한 기술로 기술 전반에 새로운 문을 열어줍니다. 하지만 거대 언어 모델 (LLM)은 지원 환경이 필요합니다. Anima는 작업에 적합한 도구를 선택하여 테스트하고 벤치마킹합니다. 거대 언어 모델 (LLM)의 경우, 컨텍스트를 제공하고 결과를 검증하며 디자인이 의도된 대로 펼쳐질 수 있도록 합니다.
이 복잡한 문제를 해결하기 위해 우리는 이를 수십 개의 작은 문제와 요구 사항으로 나누었습니다. 일부 문제는 창의력이 필요하고 거대 언어 모델 (LLM)으로 가장 잘 해결되며, 특정 모델은 다른 문제보다 빠르고 성능이 좋습니다. 이러한 문제 중 일부는 고전적인 기계 학습 / 컴퓨터 비전 문제, 즉 생성이 아닌 분류가 필요합니다. 일부는 휴리스틱으로 가장 잘 해결됩니다.
각 문제에 대해 최고 수준의 솔루션을 결합하면 거대 언어 모델 (LLM) 기반 코드 솔루션에서 흔히 발견되는 거대 언어 모델 (LLM) 환각의 위험을 최소화하면서 탁월한 결과를 얻을 수 있습니다.
Frontier의 미래
Frontier는 AI를 이용하여 개발자가 프런트엔드 코딩을 더 신속하게 할 수 있게 하는 기술 발전 과정의 시작일 뿐입니다. Anima Frontier는 디자인 업데이트에 맞추어 코드를 변경하고, 코드 에러를 고치고, 상태와 테마를 이해하고, 요소를 정확하게 식별하고, 사양을 읽는 등 인간 개발자처럼 생각할 수 있어야 합니다.
Frontier는 매우 다양한 기능을 가지고 있습니다. 무엇이 가장 불편한지, 그리고 오늘날 AI가 프런트엔드 개발자에게 요구하는 사항은 무엇인지 알려주십시오.
