A Web-based IDE for Generative...

37
A Web-based IDE for Generative Design Pedro Alfaiate [email protected] 1

Transcript of A Web-based IDE for Generative...

Page 1: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

A Web-based IDE for

Generative Design

Pedro [email protected]

1

Page 2: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Generative Design

2

Page 3: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Exemplos de GD em arquitetura.3

Page 4: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

IDEs for Generative Design

4

Page 5: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

5

Page 6: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

6

Page 7: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

7

Page 8: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

IDE in the Web

8

Page 9: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

IDE como aplicação

web

9

Page 10: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

10

Page 11: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

11

Page 12: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

12

Page 13: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

13

Page 14: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

14

Page 15: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

15

Problem

Page 16: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

16

Requirements

No installation or updates

Help the programming process

Traceability

Immediate feedback

Intuitive parameter adjustment

Integrate into the architect’s workflow

Page 17: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Luna Moth

17

Page 18: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

18

Page 19: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Luna Moth - Demo

19

Page 20: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Workflow Integration

20

Page 21: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

21

Page 22: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

22

Page 23: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Performance Evaluation

23

Page 24: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Performance Evaluation

24

Examples that can be generated by programs

Compared with other IDEs

Grasshopper, Rosetta, OpenJSCAD

Page 25: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

25

Page 26: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Future work

Better integration

faster

more design tools

Better development experience

illustrated programming

timetable traceability

code completion

error reporting

Collaboration26

Page 27: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Contributions

27

Luna Moth: A Web-based Programming Environment for Generative Design

35th eCAADe conference: Sharing of Computable Knowledge (accepted)

Luna Moth: Supporting Creativity in the Cloud

37th ACADIA conference: Disciplines & Disruption (submitted)

Page 28: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Thank you

28

Page 29: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

29

Page 30: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Implementation

30

Page 31: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Rendering

31

Page 32: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Rendering

32

Convert Render

Results Three.js Scene Image

function sphereCube(w, sphR) {

let sph = sphere.byRadius(sphR);

return [

translate(sph).byXYZ(0, 0, 0),

translate(sph).byXYZ(w, 0, 0),

translate(sph).byXYZ(w, w, 0),

translate(sph).byXYZ(0, w, 0),

];

}

let g = sphereCube(10, 1);

g;

Run

Page 33: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Traceability

33

Camera

Ray

Rendered

Object

Result

ValueAST Node Highlight

Text

CoordsAST Node

Expression

Results

Rendered

ObjectsHighlight

Page 34: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Running for Traceability

34

Page 35: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Running for Traceability

35

function sphereCube(w, sphR) {

let sph = sphere.byRadius(sphR);

return [

translate(sph).byXYZ(0, 0, 0),

translate(sph).byXYZ(w, 0, 0),

translate(sph).byXYZ(w, w, 0),

translate(sph).byXYZ(0, w, 0),

];

}

let g = sphereCube(10, 1);

g;

Parser Transform

Generate Run

function sphereCube(w, sphR) {

let sph = sphere.byRadius(sphR);

return [

translate(sph).byXYZ(0, 0, 0),

translate(sph).byXYZ(w, 0, 0),

translate(sph).byXYZ(w, w, 0),

translate(sph).byXYZ(0, w, 0),

];

}

let g = sphereCube(10, 1);

g;

Program ASTTransformed

AST

Instrumented Program

ResultsExpr -> Results

Page 36: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Literal Adjustment

36

0.19 -> 0 19 -> 019 -> +6 025 -> 0.25

str -> str -> int -> int -> str

Page 37: A Web-based IDE for Generative Designweb.ist.utl.pt/.../theses_pres/2017_AWeb-basedIDEforGenerativeDesign.pdf · A Web-based IDE for Generative Design Pedro Alfaiate pedro.alfaiate@tecnico.ulisboa.pt

Workflow Integration

run without traceability -> call operations on Rosetta Remote Service (as in RPC)

37

RunGenerate

in Tool

Start

Service