Firebase Studio 를 활용해 프로토타이핑 + 수정하기

🧩 핵심 개념

Firebase Studio는 “AI 기반 UI 생성형 개발 환경”으로,

텍스트 명령 한 줄로 즉시 실행 가능한 화면을 생성하는 Low/No-code 프로토타이핑 툴입니다.

📘 디자인이 아니라 “작동 가능한 화면의 설계”에 초점을 둔다.

단계	설명	예시
1. 명세화 (Specification)	화면의 목적과 기능 정의	“사용자가 설문을 입력하고 제출할 수 있는 화면을 만들어줘.”
2. 구조화 (Composition)	레이아웃과 구성요소 명세	“왼쪽은 폼, 오른쪽은 제출 결과 카드로 구성해줘.”
3. 맥락 부여 (Contextualization)	데이터 모델 연결, 필드명 지정	“Firestore의 `surveyResponses` 컬렉션과 연결해줘.”
4. 미리보기 (Preview)	더미 데이터로 동작 확인	“샘플 데이터 3건을 보여줘.”

접속 후 초기화면의 CTA에 무지성 순응해봅시다 (Tab & Go!)
- 또는 아래와 같은 간결한 예시 사용
```
Create a simple dashboard showing three cards:
- Total Users
- Active Sessions
- Revenue Today
Each card should show dummy data and have a refresh button.
```
  → 💡 AI가 자동으로 카드 레이아웃을 구성하고, DummyData가 삽입된 미리보기가 생성됩니다.