Can One Marketer Be a Whole Department?
There is an increasing expectation that AI will magically solve productivity gaps. As a marketer, this got me thinking: Can a single person now carry the entire function?
Building a high-fidelity website is usually a multi-disciplinary marathon. It requires a project manager, copywriter, UX designer, UI designer, and developer. Even for a simple B2B site, the “latency tax”—the time swallowed by handoffs, meetings, and feedback loops—typically stretches the timeline from concept to launch to several months.
To test the limits of AI-augmented marketing, I decided to build a fully custom website from scratch for a hypothetical “agentic customer experience AI” company.
For context, my baseline is this: I have led marketing for B2B startups and managed several redesigns, but I do not have a technical background. I understand core concepts (e.g., z-index, breakpoints, and basic typography), but I am not an expert in HTML, CSS, JavaScript, or React.
In this blog, I’ll break down the AI stack I used, my experience building the prototype, and the divide between what can be automated versus what still requires manual craft. The entire process took just over a day—approximately 12 hours.
The AI Stack for Building Fully Custom Websites
While "all-in-one" builders like Wix or Squarespace allow for quick template-based sites, they often lack the design flexibility and granular SEO control required for B2B websites focused on storytelling, conversion, and fundraising. To achieve a fully custom look with a high-velocity workflow, I used the following tools where AI handled the heavy lifting.
Purpose | Tool | What aspect is AI-powered |
|---|---|---|
Copywriting | Google Gemini | Analyzing competitor positioning; generating appropriate copy for each section of the website. |
Visual identity | Adobe Firefly | Generating a style guide consisting of custom color palettes and font pairings and moodboarding. |
Wireframing and layout | Relume | Automatically generating sitemaps and wireframes; generating a style guide; recommending page layouts from a library of 1000+ components. |
Build and deployment | Framer | Note: I focused on manual build and polish here, but optional AI features include scaffolding layouts, automating localization, and generating interactive components. |
The Experience
Moving from a blank cursor to a live URL in 12 hours requires a clear division of labor: let the AI handle the structural "heavy lifting" so the human can focus on the "manual polish." Here is how the day actually broke down.
1. Messaging & Copywriting: the Shortcut
Normally, I don’t touch website copy until a company’s positioning is set in stone. Since this was a project for a hypothetical agentic AI company, I used Gemini to bridge the gap. I prompted Gemini to analyze real-world competitors in the customer support space and, from there, generated website copy section-by-section. While I’d never skip the positioning and messaging exercise in real life, Gemini proved that it can generate a “good enough” draft in minutes.
Note: I’ve never worked in the CX space, so the messaging might lack the "insider" grit of a real-world product. But for the purposes of this exercise, the goal was to see if Gemini could handle the heavy lifting of generating reasonable copy—which it did.
2. Branding: The Quick Identity
Establishing a brand identity is a months-long process of research, feedback loops, and iterations. For this project, I intentionally skipped the deep dive, knowing that AI is not yet capable of thorough creative conceptualization—at least, I haven’t cracked the code yet.
I initially attempted to define the visual style using Adobe Firefly, but I pivoted to Relume’s style guide generator after running through my credits—a common limitation of tools that rely on third-party models. While Relume offers preset palettes and font pairings, they often require manual customization to feel "right."
The Scaling Reality: This is where the process currently fails to scale. The tool provides the output, but it still requires a designer’s eye to ensure the final result is cohesive. A non-designer wouldn't necessarily know how to balance a palette or pair typography to evoke a specific brand sentiment, proving that while AI can speed up execution, the "creative soul" of the project remains a human bottleneck.

Figure 1: Style guides generated by Adobe Firefly and Relume.
3. Huge Time-Saver: Wireframing & Page Layout with Relume
This was the biggest "velocity multiplier" of the project. Typically, wireframing is a labor-intensive process of developing in Figma, painstakingly building out every page, section, and component from scratch. Relume’s AI effectively collapsed this phase from days into minutes.
From prompt to architecture: By prompting the tool with just 1–2 sentences about the company, it generated a full sitemap and corresponding wireframes.
The synchronized workflow: Because the sitemap, wireframes, and design are linked, any structural change—like removing a page or adding a new section—updates the entire layout automatically.
Intelligent component selection: The AI chose specific sections and components based on my prompt but I wasn’t locked in. I could swap any section with one of thousands of alternative pre-built components from their library.
Contextual design: I was able to directly edit the wireframes using the copy I generated earlier with Gemini, ensuring the design, layout, and the narrative were working in tandem from the start.

Figure 2: Relume workflow from sitemap to wireframes and design.
Transition to high-fidelity:
It’s worthwhile to note that Relume’s “design” output is not that different from the wireframe. While it applies fonts you defined in your style guide, the color application was very limited.
However, you can instantly transfer these designs into Framer, using Figma as an intermediary, using a couple of plugins. This meant I didn't have to rebuild a single component in the dev environment. I could iterate on layouts section-by-section within Relume until the architecture felt right, then export the whole thing into my build tool.

Figure 3: Plugins transport editable components from Relume to Framer via Figma as an intermediary.
4. Build and QA in Framer
By exporting Relume design into Figma, and using Figma-to-Framer HTML plugin, I transferred the design into the development environment. This is a massive time-saver, but it isn't "set it and forget it." Because the styling didn’t carry over perfectly, I had to manually adjust details such as margins and layout positioning to match the style guide I defined at the start. I also set up a style page at the beginning so I could apply color palette and typography consistently throughout the site.
Where the Human "Craft" Still Lives
The following part was the most manual, proving that while AI can build the structure, a human still needs to provide the polish and ensure quality.
Animations: This easily took the longest amount of time. Custom animations—interactions, scrolls, hovers, and layer-in-views—that make a B2B site feel "expensive"—are still a manual process. Fortunately, Framer’s interface is far more intuitive for this than tools like Webflow.
Responsive QA: While Framer handles the heavy lifting of device breakpoints, I still had to manually "sanity check" the layout across mobile, tablet, and desktop to ensure nothing broke during the transition from the AI wireframe.
[add gif]
The Learning Curve
I found that following video tutorials was essential. While the build was fast, understanding Framer’s specific logic for components and ‘stacks’ is key to making the site scalable. In future projects, this phase will likely be even shorter as I build my own library of reusable "AI-ready" components.
Learnings
1. AI Capabilities vs. Human Craft
The most important takeaway is knowing exactly where the AI’s job ends and yours begins. For this project, AI handled the heavy construction: generating the initial copy, building the wireframes, creating page mocks, and scaffolding the initial build. However, a human is still required for the high-value finishing. AI cannot yet handle the "last mile" of professional polish, complex animations, or rigorous QA.
2. Collapsing the “Handoff Gap"
AI effectively removes the "cold start” problem: Even if the initial AI output isn't perfect, it is significantly easier to refine and perfect a generated layout than it is to face a blank white screen.
By using this stack, I also eliminated the traditional Designer-Engineer handoff. Oftentimes, this is where miscommunication or technical "translation" errors between Figma and the live code happens, leading to delays. When one person owns both the design and the build through an integrated AI workflow, those barriers disappear.
3. The Human as the Strategic Pilot
AI is a tool, but a human still has to be the architect. Even with the best software, you still have to own three critical pillars:
Strategy: Defining the positioning, the core messaging, and the creative soul of the project.
Approach: Knowing which tools to select for which job (e.g., when to use Gemini vs. when to use Firefly).
Process: Managing the cadence and the multidisciplinary "to-do list" to ensure stakeholders are aligned and the project actually crosses the finish line.
Overall, I’m inspired by how the right combination of AI and purpose-built tools allowed one marketer to create a fully custom, high-performance website in a fraction of the usual time. It proves that the barrier between "having an idea" and "launching a professional presence" has never been thinner.
Next Steps
This project was a stress test for web development, but it’s only the beginning. Looking forward, I’ll be exploring how AI can be leveraged across other aspects of marketing functions such as design and creative, pipeline automation, market research and so on.
Contact
Do you have questions? Send a message and I'll get back to you.
marketing@satokonak.com
