Findings While Browsing Art

homepages.utoledo.edu/mditore Critique Do not link name and last name with an artwork (p5.js) Change the location of Contact, also change the name to call it Blog Make sure that the Generative art is linked to the page or use a photograph to linked it to the p5.js site Make sure that all formatting is unified Correct grammar mistake in Animation on page 1  Photographs sizing on portfolio: Print

 We have reached week 14th of the 2023 Fall semester...It is the week when our final presentations are due.  Personally, I have gained an understanding of the processes that are involved to create digital, generative, interactive and other related contemporary visual art.  We not only have learned how to code in order to build a personal website, but have created sketches with p5.js and interactive art using GIFs, videos, sound, and other media. Each classmate's contributions and critiques have helped us to improve our artworks. These were weeks of intensive focus in learning/understanding the step-by-step or line-by-line combination of letters, numbers and other special characters that translate html, CSS, JavaScript into a work of art.  Professor https://barrywhittaker.com/ William (Barry) Whittaker's class schedule was a guide helping us to move forward despite the personal frustrations maybe due to errors in spelling, or, spaces or characters that should not have...

https://osinachi.com/bio/ https://www.njidekaakunyilicrosby.com/   https://kehindewiley.com/ https://www.devanshimoyamastudio.com/ https://tschabalalaself.com/ https://xcopy.art/ https://mattkane.com/ https://coldie3d.com/ https://www.sarahzucker.com/

https://github.com/processing/p5.js/wiki/Positioning-your-canvas  

https://lokeshdhakar.com/projects/lightbox2/   https://github.com/lokesh/lightbox2/releases \ When pressing the larger image and the first smaller image  of the second row of the grid the following image appears in a larger size. Questions: How to center the grid? How to avoid the grid disappearance when a image is highlighted? 

 

A German data analyst and software developer, who created the R package generative art that "introduces human-independent randomness to creative processes."  https://rpubs.com/izzy-shehan/750493 The artist's personal website:  https://katharinabrunner.de/ She grew up in Germany, in a small farm-based village of 7,000 people, but she does not believe that she could live in a small city anymore. At the time of her interview in 2018,  https://www.youtube.com/watch?v=lfUr31XEbac she was living in Vienna, with plans to move to Copenhagen or maybe to Sweden, where she graduated from the School of Design in UMEA.  Example of Katharina Brunner's Generative Art In this website (11-28-2018), we can find the artist's step by step coding process to create her artwork: https://katharinabrunner.de/2018/11/generative-art-many-thousands-points-can-form-beautiful-images/ "Brunner’s process for creating generative art is to first,  set up  the specific directory structure t...

The article introduces concepts and its definitions to apply when designing digital interface game (digital experience) or website.  Nodes Branch Types of controls Denotation Connotation Divergent Convergent Entry Point Faux Choice (False Choice) Gamification Geon Theory or Recognition by components theory (Irving Biederman) Geons (geometric icons) Icons Pictograms Isotypes (used in Europe in the 1940s-1960s Column Grid Modular Grid Hierarchical Grid Hick's Law (the more choices a person has, the more time it will take to process the decision) Digital Interface Menu Signals: audible or visual indication that an interaction is taking place to activate or change a particular object. Cues: response that the signal has been activated.

  Interdisciplinary Interaction Design "Interaction design has many dimensions to it.  It  addresses how people deal with words read images explore physical space think about time and motion how actions and responses affect human behavior Various disciplines  make up interaction design , such as  industrial design cognitive psychology user interface design and many others.  It is my hope that this book is a starting point for  creating a visual language  to enhance the understanding of interdisciplinary theories within interaction design. The book uses concise descriptions, visual metaphors and comparative diagrams to explain each term's meaning. Many ideas in this book are based on timeless principles that will function in varying contexts"--Provided by author James Panafino, 2012

Positioning the p5.js sketch canvas in the website (November 16) https://github.com/processing/p5.js/wiki/Positioning-your-canvas   How to structure a effective Typographic Hierarchy https://www.toptal.com/designers/typography/typographic-hierarchy Writing About your Work https://creative-capital.org/2013/01/03/writing-about-your-work/ https://theabundantartist.com/how-to-write-an-artists-statement-that-doesnt-suck/ https://www.artbusiness.com/artstate.html Image Maps https://www.w3schools.com/html/html_images_imagemap.asp In Dreamweaver https://helpx.adobe.com/dreamweaver/using/image-maps.html Rhizome https://artbase.rhizome.org/wiki/Main_Page V2 https://www.v2.nl/ Intercommunication Center https://www.ntticc.or.jp/en/ Penny Stamps Lectures  https://stamps.umich.edu/penny-stamps-speaker-series Light Box Query https://lokeshdhakar.com/projects/lightbox2/ Google Fonts https://fonts.google.com/ Meta Tags https://www.w3schools.com/tags/tag_meta.asp How to Create Tooltips https://...

https://lauren-mccarthy.com/   Lauren McCarthy is a Chinese-American artist who has created p5.js,"an open source programing language for learning creative expression through code online. Also, she promotes software literacy within the visual arts and visual literacy within technology-related field and to make these fields accessible to different communities." She is involved in Performance Art, Installation Art, Artificial Intelligence, Programed computer-interaction. Through her art she develops social commentaries towards finding available tools to  improve human social interactions. "My work is a critique of the simultaneous technological and social systems we are building around ourselves. What are the rules, what happens when we introduce glitches? I create performances inviting viewers to engage. To remote control my dates. To be followed. To welcome me in as their human smart home. To attend a party hosted by artificial intelligence. In these interactions, there ...

  https://www.youtube.com/channel/UCvjgXvBlbQiydffZU7m1_aw

Apply animation on the static round shapes Get rid of stroke around the image Apply a variable on the rotation https://editor.p5js.org/carmeli2024/sketches/WV9OSsWlP

At the move of the cursor/mouse the photograph/image enlarges/zoom out and leaves a mirror-like image of the square/rectangular shape of the zoom out movement track.  Simultaneously, a yellow small round shape becomes the center of a larger circle that is formed by the movement of yellow square shapes. This becomes a continuous loop circle around the center, that it is modified as the cursor/mouse is moved to other location. Problems : How to make the loop to become intermittent or pause for a period of time to make the circle loop in another location?                    How to make the zoom in and zoom out of the image/photograph a separate animation than the previous mentioned animation of shapes: circle movement?                    What other static or animated features can be included in the final artwork? https://editor.p5js.org/carmeli2024/sketches/fee1nh-D_ let angle...

Generative Art: "is a process of algorithmically generating new ideas, forms, shapes, colors and patterns. First, you create rules that provide boundaries for the creation process. Then, a computer follows those rules to produce new works on your behalf." Algorithm Art or Code Art or Procedural Art: "It is a step-by-step method of solving a problem. And it is one of the fundamental building blocks of computer science." https://aiartists.org/generative-art-design   Michael Hansmeyer Manolo Gamboa Naon Anders Hoff Katharina Brunner       https://katharinabrunner.de            / https://x.com/MSchories/status/1084766780701184000?s=2 Jon McCormack Brian Eno Roelof Pieters and Samim Winiger, co-founders of  https://creative.ai/ Fernando Ramallo Meatt Pearson Mark J. Stock Casey Reas Frieder Nake Georg Nees Michael Noll Grace Hertlein Muriel Cooper Ben Fry Muriel Cooper Scott Draves Anastasia Opera Sol Lewitt Daniel Shiffman Lauren...

  let img; let diameter; function preload(){   img=loadImage("images/blog.png"); } function setup() {   createCanvas(1280,720);   imageMode(CENTER); } function draw() {   background(255,0,245,1);//purple color   diameter=map(mouseX,0,width,10,700);   image(img,width/2,height/2,diameter,diameter);   line(200,700,200,5);   line(1060,700,1050,5);   strokeWeight(1);   stroke(0);   if(mouseIsPressed){     stroke(0);   }else{     stroke(255,255,0,1); } fill(255,255,1,255);//yellow color   stroke(5); ellipse(mouseX, mouseY,30,20);//moving round shape ellipse(130,130,250,250);//static round shape upper left fill(255,1,0,255); ellipse(1150,498,250,255);//color red }

function setup(){   createCanvas(800,600);   strokeWeight(5); //white lines and stroke around shapes  } function draw(){   background(0,165,10,1); //green background   stroke(1);   line(100,600,100,50); //black vertical line   if(mouseIsPressed){     stroke(0);   }else{     stroke(255,255,255); // color white in upper horizontal and diagonal lines } fill(255,0,0); // color red of the shapes: round, rectangular   line(800,50,50,50);   line(1200,800,50,50);   rect(300,200,160,85);   rect(400,250,160,85);   rect(550,5,160,85);   rect(300,5,160,85)   rect(50,10,160,85);   rect(600,390,100,100);   stroke(1); // black lines diagonal described below   line(1,100,100,100); //black short horizontal line   line(100,100,1400,880); //black diagonal line  stroke(255); // color of stroke around moving shapes are the same as the static ones ellipse(mouseX, mouseY,50,50); ellipse(100,...

https://vimeo.com/60735314 Ultra_Lab:  Credits: Serrin.TV and Abelardo Gil-Fournier (Director) https://processing.org/examples "Documentary on creative coding that explores the role that ideas such as process, experimentation and algorithm play in this creative field featuring artists, designers and code enthusiasts. The documentary is built itself as a continuous stream of archived references, projects and concepts shared by this community." "What is time for? Time is what hinders everything from being given at once...it retards...it is retardation...it must be elaboration...creation or choice...determination of things." { OBSERVE , VISUALIZE , CREATE } "...processes that need all participants to come to an agreement in order to operate, to share codes, recipes or instructions"... "...find tools that interact with processes"... "...computers will invade the arts, just as they do in any other parts of our lives...may have to learn new skil...

https://editor.p5js.org/  Note: there is an error on line 6...the extra number 4 is not part of the code of the image. It was inadvertently added when I pressed Command+Shift+4 for the screengrab. Websites: https://p5play.org/ https://www.mamp.info/en/downloads/ https://github.com/processing/p5.js/wiki/Local-server https://p5js.org/books/