#000

https://main--cc--adobecom.aem.live/cc-shared/assets/img/firefly.svg|AdobeFirefly Adobe Firefly

Gumawa ng mga interactive na disenyo gamit ang Firefly Builder, ang AI website builder.

Madaling i-visualize ang mga website, app, at iba pa gamit ang Firefly Builder, na ginagawang mga responsive design ang mga prompt at reference mo na direkta mong mape‑preview at mae‑edit sa canvas.

Sumali sa waitlist

style
dark
#000

https://main--da-cc--adobecom.aem.page/cc-shared/assets/img/product-icons/svg/firefly-80.svg|Adobe Firefly

Sumali sa Firefly Builder waitlist

https://main--da-cc--adobecom.aem.page/cc-shared/assets/img/product-icons/svg/firefly-80.svg

Adobe Firefly

Sumali sa Firefly Builder waitlist

https://main--da-cc--adobecom.aem.page/cc-shared/assets/img/product-icons/svg/firefly-80.svg

Adobe Firefly

Sumali sa Firefly Builder waitlist

style
Sticky bottom, dark

Firefly Builder. Kung saan nagtatagpo ang vibe coding at creative control.

Ngayon, mabilis na mabibigyan ng buhay ng mga designer ang kanilang mga ideya sa pamamagitan ng pag-generate ng mga interactive, on-brand na disenyo ng website at app — nang hindi gumagawa ng kahit isang linya ng code. Gumawa at pamahalaan ang maraming project sa iisang canvas, at ayusin ang lahat ng detalye sa pamamagitan ng agent chat o direct selection at pag-edit. Pagkatapos, i-export ang iyong mga code bundle para sa karagdagang development.

background
#FFF
style
xxl-spacing-top, xl-top-rounded-corners, static links

Makamit ang consistency at kontrol gamit ang mga design system at on-canvas editing feature.

Mag-type lang ng prompt o mag-upload ng iyong mga brand guideline para mag-generate ng design system na magpapanatiling consistent ang iyong hitsura sa lahat ng version. I-edit ang iyong mga disenyo sa Properties panel, o piliin ang anumang elemento gamit ang Inspect tool at mag-type ng prompt para ilarawan ang mga pagbabagong gusto mong makita.

Madaling i-preview at ibahagi ang iyong mga disenyo.

Ginagawang mga clickable prototype ng Firefly Builder ang mga design mo para ma‑test mo agad sa canvas. Magpadala ng link sa mga stakeholder, client, at collaborator para makuha ang kanilang feedback at ma-revise at ma-refine mo bago magsimula ang development.

I-export ang mga experience mula sa AI website builder.

Ibigay ang malinis na HTML code bundle sa isang developer o i-import ang mga ito sa mga web coding tool para dalhin ang iyong mga disenyo sa deployment.

Paano gumawa ng mga interactive design gamit ang Firefly Builder.

Hakbang 1

Sumali sa waitlist.

Pumunta sa firefly.adobe.com/builder at sumali sa waitlist ng Firefly Builder gamit ang iyong Adobe ID, o gumawa ng libreng account kung wala ka pa nito.

Hakbang 2

Buksan ang Firefly Builder.

Kapag available na ang app, mag-log in gamit ang iyong Adobe ID.

Hakbang 3

Simulan ang pag-generate ng iyong project.

I-click ang icon ng paper airplane sa kanang sulok sa ibaba ng prompt window. Sisimulan ng Firefly Builder ang pag-generate ng iyong disenyo sa canvas, at makikita mo ang bawat hakbang nito sa real time.

Hakbang 4

I-preview ang iyong project.

Kapag tapos na ang Firefly Builder, makakakuha ka ng interactive na preview ng iyong project. Maaari mong palawakin ang frame, suriin ang bawat elemento, o subukan ang experience sa bagong browser tab.

Hakbang 5

I-refine ang mga resulta mo.

Ituloy ang pag-edit ng iyong project sa pamamagitan ng pagpili ng frame nito at pag-type ng mga instruksyon sa agent chat window.

Hakbang 6

Opsyonal: I-generate ang isa pang project.

Para lumikha ng bagong project, i-deselect ang app frame at mag-zoom out. Gumuhit ng bagong frame kahit saan sa canvas gamit ang Frame tool sa ibabang toolbar. Pagkatapos, i-generate ang bagong disenyo sa loob ng frame na ito sa pamamagitan ng pagpili nito at paglagay ng bagong prompt.

Lumipat mula sa isang project patungo sa isa pa sa pamamagitan ng pagpili ng mga ito sa canvas o sa dropdown menu sa kaliwang itaas ng chat panel.

Paano gumawa ng mga interactive experience gamit ang Firefly Builder.

Mga hakbang para gumawa ng mga interactive experience gamit ang Firefly Builder.

PT5M

firefly

Sumali sa waitlist
style
xl-bottom-rounded-corners
background
linear-gradient(180deg, #FFF 0%, #F0F0F7 27.32%)

Bakit gagamitin ang Firefly Builder bilang AI website builder mo?

Binibigyan ng Firefly Builder ng kakayahan ang mga graphic designer, UI/UX designer, at lahat ng uri ng creative professional na gumawa ng mga interactive experience nang hindi kailangang magsulat ng code. Kailangan mo mang gumawa ng mock-up ng simpleng web app o magdisenyo ng branded microsite para sa isang product launch, pinapadali ng Firefly Builder ang pag-visualize kung ano ang magiging hitsura, pakiramdam, at gawi ng final na produkto.

background
#FFF
style
xxl-spacing-top, xl-top-rounded-corners, static links
#FFF

Creative control

Gamit ang kakayahang mag-generate ng mga design system at i-edit ang lahat ng detalye ng mga design mo nang direkta sa canvas, dinadala ng Firefly Builder ang vibe coding sa isang bagong antas ng katumpakan.

#FFF

Interactive na disenyo nang walang code

I-type lang ang mga paglalarawan, magdagdag ng mga visual reference, at i-upload ang iyong brand guidelines, at mabilis na gagawa ang AI website builder ng mga interactive na disenyo na akma sa iyong bisyon.

#FFF

Madaling pagbabahagi

Kapag handa na ang disenyo, makakuha ng shareable link para ipadala sa mga collaborator at stakeholder para sa review. Hindi na kailangan pang mag-export ng mga file o gumawa ng handoff.

#FFF

Output na handa para sa produksyon

Mabilis na gumagawa ang Firefly Builder ng malilinis na code bundle na handa nang i‑enhance pa sa mga web development tool.

style
two up, s spacing top, l spacing bottom, show-2-desktop, static-links
background
#FFF
Sumali sa waitlist
background
#FFF
style
xl-top-rounded-corners, static links

Tuklasin ang magagawa mo sa Firefly Builder.

Sumali sa waitlist
https://firefly.adobe.com/builder/join?ff_source=adobe-com&ff_campaign=ff-builder-page
Sumali sa waitlist
https://firefly.adobe.com/builder/join?ff_source=adobe-com&ff_campaign=ff-builder-page
Sumali sa waitlist
https://firefly.adobe.com/builder/join?ff_source=adobe-com&ff_campaign=ff-builder-page

Tuklasin ang iba pang feature.

background
#F0F0F7
Text to image Image to image Sketch to image AI graphic design generator AI art generator AI drawing generator AI video generator AI animation generator AI portrait generator AI cartoon generator AI music generator AI sound effects generator
background
linear-gradient(180deg, #FFF 0%, #F0F0F7 27.32%)
style
xl-bottom-rounded-corners, spacing-bottom-180

May mga tanong? Masasagot namin iyan.

Ano ang Firefly Builder?

Isang web app ang Firefly Builder na nagbibigay-daan sa iyong lumikha ng mga interactive na disenyo — tulad ng mga website at app — nang hindi kailangang mag-code.

Para kanino ang Firefly Builder?

Para ito sa sinumang designer o creative professional na nais ilapat ang sining ng visual storytelling sa mga interactive na karanasan tulad ng mga website at app. Maaari nilang gamitin ang Firefly Builder para sa trabaho ng kliyente o sa brand ng kanilang sariling organisasyon.

Kailan ko maa-access ang Firefly Builder AI website builder?

Available na ang app bilang bahagi ng isang private beta program. Para alamin pa, pumunta sa firefly.adobe.com/builder.

Anong mga wika ang sinusuportahan?

Sa kasalukuyan, available lang ang Firefly Builder sa wikang English.

Anong mga uri ng file ang puwede kong i-upload sa prompt window?

Sa kasalukuyan, sinusuportahan ng Firefly Builder ang mga sumusunod na uri ng file: JPEG, PNG, PDF, MD, at GIF.

Puwede ba akong gumamit ng Firefly Builder AI website at app builder sa mobile device ko?

Oo. Gumagana ang Firefly Builder sa mga desktop at mobile web browser. Hindi pa nito sinusuportahan ang output ng mga code bundle para sa mga mobile app.

Anong mga browser ang sinusuportahan ng Firefly Builder?

Puwede mong gamitin ang Firefly Builder sa Google Chrome, Apple Safari, Microsoft Edge, at Mozilla Firefox.

Maaari bang i-edit ang mga disenyo ko pagkatapos ma-generate ang mga ito?

Oo. Maaari mong i-edit ang mga ito nang direkta sa Properties panel, o gamitin ang Inspect tool para i-target ang mga partikular na elemento at gumawa ng mga pagbabago gamit ang mga prompt.

I-share ang page na ito.

style
xxl spacing bottom