Módulo III — Animação (1/2)

Abstração & Animação Código: float t=10; void setup() { size(710,400); background (255,255,150); frameRate (40); } void draw() { noFill (); stroke(255,0,0); ellipse(50,50+t,50,50); ellipse(50+t,350-t,50,50); ellipse(350,50+t,50,50); ellipse(350+t,350-t,50,50); ellipse(650,50+t,50,50); t+=5; if (t > 300) { noLoop(); } } Continuar a ler Módulo III — Animação (1/2)

Processing III

Interatividade: cores di texto em randoms azuis e ao clicar no rato o rosto muda de expressão. void setup () {size (500, 500);background (#FCDB7D);//quadradinhos fundoint n = 10;int spacing = width / n; int j = 0;while (j < n) {int i = 0;while (i < n) {fill (#F492F5);stroke (#F492F5);square (10 + (i* spacing), 10 + ( j * spacing), 30);i = i +1;}j = j + 1;}} void draw () { frameRate(4);//textoPFont title_font = loadFont (“AvenirNextCondensed-BoldItalic-48.vlw”);textFont(title_font);textAlign (CENTER);fill (random(100),random(100),random(255));textAlign(CENTER);text(“PROOOCESSING”, 250, 200);text(“PROOOCESSING”, 250, 260);text(“PROOOCESSING”, 250, 320); //rostinhonoStroke();fill (#7703FF);ellipse(250, 400, 50, 50); //boca felizfill(#FCDB7D);arc (250, 408, 15, 15, 0, PI); //olhocircle(240,395,7);circle(260,395,7); if(mousePressed){ … Continuar a ler Processing III

Processing – Módulo I

Código: size (350,200); background (209,13,13); line(50,50,30,150); line(30,150,85,150); line(85,150,90,130); line(90,130,55,130); line(55,130,72,50); line(50,50,72,50); line(35,150,90,150); line(90,150,95,130); line(95,130,60,130); line(60,130,77,50); line(55,50,77,50); noFill(); quad(93,150,143,150,167,50,117,50); quad(132,65,145,65,129,135,116,135); noStroke(); fill(0,0,0); triangle(151,150,221,150,232,100); triangle(175,50,162,100,245,50); stroke(0); line(162,100,232,100); noFill(); beginShape(); vertex(251,50); vertex(323,50); vertex(318,70); vertex(293,70); vertex(275,150); vertex(255,150); vertex(273,70); vertex(245,70); endShape(CLOSE); beginShape(); vertex(256,55); vertex(316,55); vertex(313,65); … Continuar a ler Processing – Módulo I

Processing II

Segunda experimentação com o Processing: size (500, 500);background (#FCDB7D); int n = 10;int spacing = width / n; int j = 0;while (j < n) {int i = 0;while (i < n) {fill (#F492F5);stroke (#F492F5);square (10 + (i* spacing), 10 + ( j * spacing), 30);i = i +1;}j = j + 1;} PFont title_font = loadFont (“AvenirNextCondensed-BoldItalic-48.vlw”);textFont(title_font);textAlign (CENTER);fill (#7703FF);textAlign(CENTER);text(“PROOOCESSING”, 250, 200);text(“PROOOCESSING”, 250, 260);text(“PROOOCESSING”, 250, 320); noStroke();fill (#7703FF);circle(250,400,50); fill(#FCDB7D); rectMode(CENTER);rect(250,408,15,4); circle(240,395,7);circle(260,395,7); Suzana Mendonça MPTEC 2020 Continuar a ler Processing II

TypeCanvas (Processing)

size (500, 500); background (0,0, 255); float tamanho = 100; fill (0, 255, 0); stroke(255,0,0); strokeWeight (2); circle (width/2, height/2, tamanho * 4.25); circle (width/2, height/2, tamanho * 4); circle (width/2, height/2, tamanho * 3.75); circle (width/2, height/2, tamanho * 3.5); circle (width/2, height/2, tamanho * 3.25); circle (width/2, height/2, tamanho * 3); circle (width/2, height/2, tamanho * 2.75); circle (width/2, height/2, tamanho * 2.5); circle (width/2, height/2, tamanho * 2.25); circle (width/2, height/2, tamanho * 2); circle (width/2, height/2, tamanho * 1.75); circle (width/2, height/2, tamanho * 1.5); circle (width/2, height/2, tamanho * 1.25); circle (width/2, height/2, tamanho); circle … Continuar a ler TypeCanvas (Processing)

Módulo II — Processing (2/2)

Módulo II Composição & Desenho e Manipulação de Texto Repetição e Texto Código: size (2275,500); background (255,255,150); noFill (); stroke(255,0,0); PFont title_font = loadFont(“Avenir-Black-50.vlw”); // TEXTO push (); fill (255,0,0); textAlign (CENTER); textLeading (2); textFont(title_font); text (“MINIMUM”, width/2 , 470); … Continuar a ler Módulo II — Processing (2/2)

PROCESSING [MOD. II]

2º exercício Primeira experimentação:«Nós (não) somos transitórios» [ OP1 / / OP2 ] size(200, 600); background(0); //String[] fontList = PFont.list(); //printArray(fontList); //OP1 //PFont Main = loadFont(“BebasNeueBold-80.vlw”); //fill(225); //textFont(Main); //textLeading(85); //text(“NÓS”, 45, 80); //textAlign(RIGHT); //text(“SO\nMOS”, 170, 160); //textAlign(LEFT); //text(“TRA\nNSI\nTÓR\nIOS”, 45, 330); … Continuar a ler PROCESSING [MOD. II]

Módulo I —Processing (3/3)

Módulo I Exploração Tipográfica através das funções de desenho do Programa Formas Poligonais Código: size (1360,360); background (#F2DCDE); //T fill (#C98C21); noStroke(); beginShape(); vertex (80,80); vertex (80,120); vertex (120,120); vertex (120,280); vertex (160,280); vertex (160,280); vertex (160,120); vertex (200,120); vertex … Continuar a ler Módulo I —Processing (3/3)

Módulo I — Processing (2/3)

Módulo I Exploração Tipográfica através das funções de desenho do Programa Pontos e Linhas Código: size(760,520); background(#C98C21); strokeWeight(10); stroke (#121888); //E line(80,160,80,360); line(100,160,100,360); line(120,160,120,360); line(140,160,140,200); line(160,160,160,200); line(180,160,180,200); line(200,160,200,200); line(140,240,140,280); line(160,240,160,280); line(180,240,180,280); line(200,240,200,280); line(140,320,140,360); line(160,320,160,360); line(180,320,180,360); line(200,320,200,360); //D line(240,160,240,360); line(260,160,260,360); line(280,160,280,360); … Continuar a ler Módulo I — Processing (2/3)

Módulo I — Processing (1/3)

Módulo I Exploração Tipográfica através das funções de desenho do Programa Formas Simples Código: size (600,520); background (#121888); fill(#F2DCDE); rect (80,240,40,200); square (120,200,40); rect (160,120,40,80); square (200,80,40); rect (240,120,40,80); rect (280,200,40,120); rect (320,120,40,80); square (360,80,40); rect (400,120,40,80); square (440,200,40); rect … Continuar a ler Módulo I — Processing (1/3)

PROCESSING [MOD. I]

1º exercício Segunda experiência com processing«Nós não estamos algures» size(600,400); background (0); //fill(20);noStroke();rect(22,50,78,200);rect(105,50,78,200);rect(188,50,78,200); //fill(25);noStroke();rect(27,100,50,280);rect(78,100,50,280);rect(129,100,50,280); fill(40); //N noStroke(); rect(27,57,24,186); quad(32,57,54,57,91,243,71,243); rect(71,57,24,186); //fill(25); //rect(110,55,80,190); fill(40); //O arc(136,81,52,52,PI,PI+PI/2); arc(136,219,52,52,PI/2,PI); arc(152,81,52,52,PI+PI/2,PI*2); arc(152,219,52,52,0,PI/2); rect(110,81,24,138); rect(154,81,24,138); rect(134,55,20,190); fill(0); //meio O arc(142,88,20,24,PI,PI+PI/2); arc(142,213,20,24,PI/2,PI); arc(146,88,20,24,PI+PI/2,PI*2); arc(146,213,20,24,0,PI/2); rect(132,88,24,127); rect(140,76,8,12); … Continuar a ler PROCESSING [MOD. I]

Processing

Código da primeira experimentação com processing: size (1070,530); background(68, 181,154); //1noStroke ();fill (0);rect (30,30,260,50);fill (255);rect (45,30,50,100);fill (248,173,77);circle (70,105,50); //2noStroke ();fill (0);square (30,180,200);fill (255);circle (130,280,200);fill (248,173,77);circle (130,280,100);fill (0);rect (30,450,200,50);fill (255);rect (30,380,50,120);fill (68, 181,154);rect (30,280,50,100); //3noStroke ();fill (0);rect (570,180,200,50);fill (255);rect (720,180,50,120);fill (0);square … Continuar a ler Processing

PROCESSING I

Software Criativo I: DesenhoObjetivo: Desenhar um ou mais caracteres usando as funções de desenho do Processing. Primeiras Experiências Tipográficas size (650,500);background (#000000); //Letra Efill (#ffffff);rect (50,48,60,17);rect (30,65,20,50);rect (50,115,40,15);rect (30,130,20,50);rect (50,180,60,17); //Letra Rfill (#ffffff);rect (150,98,50,17);rect (130,115,20,83);rect (200,115,20,30); //Letra R2fill (#ffffff);rect (260,98,50,17);rect … Continuar a ler PROCESSING I

Processing

Primeira exploração de formas tipográficas em Processing. Código da composição size(600,600);background(#00458A); //«C»fill(#B396DB);noStroke();circle(180,200,200);fill(#00458A);rectMode(CENTER);square (280,200,200); //«A»stroke(#34FF6D);strokeWeight(4);beginShape();noFill();vertex(100,100);vertex(50,200);vertex(100,100);vertex(150,200);endShape();beginShape();noFill();vertex(80,140);vertex(120,140);endShape(); //«A»fill(#B396DB);noStroke();triangle(300,300,220,420,380,420); //«S»stroke(#34FF6D);strokeWeight(1);strokeCap(SQUARE); line(450,400,500,320);line(450,420,500,340);line(450,440,500,360);line(450,450,520,450);line(520,460,460,540);line(520,480,460,560);line(520,500,460,580); //«O»stroke(#34FF6D);strokeWeight(5);noFill();ellipseMode(CENTER);circle(400,100,140); Continuar a ler Processing

LetterForm (Processing)

Primeiro exercício: criação de 1 ou mais caracteres através da utilização das funções de desenho do Processing. size (500, 650); background (255, 0, 0); fill (0, 0, 0); //Y strokeWeight (5); triangle (150, 100, 200, 100, 175, 150); line (175, 150, 175, 200); //T strokeWeight (5); strokeJoin (ROUND); line (50, 50, 100, 50); line (75, 50, 75, 120); //P circle (300, 50, 50); line (275, 150, 275, 25); // i strokeWeight (5); strokeCap (ROUND); line (130, 250, 130, 350 ); //A triangle (250, 550, 275, 500, 300, 550); line (250, 550, 225, 600); line (300, 550, 325, 600); //D line … Continuar a ler LetterForm (Processing)

Processing

Software Criativo I: Desenho Exercício 1: Primeiras experiências e criação de caracteres através da utilização das funções de desenho do Processing.   Código: size(400,300); background(#f7b0be); //smile_cara noStroke(); fill(#ef3c23); circle(315,150,100); //olhos_smile fill(#f7b0be); circle(330,135,10); circle(300,135,10); //sorriso fill(#f7b0be); rect(290,156,50,5); rect(290,150,6,7); rect(334,150,6,7); //letra H … Continuar a ler Processing

PROCESSING [MOD. I]

1º exercício Primeira experiência com processing «Processing type» [ código disponível no fim do artigo ] size (500,300);background (20); //PnoStroke();fill(200);rect(20,10,7,140);rect(20,10,30,120);//RstrokeWeight (7);strokeCap (BEVEL);stroke (200);line(60,120,84,148);noStroke();fill(200);rect(55,10,7,140);rect(55,10,30,120);//Orect(90,10,30,140);//Crect(125,10,7,140);rect(125,10,30,80);rect(125,130,30,20);//Erect(160,10,7,140);rect(160,10,30,80);rect(160,110,30,10);rect(160,130,30,20); //Srect(195,10,7,110);rect(195,10,30,80);rect(202,110,23,40);rect(195,130,7,20);//Srect(230,10,7,110);rect(230,10,30,80);rect(237,110,23,40);rect(230,130,7,20);//Irect(265,10,7,140);//Nrect(277,10,7,140);rect(277,10,20,100);rect(287,110,20,40);rect(300,10,7,140);//Grect(312,10,7,140);rect(312,10,30,80);rect(312,130,30,20);rect(332,110,20,40);//…rect(357,110,30,40);rect(392,120,30,30);rect(427,130,30,20); //typenoFill();stroke(255);arc(110, 250, 100, 80, 0, PI / 2.0); // lower quarter circlerect(160,70,1,177);line(90,160,263,110);arc(200, 175, 50, 50, 0, … Continuar a ler PROCESSING [MOD. I]

Software criativo | Referências

Instalações interactivas com software criativo e visão por computador The Legible City (1989) | Jeffrey Shaw (na página, clicar em Legible City 1989)Text Rain (1999) Camille UtterbackReactive Books (1994-99) John Maeda + exemplos recentes:com Processing – ver galeria | Exemplos com Tipografiacom openFrameworks – ver galeria (ex.: Longhand Publishers) Software criativo: Processing(download da aplicação) Processing – Getting started por Casey Reas e Ben Fry Tutorial de iniciação ao Processing por Daniel Shiffman et al. (vídeo, 1h) Exemplo com o teclado como inputStrings tutorial + Tutorial data Exemplos disponíveis no OpenProcessing Exemplos de Tipografia generativa com Processing Exemplos criados por alunos de EDIT: Can U Feel It? Diana, Guilherme, SaraTipografia Generativa Beatriz Tutoriais de explorações de … Continuar a ler Software criativo | Referências

Design, Fabricação e Comunidades

Produzindo ideias: Fabricação Digital, FabLabs e Projectos para a Comunidadepor Juliana Soares (CV) REFERÊNCIAS BIBLIOGRÁFICAS BONSIEPE, G. (2015). Desobediencia proyectual. Conferência para o simpósio “Can design change society?”. Berlim, Alemanha. KOLAREVIC, B. (2003). Architecture in the Digital Age: Design and manufacturing. New York: Taylor & Francis. NEVES, H. (2013). Como criar um Fab Lab? Apresentação. Disponível em: < https://pt.slideshare.net/hdneves/workshop-conheca-o-fab-lab-como-criar-um-fab-lab &gt; Acesso dia 20 de fevereiro de 2020.  SOARES, J. M. M.; FONSECA DE CAMPOS, P. E. (2017). Crio porque preciso, imprimo porque é possível: estudo de caso de desenvolvimento de Tecnologia Assistiva através de impressão 3D em um espaço maker público. In: Anais do IV Congresso de Design do Amazonas. … Continuar a ler Design, Fabricação e Comunidades

Gil Rodrigues

Olá, chamo-me Gilmar Rodrigues, mas todos me tratam apenas por Gil. Nasci, cresci e fiz minha graduação em Brasília, em design de comunicação na Universidade de Brasília. Graduei-me em 2015. Academicamente e profissionalmente tenho tentado explorar ao máximo todas as oportunidades que identifico. Participei de empresa júnior, fiz estágio profissional, realizei pesquisas em grupos de investigação acadêmica na área de comunicação e redes sociais, morei por um ano e meio na Alemanha (2016–2017) onde participei como aluno convidado no mestrado em Type Design e na Irlanda por um ano (2018). Atualmente estou a viver em Lisboa, a cursar o mestrado … Continuar a ler Gil Rodrigues

Joana Azevedo

O meu nome é Joana Nobre Azevedo, tenho 23 anos e sou licenciada em Design de Comunicação pela Faculdade de Belas-Artes da Universidade. A minha formação académica em Design não começou na faculdade mas sim no secundário, quando frequentei a Escola Artística António Arroio e me especializei na área de Design Gráfico. Por gostar bastante da área em que me licenciei, considero-me uma pessoa criativa, com grande espírito de equipa e com forte vontade de encarar novos desafios, sentindo sempre necessidade de aprofundar conhecimentos acerca das várias vertentes do design. Assim, estou bastante motivada e disponível para desenvolver as minhas … Continuar a ler Joana Azevedo

Margarida Russo

Olá! O meu nome é Margarida Russo, sou designer gráfica e venho de Almada. O meu percurso no mundo do design gráfico começou em 2013. Optei por frequentar o curso de design gráfico no ensino secundário, onde tive a oportunidade de estagiar na Bold design, mais conhecida pela Loja das Maquetas. Após acabar o ensino secundário, decidi tirar a minha licenciatura em Design gráfico e multimédia na Escola Superior de Artes e Design das Caldas da Rainha, onde começou a surgir o meu interesse pelo Design Editorial, Publicidade e pela Tipografia. No meu estágio curricular tive a oportunidade de estagiar … Continuar a ler Margarida Russo

Suzana vd Tempel de Mendonça

Olá, sou graduada em Design Gráfico pela PUCPR em Curitiba (BR), 2017. Trabalhei durante os anos em 3 editoras diferentes além de estágios e trabalhos freelancer na área editorial ou como ilustradora. Amo quando os trabalhos a mim apresentados são compatíveis com meus valores sociais então meu portfólio está repleto de temas como sustentabilidade, feminismo e moda ética. No meio do caminho dei-me conta que eu estava com cede de ter mais embasamento teórico/conceitual então fui atrás de um mestrado específico da área editorial e cá estou :) Continuar a ler Suzana vd Tempel de Mendonça

Francisca Rodrigues

Chamo-me Francisca José Guimarães Rodrigues e nasci em 1989 no norte do país. Em 2007 ingressei em Design e Tecnologias das Artes Gráficas e em 2011 no mestrado em Design Editorial, ambos na Escola Superior de Tecnologias de Tomar – Instituto Politécnico de Tomar. No segundo ano do mestrado estagiei no JN mas, apesar de ter passado com distinção, não concluí o trabalho teórico e fiquei apenas com o certificado de especialização na área. Em 2013 mudei-me para Lisboa e começou, oficialmente, a minha vida profissional com um estágio num atelier de arquitectura. Foram 18 meses de trabalho muito intensos … Continuar a ler Francisca Rodrigues

Ana C. Bahia

Olá! :) Meu nome é Ana Carolina Bahia Fontes, mas todos podem me chamar apenas de Ana. Tenho 33 anos, sou natural de Belo Horizonte, Brasil. Desde meados dos anos 2000 me interesso pelas intersecções entre literatura e artes gráficas, época em que já editava, em parceria com alguns amigos escritores, dois fanzines. Em 2005 comecei a cursar Letras na Universidade Federal de Minas Gerais (UFMG), em Belo Horizonte, e por lá passei dois anos, quando um interesse crescente pelas qualidades gráficas dos livros me levou, em 2007, a iniciar meus estudos em design. Em 2012 terminei minha licenciatura em … Continuar a ler Ana C. Bahia

Maria Carolina Silva

Sou a Maria Carolina Silva, prefiro que me tratem por Carolina mas ter sempre os 3 nomes confere um certo charme. Nascida e criada em Lisboa (mas com ascendência no norte do país), tenho 21 anos e sou licenciada em Design de Comunicação pela Faculdade de Belas Artes da Universidade de Lisboa (2016-2019). Não tenho qualquer experiência profissional (ainda), entenda-se trabalho pago. No entanto, desenvolvo alguns projetos de design para instituições com as quais estou envolvida. Para além disso, divulgo o meu trabalho online (principalmente através do Behance e do Instagram). Tenho poucos trabalhos publicados até agora, o que irá certamente … Continuar a ler Maria Carolina Silva

Ana Margarida Matos

  Olá! :D O meu nome é Ana Margarida Matos e em 2019, licenciei-me em Design de Comunicação na Faculdade de Belas-Artes de Lisboa. Tenho 22 anos e sou da Póvoa de Santa Iria. Ao longo da licenciatura, uma das áreas que me despertou maior interesse foi design editorial, uma vez que me permitia expressar e desenvolver ideias de uma forma criativa e pessoal, autoral. Deste modo, ao terminar a minha licenciatura, considerei que o Mestrado em Práticas Tipográficas e Editoriais Contemporâneas, seria uma boa opção para poder aprender mais e desenvolver as minhas capacidades. Ainda não tenho muita experiência … Continuar a ler Ana Margarida Matos

Rafaela Tomé

Olá!! Chamo-me Rafaela Tomé e tenho 21 anos. Sou designer e nos (poucos) tempos livres bailarina de flamenco. Licenciei-me em 2019, no curso de Artes Visuais e Tecnologias na Escola Superior de Educação de Lisboa. Foi uma experiência bastante interessante e enriquecedora, é um curso que abrange tanto a parte gráfica e tecnológica como também a vertente das artes plásticas. Desde que ingressei no ciclo de estudos da licenciatura que sentia um desejo enorme de aprender mais sobre a área do design editorial e da tipografia. Foi por isso mesmo que me candidatei ao mestrado em Práticas Tipográficas e Editoriais … Continuar a ler Rafaela Tomé