[Antigravity #3] 인터페이스 200% 활용하기 (왕초보 가이드)
Editor’s Note
처음 Antigravity를 켜면 “어? 코딩하는 창이 어디 갔지?” 하고 당황하실 수 있습니다.
걱정 마세요. 여러분이 길을 잃지 않도록 딱 중요한 3가지 화면만 콕 집어 설명해 드립니다.
1. 전체 지도 (Big Picture)
Antigravity는 크게 두 구역으로 나뉩니다.
- 왼쪽: 매니저 뷰 (Manager View) → 👮♂️ 지시하는 곳
- 오른쪽: 에디터 뷰 (Editor View) → 👷 일하는 곳
이것만 기억하세요: “왼쪽에서 시키고, 오른쪽에서 확인한다.”
2. 매니저 뷰 (Manager View): 우리의 관제탑
화면 왼쪽, 채팅창처럼 생긴 곳입니다. 여기가 여러분이 가장 많이 머물 곳입니다.
💬 채팅 입력창 (Command Center)
카카오톡 하듯이 AI에게 말을 거는 곳입니다.
- “이거 만들어줘”, “저거 고쳐줘”
- 파일을 드래그해서 던져주면 “이 파일 분석해줘”가 됩니다.
📋 에이전트 목록 (Agent List)
여러 명의 AI 알바생(?)들이 대기하고 있는 곳입니다.
- Worker #1: 지금 코드를 짜고 있음
- Browser Agent: 웹사이트를 탐색 중임
- Planner: 전체 계획을 세우는 중임
여러분이 할 일은 그저 “누가 잘하고 있나 가끔 쳐다보는 것”뿐입니다.
3. 에디터 뷰 (Editor View): 작업실
화면 오른쪽, 익숙한 코드들이 보이는 곳입니다. VS Code와 거의 똑같이 생겼습니다.
📝 코드 편집기
AI가 작성한 코드가 실시간으로 타이핑되는 것이 보입니다.
주의! ✋ AI가 신들린 듯 타자를 치고 있을 때, 갑자기 끼어들어서 수정하지 마세요. (AI가 “어? 내 코드 어디 갔지?” 하고 꼬일 수 있습니다.)
📦 아티팩트 (Artifacts) 패널 ✨중요✨
오른쪽 구석에 있는 이 패널을 주목하세요. 채팅 로그는 흘러가면 끝이지만, 중요한 결과물은 여기에 차곡차곡 쌓입니다.
- 📄 Plan.md: AI가 세운 계획표
- 🖼️ Screenshot: AI가 테스트하다 찍은 스크린샷
- 📊 Diagram: AI가 그린 구조도
“아까 그거 어디 있지?” 싶을 땐 무조건 아티팩트 패널을 보세요.
4. 200% 활용 꿀팁: “Manager Mod”
많은 분들이 모르는 숨겨진 기능을 하나 알려드릴게요.
Cmd + M (윈도우는 Ctrl + M) 을 눌러보세요. 화면이 ‘매니저 모드’로 바뀌면서 코드는 작아지고, 에이전트들의 상태가 대시보드처럼 한눈에 보입니다.
“내가 직접 코드를 볼 필요 없을 때, 그냥 팔짱 끼고 구경하고 싶을 때”
이 모드를 켜두면 정말 IT 기업 팀장이 된 기분을 느낄 수 있습니다. 😎
5. 오늘의 요약
- 왼쪽(매니저 뷰)에서 말하고, 오른쪽(에디터 뷰)에서 확인한다.
- 중요한 자료는 말풍선 위로 사라지기 전에 아티팩트 패널에서 찾는다.
- 코딩하기 귀찮을 땐
Cmd + M누르고 구경한다.
이제 조작법은 마스터했습니다! 다음 편 [Antigravity #4] 에서는 Antigravity의 꽃, “내 손안의 브라우저(Browser Agent)”를 사용하여 웹사이트를 자동으로 돌아다니게 시켜보겠습니다.