https://main--cc--adobecom.aem.live/cc-shared/assets/img/firefly.svg|AdobeFirefly Adobe Firefly
AI 웹 사이트 빌더 Firefly Builder로 인터랙티브 디자인 생성
Firefly Builder로 웹 사이트, 앱 등을 손쉽게 시각화할 수 있습니다. 프롬프트와 참고 자료를 반응형 디자인으로 변환하고 캔버스에서 바로 미리 보고 편집할 수 있습니다.
디자인 시스템과 캔버스 편집 기능으로 일관성과 제어력 확보
프롬프트를 입력하거나 브랜드 가이드라인을 업로드하면 버전 간에 일관된 디자인과 느낌을 유지하는 디자인 시스템을 생성할 수 있습니다. [속성] 패널에서 디자인을 편집하거나, [검사] 도구로 원하는 요소를 선택하고 프롬프트를 입력해 변경할 내용을 설명할 수 있습니다.
손쉬운 디자인 미리 보기 및 공유
Firefly Builder는 디자인을 클릭 가능한 프로토타입으로 구현하여 캔버스에서 바로 테스트할 수 있게 해 줍니다. 이해관계자, 클라이언트, 협업자에게 링크를 보내 피드백을 받고 개발을 시작하기 전에 수정하고 다듬을 수 있습니다.
AI 웹 사이트 빌더에서 경험 내보내기
정리된 HTML 코드 번들을 개발자에게 전달하거나 웹 코딩 도구로 가져와 디자인을 배포할 수 있습니다.
Firefly Builder로 인터랙티브 디자인을 생성하는 방법
1단계
대기자 명단 등록
2단계
Firefly Builder 열기
3단계
프로젝트 생성 시작
4단계
프로젝트 미리 보기
5단계
결과 세부 조정
6단계
선택 사항: 프로젝트 추가 생성
새 프로젝트를 만들려면 앱 프레임을 선택 해제하고 화면을 축소하세요. 하단 도구 모음의 [프레임] 도구로 캔버스 어디서든 새 프레임을 그리세요. 그런 다음 프레임을 선택하고 새 프롬프트를 입력하여 프레임 안에 새 디자인을 생성하세요.
캔버스나 채팅 패널 왼쪽 상단의 드롭다운 메뉴에서 프로젝트를 선택하여 프로젝트 간에 이동하세요.
Firefly Builder로 인터랙티브 경험을 생성하는 방법
Firefly Builder로 인터랙티브 경험을 생성하는 단계별 방법
PT5M
firefly
창의적인 제어
디자인 시스템을 생성하고 캔버스에서 바로 세부 사항을 편집하는 기능으로, Firefly Builder는 바이브 코딩에 새로운 수준의 정밀함을 더합니다.
코드 없는 인터랙티브 디자인
설명을 입력하고 시각적 참고 자료를 추가한 다음 브랜드 가이드라인을 업로드하면 AI 웹 사이트 빌더가 구상한 내용에 맞는 인터랙티브 디자인을 빠르게 생성합니다.
간편한 공유
디자인이 어느 정도 완성되면 공유 링크를 받아 협업자와 이해관계자에게 보내 검토를 받을 수 있습니다. 파일을 내보내거나 별도로 전달할 필요가 없습니다.
바로 사용 가능한 결과물
Firefly Builder는 웹 개발 도구에서 추가로 개선할 수 있는 정리된 코드 번들을 빠르게 생성합니다.