메인 콘텐츠로 건너뛰기
page thumbnail

Google Antigravity로 만든 항공편 추적 앱, 개발 흐름은 어떻게 달라질까?

DODOSEE
DODOSEE
조회수 1,165
요약

클립으로 정리됨 (생성형 AI 활용)

출처 및 참고 : https://www.youtube.com/watch?v=nTOVIGsqCuY

Generated imageGoogle DeepMind의 Google Antigravity는 코드 에디터, 에이전트 오케스트레이션, 브라우저를 하나로 묶은 개발용 도구입니다. 영상에서는 이 도구만으로 항공편을 조회하고 Google 캘린더에 추가하는 Next.js 웹 앱을 몇 분 만에 만드는 과정을 보여줍니다.

아래에서는 Antigravity의 화면 구성, 에이전트 동작 방식, 아티팩트 구조, 브라우저 통합, 실제 예제(항공편 조회 앱)까지 한 번에 정리합니다. 도구 소개 수준을 넘어, "실제 개발 시 어떤 식으로 일하게 되는지" 흐름 중심으로 재구성했습니다.

Google Antigravity 핵심 개념 한 번에 이해하기

Google Antigravity는 개발자가 쓸 수 있는 AI 보조 개발 환경입니다. 특징은 세 가지 기능을 하나의 제품 안에 통합했다는 점입니다.

먼저, Agent Manager가 있습니다. 여러 워크스페이스에 걸쳐 다양한 에이전트를 만들고 관리하는 곳으로, 전체 작업 현황을 한꺼번에 보는 허브 역할을 합니다. 윈도우는 하나지만, 그 안에서 여러 작업과 대화를 동시에 다룹니다.

두 번째는 Editor입니다. 여기서는 일반 IDE처럼 탭, 자동완성, 사이드바, 코드 편집 기능을 제공합니다. 에이전트가 해둔 작업을 이어받아 마지막 10%를 직접 손보거나, 에이전트에게 세밀한 수정을 요청하는 용도로 쓰입니다.

세 번째는 Browser 통합 기능입니다. Chrome 안에 에이전트가 직접 들어오는 구조입니다. 에이전트가 "브라우저를 띄워 기능을 테스트해야 한다"고 판단하면, 실제 화면에서 클릭과 스크롤을 수행하며 애플리케이션을 검증합니다. 이 덕분에 코드뿐 아니라, 실제 동작 화면에 대한 컨텍스트까지 에이전트가 함께 이해합니다.

이 세 가지가 연결되면서, 개발자는 "에이전트에게 큰 단위를 맡기고, 중요한 순간에만 개입하는" 방식으로 작업 흐름을 구성할 수 있습니다.

첫 실행과 온보딩: 작업 공간부터 설정하기

Antigravity를 처음 실행하면 간단한 온보딩 절차부터 시작합니다. 테마 선택(영상에서는 라이트 모드 선택) 후, 일반 Gmail 계정으로 Google 로그인을 통해 바로 진입합니다.

온보딩에서 강조하는 것은 앞서 말한 세 가지 작업 표면입니다.

  • Agent Manager: 에이전트 생성·관리

  • Editor: 코드 편집 및 상세 제어

  • Browser: 실제 웹 앱 테스트

로그인 후에는 왼쪽 사이드바에서 새 워크스페이스를 추가합니다. 영상에서는 SSH 대신 로컬 디렉터리를 선택했고, 새 폴더 이름을 "flight tracker"로 만들었습니다.

이 워크스페이스 안에서 만들 프로젝트의 요구사항을 자연어로 한 번에 적어줍니다. 예제 프롬프트의 핵심은 다음과 같습니다(의미만 정리합니다).

  • Next.js 기반 항공편 조회 웹 앱 생성

  • 사용자가 항공편 번호를 입력

  • 결과로 출발/도착 시간, 시간대, 출발지, 도착지 제공

  • 처음에는 목업 API 사용, 여러 항공편 후보 리스트 반환

  • 검색 결과는 입력 폼 아래에 표시

이 텍스트를 Agent에게 전달하면, 이 시점부터 Antigravity가 본격적으로 프로젝트를 구성하기 시작합니다.

에이전트 모드와 아티팩트: 작업 방식이 바뀌는 지점

영상에서는 Antigravity의 Agent Assisted Development 모드를 사용합니다. 이 모드는 에이전트가 작업의 난이도에 따라 "혼자 처리할지, 사용자에게 도움을 요청할지"를 스스로 판단합니다.

  • 단순한 작업: 에이전트가 바로 실행하고 결과만 알려줍니다.

  • 복잡하거나 애매한 작업: "이 부분은 코드베이스를 더 설명해달라"는 식으로 질문을 던지고, 답변을 반영해 다시 실행합니다.

자동 모드를 택했기 때문에, 에이전트는 터미널 명령도 승인 없이 실행할 수 있습니다. 예제에서는 create next app을 알아서 실행해 프로젝트 구조를 만들었습니다. 다만, 더 민감하거나 파괴적일 수 있는 명령이라면 사용자에게 승인·거부를 요청해 신뢰를 쌓는 방식입니다.

이 과정에서 중요한 개념이 바로 Artifacts(아티팩트)입니다. 오른쪽 사이드바에서 확인할 수 있으며, 에이전트가 자신의 진행 상황과 조사 결과를 기록하는 Markdown 파일들입니다. Antigravity는 기본적으로 세 가지 아티팩트를 사용합니다.

  • Task List: 현재 어떤 작업을 진행 중인지,# Google Antigravity로 만든 항공편 추적 앱, 개발 흐름# Google Antigravity로 만든 항공편 추적 앱, 개발 흐름 녹화해 화면 녹화와 스크린샷을 Walkthrough 아티팩트에 첨부

사용자는 Walkthrough에서 어떤 기능을 구현했는지, 그리고 어떤 방식으로 결과를 검증했는지 한 눈에 확인할 수 있습니다. 이렇게 테스트까지 자동으로 진행되기 때문에, "코드 작성 → 브라우저 전환 → 수동 테스트"라는 반복 작업이 상당 부분 줄어듭니다.

병렬 작업과 이미지 생성: 에이전트를 여러 개 두고 일하는 방식

홈 화면(인박스)은 여러 에이전트를 동시에 관리하는 허브입니다. 여기서 새로운 대화를 열고 여러 작업을 병렬로 수행할 수 있습니다.

예제에서는 두 가지 작업을 동시에 진행했습니다.

  1. 항공편 데이터 실제 API 조사

  • 목표: Mock 데이터 대신 실시간 항공편 정보를 쓰기 위해 Aviationstack API 조사

  • 프롬프트에는 이미 가지고 있는 API 키와 함께, curl로 테스트할 수 있도록 문서를 탐색해 달라는 요청이 포함됐습니다.

  • 에이전트는 Google 검색으로 해당 API의 공식 문서 URL을 찾고, 문서를 읽어 가능한 기능과 반환 데이터 구조를 정리했습니다.

  • 제공된 API 키를 사용해 실제 curl을 실행하고 샘플 데이터를 받아, 정보의 정확도를 높였습니다.

  • 결과는 별도의 연구 아티팩트로 작성되어, 어떤 데이터를 받을 수 있는지 정리되었습니다.

  1. 앱 로고 및 파비콘 디자인

  • 목표: Flight Tracker 앱에 쓸 로고와 파비콘 디자인

  • Google DeepMind 생태계에 있는 Nano Banana를 포함한 최신 이미지 생성 모델을 Antigravity 내부에서 바로 사용할 수 있습니다.

  • 에이전트에게 "미니멀한 버전, 클래식 버전, 달력 느낌이 명확한 버전 등 여러 로고 시안"을 요청했고, 이를 파비콘 용도로 쓰겠다고 알려줍니다.

  • 에이전트는 총 네 가지 스타일의 로고를 생성했습니다.

  • 사용자는 이 중 클래식 항공 스타일 로고를 선택해, 파비콘으로 적용해달라고 추가 요청했습니다. 동시에 사이트 타이틀도 새 이름에 맞게 수정해 달라고 부탁했습니다.

여기서 흥미로운 점은, 이 요청이 Pending Comment 형태로 전달된다는 점입니다. 에이전트는 본인 작업의 적절한 지점에서 이 코멘트를 반영합니다. 사용자는 에이전트를 계속 지켜볼 필요 없이, 할 일을 맡겨두고 나중에 결과만 확인하면 됩니다.

이 사이에 진행되던 Aviationstack API 조사 작업도 완료되어, 관련 아티팩트가 생성됩니다. 사용자는 그 내용을 훑어보고, 문장에 코멘트를 달며 추가 지시를 내립니다. 예를 들면 다음과 같은 식입니다.

  • ".env.local에 넣어둔 키를 사용해 달라"

  • "라우트 파일은 아직 바꾸지 말고 util 폴더에만 구현해 달라"

이 코멘트 이후 에이전트가 util 폴더에 aviationstack.ts 파일을 생성하고, 앞서 수집한 API 정보를 활용해 실제 호출 코드를 작성합니다.

Mock 데이터에서 실시간 API, 그리고 Google 캘린더 연동까지

실제 API 유틸이 준비되면, 이제 개발자가 에디터로 직접 들어가 UI를 마무리합니다.

먼저, 라우트 파일에서 초기 생성 시 사용하던 Mock Flight 데이터 로직을 삭제합니다. Editor는 이를 인지하고, 자동완성 제안으로 "Mock 데이터 대신 새 Aviationstack 유틸을 사용하는 코드"를 제공합니다. 탭 키로 이를 받아들이면 import까지 자동으로 추가됩니다.

다음으로, UI가 참조하는 데이터 타입을 모두 새 API 스키마에 맞게 바꿉니다.

  • 기존: flight라는 Mock용 타입

  • 변경: 실제 API에서 사용하는 AviationstackFlightData 타입

에이전트는 코드베이스 전체와 앞서 수집한 인터넷 문서 내용을 모두 알고 있기 때문에, 자동완성 제안을 통해 UI 곳곳의 타입 사용을 점진적으로 교체할 수 있습니다. 사용자 입장에서는 탭 키를 여러 번 눌러 제안을 수용하는 방식으로 마이그레이션을 완료합니다.

이제 브라우저에서 실시간 데이터가 제대로 들어오는지 확인합니다. 영상에서는 American Airlines Flight 100을 조회했을 때, JFK 출발 → Heathrow 도착 정보가 올바르게 표시되는 것을 확인했습니다.

여기에 마지막 기능으로, 각 항공편 결과를 클릭하면 Google 캘린더에서 새 일정 생성 페이지가 열리도록 요청합니다. 에이전트에게는 다음과 같은 요구사항이 전달됩니다.

  • 각 항공편 카드 전체를 클릭 가능하게 만들 것

  • 클릭 시 해당 항공편의 시간·위치 정보를 포함한 Google 캘린더 링크 열기

  • 브라우저를 통해 기능을 테스트하고, 완료 후 Walkthrough를 제공할 것

에이전트는 이 작업 역시 여러 단계로 나눠 처리합니다.

  • 클릭 가능한 요소를 파악하고 필요한 코드 수정

  • Google Calendar 링크 형식에 맞춰 URL 구성

  • 브라우저를 열어 American Airlines Flight 100으로 테스트

  • 파란 테두리가 보이는 동안 브라우저는 에이전트 제어 상태이며, 커서를 움직여 클릭 후 실제로 캘린더 이벤트 생성 화면이 뜨는지 확인합니다.

  • 이후 Walkthrough 아티팩트를 통해 구현 내용과 검증 과정을 정리합니다.

사용자는 다시 브라우저로 돌아가 같은 항공편 번호를 입력하고, 결과 카드 클릭 시 캘린더 이벤트 생성 화면이 뜨는 것을 직접 확인합니다.

마지막으로, 에디터에서 커밋 메시지 자동 생성 기능을 사용해 변경사항을 저장합니다. 이 메시지는 코드 diff뿐 아니라 전체 대화 맥락을 기반으로 작성되어, 어떤 기능이 추가·수정됐는지 보다 의미 있는 내용이 담기게 됩니다.

Google Antigravity의 실제 가치와 한계, 어떻게 봐야 할까

영상 속 흐름만 보면 Google Antigravity는 "몇 분 만에 항공편 조회 앱을 완성하는 도구"처럼 보입니다. 실제로 코드 생성, API 조사, 테스트 자동화, 캘린더 연동, 파비콘 디자인까지 대부분의 과정을 에이전트가 처리했고, 개발자는 중요한 선택과 검토에만 개입했습니다.

다만, 현실적인 관점에서 보면 몇 가지 포인트는 분명히 짚고 넘어갈 필요가 있습니다.

첫째, 에이전트가 실행하는 명령에 대한 신뢰와 통제입니다. 자동 모드에서는 터미널 명령을 승인 없이 실행할 수 있지만, 프로젝트에 따라 이는 위험이 될 수 있습니다. Antigravity는 복잡하거나 파괴적인 작업일수록 사용자 승인을 요청하는 방향으로 설계되어 있으나, 실제 팀 환경에서는 권한 설정과 워크플로 정의가 중요합니다.

둘째, Artifacts의 품질과 활용도입니다. Task List, Implementation Plan, Walkthrough는 에이전트 작업을 투명하게 보여주기 위한 장치입니다. 그러나 팀 차원에서 이를 코드 리뷰, 문서화, 회고 자료로 어떻게 활용할지에 따라 실제 효용이 달라집니다. 아티팩트를 대충 읽고 넘어가면, AI가 잘못된 방향으로 진행한 작업을 뒤늦게 발견할 수 있습니다.

셋째, 브라우저 통합 테스트의 범위입니다. 데모에서는 간단한 폼 입력과 링크 클릭 정도를 자동화했지만, 복잡한 인증 흐름이나 여러 브라우저/디바이스를 고려해야 하는 상황에서는 추가적인 테스트 전략이 필요합니다. Antigravity가 자동으로 해주는 부분과, 여전히 사람이 챙겨야 하는 부분을 명확히 나누는 것이 중요합니다.

마지막으로, 개발자 역할의 변화입니다. Google Antigravity를 중심에 두면, 개발자는 세밀한 구현보다는 요구사항 정의, 코드베이스 구조 설계, 에이전트가 만든 결과물의 검증과 보완에 더 많은 시간을 쓰게 됩니다. 이런 환경에서 강점을 가지려면, 도구를 잘 다루는 능력뿐 아니라 "무엇을 만들지, 어떤 기준으로 품질을 판단할지"를 명확히 할 수 있는 역량이 필요합니다.

정리하면, Google Antigravity는 코드 에디터, 에이전트 관리, 브라우저 테스트를 묶어 에이전트 중심 개발 흐름을 실험하는 도구입니다. 항공편 추적 앱 예제는 이 방식이 실제로 어떻게 돌아가는지 보여주는 구체적인 사례입니다. 다만, 모든 프로젝트에 곧바로 그대로 적용하기보다는, 자동화가 강점을 발휘하는 영역과 직접 제어가 필요한 영역을 구분해 도입하는 것이 현실적인 접근입니다.

출처 및 참고 :

이 노트는 요약·비평·학습 목적으로 작성되었습니다. 저작권 문의가 있으시면 에서 알려주세요.