We Built a Website with Gamma AI in REALTIME and Here's What Happened

Full video transcript

Moving on to the third and final Gamma Lab workshop of the Scale with AI Summit series, Allison joined again to close out the series. She noted the team at Gamma ships very quickly and often, and that feedback from earlier sessions felt almost like an informal certification course.

Rather than presenting prepared material, Allison invited the group to submit their own website links or slides so she could recreate one live. George offered his site, moreprofitrocket.com, and Allison used it as the basis for the rest of the session, working directly in the Gamma editor while sharing her screen.

She began by identifying a hero section with a galaxy-style background image and, since she didn’t have the exact original asset, used Gamma’s AI image generation to create a replacement: prompting for a galaxy star image, blue cool tones, in landscape orientation, and generating it with the Flux Ultra model. While that generated, she restructured the card it would sit in, changing its layout from “top” to “background” so the image would fill the card properly, and removed a frosted overlay so the new image was clearly visible.

She then used the /column slash command to build a two-column layout, moving the site’s text and an image into the columns, and used note boxes (via the /box slash command) to contain text that was hard to read against the background. She explained that note boxes can include pre-installed icons when relevant, such as for alerts or warnings, but she didn’t need one in this case.

Later in the session, working through the page’s paragraph content, Gamma automatically transformed a set of bullet points into a laid-out section and picked icons for each item. Allison used this moment to share a broader AI tip: when stuck on choosing icons or visuals, take a screenshot of the content and paste it into Claude or ChatGPT, asking it to suggest an icon for each point, and specify a preferred icon set if you have one (she uses Font Awesome at Gamma). She said this has eliminated the time she used to spend manually searching for and picking icons.

She also called out a strong quote in the page copy about taking care of “people, not numbers,” and converted it into a block quote to raise its visual hierarchy, either by typing an angle bracket followed by a space or by highlighting the text and selecting “convert to block quote” from the menu. She emphasized that during early-stage design, showing too much at once can overwhelm viewers, so raising the hierarchy of a few key pieces of content matters more than filling the whole page.

Near the end, Allison gave a preview of a grayscale wireframe template she built for a member of Gamma’s own content team, intended for their marketing site. The template lets a teammate replace content and optionally swap icons without worrying about breaking the design, and if something does go wrong, they can simply duplicate the template again and start fresh.

Closing out the session, Allison thanked George for offering his site for the live demo and thanked the audience for their questions across the three-part series. The hosts encouraged viewers to try Gamma using the promo code AISummit for a free month of Gamma Pro, and to subscribe to the channel for more from the Scale with AI Summit series.