Noises & Signals

Contemplations on creativity in our digital age

Page 3 of 3

Perlin noise “sound sphere” sketch

10/29/2016 / / Comments Off on Perlin noise “sound sphere” sketch

A sketch playing with the noise function of p5 and the sound library. The vertical positioning of each sphere, as well as the frequency of its oscillator, is shifted by stepping through the Y value of a noise sequence. The Z value of the noise sequence affects the diameter of the sphere and the amplitude of its oscillator.

Instructions:
Add the initial “soundsphere” by pressing the right arrow. Use the left & right arrow keys to delete or add more spheres. (You can add up to 20.)
Use the up and down arrows to adjust the speed of the step rate through the noise value.
Use the ‘a’ and ‘s’ keys to move the selector left or right (selector is displayed at the bottom).
Use the spacebar to change the wave type of the selected sphere (wave type will be displayed at the top right).
You can change the frequency range of the oscillator wave for the selected sphere using the following keys:
1 = Decrease lower limit of range by 50 Hz
2 = Increase lower limit of range by 50 Hz
3 = Decrease lower limit of range by 200 Hz
4 = Increase lower limit of range by 200 Hz
7 = Decrease lower limit of range by 200 Hz
8 = Increase lower limit of range by 200 Hz
9 = Decrease lower limit of range by 50 Hz
0 = Increase lower limit of range by 50 Hz
The lowest frequency limit is 60 Hz and the highest is 15 kHz.

The sketch will probably run more smoothly if you view it on its own page here. Source code available here and is commented in detail. One issue I’m noticing for future investigation – some audio “clicking” distortion occurs in certain frequency ranges.

Further exploration of arrays, objects and “scribbles” in p5

10/25/2016 / / Comments Off on Further exploration of arrays, objects and “scribbles” in p5

My latest experiment sketch with p5.js involving work with arrays. You will probably need to click on the image to activate it. Use the “t”,”s” and “c” keys on your keyboard to add a triangle, square or circle to the scene (size and color are randomized).

The sketch can be viewed on a separate page here (which will probably perform at a faster frame rate), and the p5 source code is available here. Each shape is added as an independent object to the master shape array. The number of elements currently in the master array is displayed at the top left. As the shapes fall and are shuttled off to the left or right (again, a random choice), they are “spliced” from the array after they leave the screen, hence why the count goes down.
This sketch also makes use of the p5.scribble library, which gives the shapes their jagged, “sketchy” appearance. If you un-comment the “randomSeed” statement in line 15 of the code, this will stop the animation of the jagged-ness, since the randomization used for that effect (in the p5.scribble code) is then “seeded” continually with the same number. (This number could be anything…not just “98”.)

Touchscreen pong with p5

10/18/2016 / / Comments Off on Touchscreen pong with p5

…so it’s not exactly an “extreme” or “ultimate” game of pong, but the challenge led me to try some previously unexplored functions in p5.js. This version currently works only with touch screens and is sized specifically for an iPad air: http://blog.rich-path.com/p5/pong/  (p5 source code is available here)
p5 pong game screenshot

Particularly interesting elements of developing the game for me were:

  • Coding the scoring system. Points are gained by each player when the small light blue marble “ball” hits one of the 3 larger marbles in the center (based on the direction of the ball). The 2 outer targets are worth 10 points, the middle is worth 20. The numbers display the accumulated score for each player; however, if a player misses the ball with their paddle, they lose all of the points that they scored during that round (their score resets to that of the previous round). The target hit detection makes use of p5’s dist() function.
  • Using the oscillators and envelopes in the p5.sound library. This example was particularly helpful in getting started with sound generation, though I by-passed the MIDI note conversion and am providing the oscillator with a specific frequency value. Also, to prevent an audible note from immediately playing at the start of the game, the oscillator is creating a super-low frequency of 1 Hz until a target is hit and a different tone is played…a bit of a hack until I come up with a better solution.
  • Use of the built-in touches array to detect fingers on a touch screen. I found the short example sketch listed in the first response from lmccart on this page to be quite useful in figuring out how to track (and limit the number of) touches on a screen. The paddles and ball won’t move unless at least one finger is on either side.
  • Changes in velocity depending on which part of the paddle hits the ball. Basically using a combination of the map() function and some hit-or-miss experimentation with calculations for this – the ball will move slower and more vertically straight when it hits the center of a paddle, and the angle and speed increases greatly towards the edges.

A simple sine wave scrolling landscape in p5

10/14/2016 / / Comments Off on A simple sine wave scrolling landscape in p5

In this small sketch, four separate landscape ranges are created in a for loop (counting down the variable i from 5, so that the largest range gets drawn first to appear furthest in the background layers). The sin() function is fed with an ever slightly increasing amount (+.06 each frame) from the a variable (responsible for the wave shapes) and the changing i variable from the for loop, responsible for the height (and thus perspective depth) of each range. The a variable is also used to modulate the background color that slowly shifts from a blue sky to black night.

Source code available here.

p5.js Animation Experiment – Colorful “Bubbles”

10/11/2016 / / Comments Off on p5.js Animation Experiment – Colorful “Bubbles”

A small experiment using p5.js – create a loop of ellipses drawen in random sizes and colors that rise to the top of the canvas at random speeds, and move slightly left & right.

The larger non-iframe version can be viewed here. The p5 code can be viewed here.

An issue to fix – once each ellipse moves beyond the top of the canvas (based on 0 minus current ellipse height), it should be moved back below the bottom (the canvas height value plus the current height of the ellipse), and then rise again from there. However, some of the shapes don’t get reset below the bottom of the canvas…they just appear in the visible lower portion and then begin their ascent. This causes a “popcorn” effect visually…more exploration is needed to figure out why this is happening…

“SAFE” video project

10/11/2016 / / Comments Off on “SAFE” video project

The final version (…at least for now…) of my video “challenging current technical pathways”: SAFE

The password for viewing is the same password that you used to access this blog post.

During the in-class critique last Friday (10/7), it became clear to me that the length of both sections – the collection of narrated accounts in the first half and the fictional ad in the second – had to be shortened. Given the deadline for the project and the footage that I had available to work with, it made more sense to keep the focus of this hypothetical technology related to children and their “protection”, instead of immediately including applications for adults as well. The news story screenshot montage at the beginning is still too “visually basic” for my tastes…perhaps that will be reworked in further exploration of video effects and filters (ah, the hat of compromise that sometimes must be donned when one hits a deadline…)

Most of the footage used in the ad section was shot during the Supernova outdoor animation festival, Sept. 24 in Denver, CO. The music track used for the ad is by Lusine ICL – “Headwind” from the album Language Barrier.

Protected: Further thoughts and variations on the first video assignment

09/27/2016 / / Comments Off on Protected: Further thoughts and variations on the first video assignment

This content is password protected. To view it please enter your password below:

Protected: Draft of storyline for first 4010 video project

09/20/2016 / / Comments Off on Protected: Draft of storyline for first 4010 video project

This content is password protected. To view it please enter your password below:

On Rushkoff & Morozov

09/20/2016 / / Comments Off on On Rushkoff & Morozov

My initial response to Rushkoff’s argument in the introduction to “Program Or Be Programmed” is that not everyone needs to, or should learn how to, program. Not everyone is interested in that level of detail in and engagement with technology, and the idea that being able to program is the only choice that people have to be empowered in the face of new technological tools could actually be demoralizing to them rather than empowering. Within the grey space between the polar notions of “program or BE programmed”, I feel there are some other considerations and possibilities:

  • Increased critical attention and reaction to the content delivered via existing applications.
  • Increased self-awareness and critical analysis of how & why we are using these applications.
  • A deeper understanding & exploration of the limitations imposed by the interfaces and applications they use, and how those systems can be hacked, re-purposed or re-directed within their constraints (not necessarily through manipulating code).

Rather than courses instructing students how to program or simply use applications, could the evolution of media education consist of not only a critical review of content but also of the applications, interfaces and devices themselves? (Makes me wonder if this is being done anywhere in the K-12 group…?)  Other considerations…the loose definition of “programming” – such as programming a recording device, or programming referring to customization…

In the intro of “To Save Everything”, Morozov imagines the extreme conclusion of the (Silicon Valley) solutionist vision, a world produced by those on a mission to “solve problems”. After re-reading, I noticed that absent from this particular section is a greater consideration of the real underlying force of this mindset – to be profitable and to “get big or get out”. (A wonderful response to this mindset has been composed by David Heinemeier Hansson, founder and CTO of Basecamp: https://m.signalvnoise.com/reconsider-41adf356857f#.nxxqbbvhc) Perhaps Morozov addresses this profitability motive later in the book…

Morozov’s description of life in 2020 seems almost dated given the current-day common presence of voice assistants on smartphones, people wearing Fitbits, and the increased testing of self-driving vehicles. Technology investors, easily-distracted individuals, and those preoccupied with flaunting the latest and greatest in technological fashion are likely to embrace such a future. Who isn’t? Aside from the self-proclaimed luddites and the Amish, I want to say “the people still in touch with their bodies”, but I’m not sure that’s accurate…

I have very mixed feelings about Morozov’s viewpoint – on one hand, his (and Rushkoff’s) argument is underscored…somewhat…by videos such as Google’s “Year In Search” series, which strives to highlight the hopeful side of human nature and behavior…made possible by the Google search engine and YouTube. (Does searching for a topic equal a sympathetic response for it, or an action to do something about it?) On the other hand, without companies like Google or Microsoft, would we have devices like the Tilt Brush or the Kinect camera available for new modes of artistic and creative expression?

Newer posts »

© 2024 Noises & Signals

Theme by Anders Noren — Up ↑