36"84"FRAME TYPEFINISHGLAZINGSingleDoubleWIDTH36"HEIGHT84"

Automation · 2025–2026

Eagle Web

Design, check and order a custom door frame in the browser

A 3D door-frame configurator that runs a Grasshopper definition in the browser. Customization possible for more than 150 parameters, see the frame update live, and order. An order summary PDF and CSV are generated automatically.

Context
Avalon International Aluminum
Role
Computational designer
Year
2025–2026
Stack
  • Grasshopper
  • Rhino
  • ModelUp3D
  • n8n
  • Webhooks
Frame types
9
Parameters
150+
Avg orders / day
2

Client work under NDA. Shown as system diagrams drawn for this site; no client data.

The problem

A custom aluminum door frame hides around 150 decisions: frame type, trim, wall, corner, finish, glazing, door species and veneer, fire label, hardware and acoustic rating. None of the orders were collected in a systematic process and details were getting lost in translation.

The system

One Grasshopper definition runs in the browser through Rhino.Compute. Each choice rebuilds the 3D frame live and checks it against the product rules. When the design is done, the same definition generates an order summary and writes the order data in a csv format.

Configurator

  1. Choose

    • Frame + trimType, wall, corner
    • Finish + glazingAnodised, powder, single, double
    • DoorSpecies, veneer, fire label, hardware
  2. Compute

    • Grasshopper definitionRules + geometry, in the browser via ModelUp3D (Rhino.Compute)
  3. See

    • Live 3D frameUpdates with every change
  4. Output

    • Customer Order Summary (PDF)
    • Project Data (CSV)
Frame types · drawn for the configurator
  • Type 01

    Type 01

  • Type 02

    Type 02

  • Type 03

    Type 03

  • Type 04

    Type 04

  • Type 05

    Type 05

  • Type 06

    Type 06

  • Type 07

    Type 07

  • Type 08

    Type 08

  • Type 09

    Type 09

Finishes
  • Clear anodised

    Clear anodised

  • Black

    Black

  • Bronze

    Bronze

  • Grey

    Grey

  • White

    White

  • Champagne

    Champagne

  • Custom powder

    Custom powder

  • Custom anodised

    Custom anodised

Corners and glazing
  • Corner 01

    Corner 01

  • Corner 02

    Corner 02

  • Double glazing

    Double glazing

  • Single glazing

    Single glazing

Wood door species
  • African mahogany

    African mahogany

  • Beech

    Beech

  • Birch

    Birch

  • Maple

    Maple

  • Red oak

    Red oak

  • Walnut

    Walnut

  • White oak

    White oak

The loop

An order fires a webhook into n8n. It generates the order summary, writes the order CSV and stores it into a database. An automated email is sent to the customer and project team simultaneously with their respective attachments. The CSV drops straight into the estimating schedule, so nobody retypes an order.

Order workflow

  1. Trigger

    • Order webhookPOST from the configurator
    • AcknowledgeRespond to webhook
  2. Draw

    • Order Summary
  3. Store

    • PDF → Database
    • Generate CSVOrder data
    • CSV → Database
  4. Notify

    • EmailCustomer + project team, with attachments