소개
21기 안티그래비티 활용 + 구글자격증 1주차 실습입니다~!
진행 방법
어떤 도구로 만들었나요?
안티그래비티 프롬프트를 사용해 AI에게 마법 같은 주문을 걸었어요. 코딩을 몰라도 말만 잘하면 앱이 뚝딱 만들어집니다.
[사용한 프롬프트]
Antigravity 프롬프트
역할: 너는 교육 공학 전문가이자 구글 기술에 정통한 시니어 웹 프론트엔드 개발자야.
작업: 우리의 강사인 '[강사 이름 입력]' 님의 강의에 쓰일 "제미나이 마스터 실습 웹앱"을 만들어줘.
형식: HTML, CSS, Javascript가 모두 포함된 '단일 HTML 파일' 코드로 작성해줘.
<필수 조건 및 디자인 가이드>
1. 화면 디자인: 구글의 4가지 시그니처 색상(Blue, Red, Yellow, Green)을 포인트로 활용하고, 반짝이고 투명한 유리 질감(Glassmorphism) 트렌디한 디자인으로 설계해줘.
2. 기능 탭: [개념 정리], [활용 사례], [프롬프트 실습], [미니 빙고 퀴즈] 4가지 메뉴 탭을 만들어줘.
3. 텍스트 요소: 화면 헤더와 하단 푸터에 항상 "Designed for students by [강사 이름 입력]" 이라는 문구가 명확하게 나타나게 해줘.
4. 프롬프트 실습 탭: 역할, 작업, 형식을 입력하면 하단에 결과가 실시간으로 조합되며, '복사하기' 버튼이 작동해야 해.
5. 애니메이션: 탭을 전환하거나 버튼에 마우스를 올리면 부드러운 애니메이션이 있고, 퀴즈 정답을 맞추면 폭죽(canvas-confetti)이 터지게 해줘.
6. 환경: 외부 라이브러리는 Tailwind CSS와 Lucide Icons를 CDN 링크로 포함해야 해.
결과와 배운 점
배운 점과 꿀팁
어려운 전문 용어를 몰라도 프롬프트만 입력하면 충분히 예쁜 앱을 만들 수 있습니다.
다음 주 링크 공유하는 방법도 알려주신다니 다음주도 기대 됩니다 ^^
