77
이 글은 [리트머스]에서 발행되었습니다.
초기 창업자의 시행착오를 줄여주는 성공 스토리와 인사이트를 매주 구독해보세요.
[구독하러 가기]
안녕하세요. 합리적인 외주개발의 가치를 더하는 리트머스입니다.
버블 AI에 대한 영상이 공개되며, 버블 AI 피쳐를 테스트할 수 있는 링크도 공개되었습니다!
버블의 AI 앱 생성기는 사용자의 아이디어를 빠르고 쉽게 앱으로 만들어주는 버블의 야심찬 툴입니다.
이러한 버블 AI가 무엇인지, 어떻게 사용하는 것인지 많은 분들이 궁금해 하실 것 같은데요.
누구보다 빠르게 버블 AI 가이드를 정리한 글과 실제 버블 AI를 이용해 앱을 제작한 영상을 가져왔습니다!
실제로 저희가 실험을 해보니 1분만에 앱이 생성되기도 했는데요.
이번 리트머스의 글을 읽고, 버블 AI를 효과적으로 활용하기 위한 필수 개념과 프롬프트 작성 방법을 익히시는데 도움이 되길 바랍니다!
더 많은 정보를 알고 싶다면, 아래의 버블 공식 문서를 참고해보세요!
버블 AI 필수 개념 정리
프롬프트란?
프롬프트는 Bubble AI가 앱을 만들기 위해 입력받는 텍스트 명령입니다.
앱의 유형, 목적, 핵심 기능, 스타일을 간결히 담아 작성하면 되죠.
User Story란?
User Story는 최종 사용자의 관점에서 앱의 목적과 기능을 간단히 설명한 것입니다.
User Story의 예시
- 사용자로서 지역 장인의 수공예품을 검색하고 구매하고 싶다.
- 사용자로서 관심 있는 상품을 위시리스트에 추가하고 싶다.
샘플 데이터란?
샘플 데이터는 실제 데이터를 대체한 가상 데이터인데요.
앱의 구조와 기능을 테스트하는 데 사용되며, 이후 실제 데이터로 교체할 수 있습니다.
버블 AI 앱 생성 과정
버블 AI는 다음 3단계로 앱을 생성합니다.
- 초기 프롬프트 입력: 만들고자 하는 앱의 주요 내용을 명확히 작성합니다.
- 블루프린트 확인 및 수정: 제공된 블루프린트를 확인하고 기능 추가 및 삭제 등 수정 작업을 합니다.
- 최종 앱 생성: 수정된 블루프린트를 바탕으로 실제 앱이 몇 분 내에 자동으로 생성됩니다.
생성된 앱은 버블로 자유롭게 수정 및 추가가 가능해요.
🫧 버블을 어떻게 사용하는지 궁금하다면?
↘︎버블 완벽 사용법&가이드 바로가기
프롬프트 작성 가이드
프롬프트는 짧고 명확하게 작성하는 것이 좋아요.
1~2문장으로 구성하며, 최대 500자를 넘기지 않는 게 좋습니다.
프롬프트 작성 시 포함할 사항
- 앱의 유형
- 타겟 사용자
- 앱의 주요 목표
- 사용자가 수행할 작업
- 원하는 스타일 (색상, 테마 등)
권장 사항
- 앱의 색상과 스타일을 구체적으로 언급하세요.
- 예시) 다크모드, 미니멀리즘
- 앱 이름이 있다면 적어주세요.
주의 사항
- 구체적인 페이지 레이아웃 요청은 현재 반영되지 않을 수 있어요.
- 플러그인, API 호출 요청은 별도로 추가해야 합니다.
프롬프트 예시
- 예시 1: 뉴욕 지역 소비자를 위한 장인의 수공예품 마켓플레이스 앱.
- 예시 2: 파란색 기반의 미니멀한 금융 관리 앱으로, 계좌 관리 및 지출 현황을 확인할 수 있는 앱.
- 예시 3: 학생들이 강의 자료를 공유하는 보라색 테마의 다크모드 커뮤니티 플랫폼.
버블 AI 참고 사항
현재 버블 AI는 플러그인, API, 결제 및 파일 업로드는 자동으로 지원되지 않는데요.
AI로 생성된 앱 내에서 추가 기능으로 추가하면 되겠습니다.
또한, 현재 베타 단계에서는 한 달에 10개 제작으로 개수에 제한이 있으니 유의하세요!
버블 AI 실사용 화면
리트머스도 실제로 버블 AI 베타 버전을 사용해 보았는데요!
단계별로 이미지와 함께 설명해 드리겠습니다.
실제 진행 영상을 보고 싶으시다면 아래 링크에서 확인해주세요!
버블 AI 앱 제작 가이드 영상이 궁금하다면?
↘︎ 영상 튜토리얼 바로 보기
1. 프롬프트 작성
간단한 기능과 구조도가 명확한 프롬프트를 버블 AI가 잘 처리하기 때문에, 투두 리스트를 정리해주는 간단한 프롬프트를 넣어보았습니다.
프롬프트 : “Create a simple to-do list web app where users can add, check off, and delete tasks. No login required.”
2. 블루프린트 생성
블루프린트는 어떤 구조와 기능을 포함할지 미리 알려주는 프롬프트 기반의 지침인데요.
기능 명세서 같은 개념으로 생각하시면 될 것 같아요.
저는 프롬프트 그대로 블루프린트를 생성했습니다.
3. 블루프린트 수정
원한다면 블루 프린트의 내용을 수정 및 추가가 가능한데요.
수정하지 않고 그대로 Generate를 진행해보았습니다.
4. 버블 AI 앱 생성
앱을 만드는데 5분에서 7분이 소요된다고 하는데요.
간단한 프롬프트를 넣어서 그런지, 약 1분밖에 소요되지 않았어요.
5. 앱 생성 완료
1분만에 이렇게 앱이 만들어졌는데요!
6. 이슈 해결
5개의 이슈가 발생해서 해결 해보았습니다.
4개의 이슈는 아이콘 위치 설정에 대한 버그였는데요. 아이콘 위치를 조정해주니 바로 해결되었구요.
마지막 이슈는 클릭을 해서 해당 레이어로 들어가니 곧바로 사라졌습니다.
7. 최종 앱 모습
최종적으로 만들어진 앱의 형태인데요!
1분만에 뚝딱 앱이 만들어지고 기본 형태가 잡히는 모습이었습니다.
다만, 디자인적으로 리스트들 간격이 없는 부분이 아쉬웠구요.
기능적으로도 매우 기초적인 수준에 불과했습니다.
물론, 이는 프롬프트 자체가 단순한 원인도 있을 것이라 파악됩니다.
버블 AI를 어떻게 똑똑하게 쓸 수 있을지, 앱 빌더로 버블 AI가 얼마만큼 구현이 가능한지는 앞으로 프롬프트 및 블루프린트 등을 고도화하는 방법으로 체득해야 할 것 같습니다.
버블 AI를 어떻게 사용할 것인가
버블 AI는 현재 베타 단계입니다.
버블 AI의 비전은 누구나 쉽고 빠르게 자신만의 앱을 만들 수 있도록 하는 것이며, ‘사업에 쓸 수 있을 정도로 견고한’, ‘지속적 업데이트가 가능한’ 앱을 만들 수 있도록 하는 것이라고 포부를 밝힌 바 있는데요.
다음 번에는 프롬프트를 고도화해서 버블 AI를 구현하는 소식으로 찾아오겠습니다.
리트머스를 통해 자세한 정보와 업데이트 소식을 누구보다 빠르게 알아보세요!
🚀 리트머스의 40여 개가 넘는 MVP 성공 사례가 궁금하다면?: https://litmers.com/portfolios
🚀 리트머스는 어떻게 창업을 하고, 50명 규모까지 성장했을까?: https://2link.in/wJZzq
이 글은 [리트머스]에서 발행되었습니다.
초기 창업자의 시행착오를 줄여주는 성공 스토리와 인사이트를 매주 구독해보세요.
[구독하러 가기]
1
0