FREAKYYY/PORTAL

STUDIO: FREAKYYY
·

Building the system for what happens after AI generates the first page

Go to project
FREAKYYY/PORTAL AI Website Infrastructure

Context

Freakyyy was repeatedly building websites and digital pages for its own projects and client work. While AI tools made generating an initial website draft or page layout extremely fast, obtaining the raw generated code was only the first step of the process.

Challenge

The challenge lay in bridging the gap after the initial draft is generated. Moving from a raw AI generation output to a refined, customized, and deployed website involves significant manual labor. Founders and designers face friction connecting domains, customizing styles, restructuring layout hierarchies, and managing client handovers. We set out to design a system that handles these subsequent steps.

What Portal enables

Portal supports several ways of moving a website project forward.

Generate from an idea

An operator can begin with information about the business, its audience, its offer and the direction of the website. Portal turns that input into an initial page structure, visual direction and draft content that can be reviewed and refined inside the workspace.

The generated version is a starting point, not a forced final result.

Re-imagine an existing website

An existing website can be used as the starting reference by entering its URL. Portal brings that reference into the workflow so its content, structure and visual direction can be reconsidered without beginning from an empty canvas.

This is useful when the business already has a website but needs to reorganise its information, modernise its presentation or explore a substantially different direction.

Customise the result

After generation, the operator can continue working through the visual canvas. Content, typography, colours, spacing, sections, components and page hierarchy can be adjusted while reviewing the page as it changes.

This closes the gap between accepting an AI-generated first attempt and manually rebuilding the entire result somewhere else.

Export the website

The completed project can move towards export as supported website files for independent hosting and handover.

Exporting the project does not automatically include every external service it uses. Domains, hosting, fonts, images, APIs, databases and other third-party dependencies may still require separate accounts, configuration and ongoing costs.

The Workflow

The Portal workspace streamlines the journey from generation to export:

  1. Login: Accessing the workspace securely.
  2. Re-imagine from URL: Operators input an existing URL to bring its baseline structure into the workspace.
  3. AI Generation: Generating structured drafts and localized copy based on custom settings.
  4. Code and Preview: Directly previewing the live website rendering alongside its underlying code.
  5. Visual Canvas Editing: Refining layouts, typography, content blocks, and visual elements on a drag-and-drop canvas.
  6. Codebase Export: Exporting static website files to host independently.

Designing for Control

We built Portal around the principle of code portability and platform independence. Unlike site builders that require continuous subscription hosting, Portal allows operators to export their projects.

However, true independence requires acknowledging realistic operational constraints. While operators retain ownership of their exported project files, they remain responsible for managing third-party code dependencies, fonts, asset hosting, domain registrations, external API connections, and database integrations.

A workflow that can operate under another brand

Portal is not limited to producing websites directly under Freakyyy. Its white-label model is intended for agencies, designers and website providers that want to use the underlying production workflow while presenting their own brand to clients.

A partner can use Portal across the website-delivery process: establishing the first direction, refining the result, reviewing the implementation and preparing the project for handover.

The following white-label capabilities are verified and supported within the Portal workspace:

  • Partner Brand Presentation: Partners can display their own logo and branding within the workspace.
  • Branded Workspace: The website generation, AI layout drafting, and visual editing canvas are presented under the partner’s own brand identity.
  • Export and Client Handover: Supported website files can be exported from the branded platform for direct client delivery.

Please make clear that white-labelling applies to the Portal workspace and delivery process. It does not automatically white-label third-party hosting providers, domain registrars, web fonts, external APIs, databases, or other external services.

Who Portal is built for

Portal was designed for people who need to produce and revise websites repeatedly—not only experiment with a single AI-generated page.

  • Founders can turn an early idea or outdated website into a clearer starting point before involving additional specialists.
  • Designers and operators can generate an initial direction and continue refining it visually instead of being limited to the first output.
  • Agencies and website providers can use the workflow across client projects and, where enabled, present that workflow through their own brand.
  • Internal teams can create and revise landing pages without turning every content or layout adjustment into a separate development cycle.

Portal does not eliminate the need for technical judgment. Websites involving authentication, databases, payments, complex integrations or custom application logic may still require additional development and testing.

Work delivered

  • Workspace Concept & UX: Designed the interface to unify code editing with visual canvas tools.
  • URL Import & Re-imagining Engine: Developed the input workflow to ingest structure from external URLs.
  • AI Layout Generation & Brief-Based Workflows: Integrated context-aware drafting configurations that turn business context and page requirements into an initial website direction.
  • Visual Editing Canvas with Live Preview: Built component-level editor panels to customize text, spacing, and styling, bringing the generated page and its underlying implementation into the same review process.
  • Code Export & Project Packaging: Implemented the static asset packaging workflow for packaging supported website files for use outside Portal.
  • White-label Operations: Enabled verified partners to use the website-production workflow through their own brand presentation.
  • Operator Documentation: Provided deployment checklists for hosting exported projects on independent servers.

Outcome or status

Operational owned product

Freakyyy Portal was launched as an operational website development workspace. The platform was successfully tested internally for generating and exporting landing pages, demonstrating a clear path from initial AI drafts to owned codebases.

Portal also turned the process into a repeatable operating workflow. A project can begin from an idea or an existing URL, move through generation and visual customisation, and end with an exported website rather than remaining permanently tied to the generation interface.

Where white-label access is enabled, the same workflow can support partners delivering websites through their own brand. White-labelling concerns the Portal workspace and delivery process; domains, hosting, APIs and other third-party services remain separately managed.

Visual Walkthrough

Operating System Walkthrough: Demonstrating url inputs, AI generation, canvas editing, and codebase exports.

Project details

  • Project: FREAKYYY/PORTAL
  • Type: Owned digital product
  • Studio: Freakyyy
  • Scope: Product strategy, user experience, brand direction, development and operations
  • Website: portal.freakyyy.com

Next Project

Freakyyy Rides

Subscribe to our newsletter!

We curate practical insights from operators on the ground and send them occasionally.

No spam. Unsubscribe anytime.