Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

In this Discussion

Participants: Derya Akbaba * Ben Allen * Natalia-Rozalia Avlona * Kirill Azernyi * Erin Kathleen Bahl * Natasha Bajc * Lucas Bang * Tully Barnett * Ivette Bayo * Eamonn Bell * John Bell * kiki benzon * Liat Berdugo * Kathi Berens * David Berry * Jeffrey Binder * Philip Borenstein * Gregory Bringman * Sophia Brueckner * Iris Bull * Zara Burton * Evan Buswell * Ashleigh Cassemere-Stanfield * Brooke Cheng* Alm Chung * Jordan Clapper * Lia Coleman * Imani Cooper * David Cuartielles * Edward de Jong * Pierre Depaz * James Dobson * Quinn Dombrowski * Amanda Du Preez * Tristan Espinoza * Emily Esten * Meredith Finkelstein * Caitlin Fisher * Luke Fischbeck * Leonardo Flores * Laura Foster * Federica Frabetti * Jorge Franco * Dargan Frierson * Arianna Gass * Marshall Gillson * Jan Grant * Rosi Grillmair * Ben Grosser * E.L. (Eloisa) Guerrero * Yan Guo * Saksham Gupta * Juan Gutierrez * Gottfried Haider * Nabil Hassein * Chengbo He * Brian Heim * Alexis Herrera * Paul Hertz * shawné michaelain holloway * Stefka Hristova * Simon Hutchinson * Mai Ibrahim * Bryce Jackson * Matt James * Joey Jones * Masood Kamandy * Steve Klabnik * Goda Klumbyte * Rebecca Koeser * achim koh * Julia Kott * James Larkby-Lahet * Milton Laufer * Ryan Leach * Clarissa Lee * Zizi Li * Lilian Liang * Keara Lightning * Chris Lindgren * Xiao Liu * Paloma Lopez * Tina Lumbis * Ana Malagon * Allie Martin * Angelica Martinez * Alex McLean * Chandler McWilliams * Sedaghat Payam Mehdy * Chelsea Miya * Uttamasha Monjoree * Nick Montfort * Stephanie Morillo * Ronald Morrison * Anna Nacher * Maxwell Neely-Cohen * Gutierrez Nicholaus * David Nunez * Jooyoung Oh * Mace Ojala * Alexi Orchard * Steven Oscherwitz * Bomani Oseni McClendon * Kirsten Ostherr * Julia Polyck-O'Neill * Andrew Plotkin * Preeti Raghunath * Nupoor Ranade * Neha Ravella * Amit Ray * David Rieder * Omar Rizwan * Barry Rountree * Jamal Russell * Andy Rutkowski * samara sallam * Mark Sample * Zehra Sayed * Kalila Shapiro * Renee Shelby * Po-Jen Shih * Nick Silcox * Patricia Silva * Lyle Skains * Winnie Soon * Claire Stanford * Samara Hayley Steele * Morillo Stephanie * Brasanac Tea * Denise Thwaites * Yiyu Tian * Lesia Tkacz * Fereshteh Toosi * Alejandra Trejo Rodriguez * Álvaro Triana * Job van der Zwan * Frances Van Scoy * Dan Verständig * Roshan Vid * Yohanna Waliya * Sam Walkow * Kuan Wang * Laurie Waxman * Jacque Wernimont * Jessica Westbrook * Zach Whalen * Shelby Wilson * Avery J. Wiscomb * Grant Wythoff * Cy X * Hamed Yaghoobian * Katherine Ye * Jia Yu * Nikoleta Zampaki * Bret Zawilski * Jared Zeiders * Kevin Zhang * Jessica Zhou * Shuxuan Zhou

Guests: Kayla Adams * Sophia Beall * Daisy Bell * Hope Carpenter * Dimitrios Chavouzis * Esha Chekuri * Tucker Craig * Alec Fisher * Abigail Floyd * Thomas Forman * Emily Fuesler * Luke Greenwood * Jose Guaraco * Angelina Gurrola * Chandler Guzman * Max Li * Dede Louis * Caroline Macaulay * Natasha Mandi * Joseph Masters * Madeleine Page * Mahira Raihan * Emily Redler * Samuel Slattery * Lucy Smith * Tim Smith * Danielle Takahashi * Jarman Taylor * Alto Tutar * Savanna Vest * Ariana Wasret * Kristin Wong * Helen Yang * Katherine Yang * Renee Ye * Kris Yuan * Mei Zhang
Coordinated by Mark Marino (USC), Jeremy Douglass (UCSB), and Zach Mann (USC). Sponsored by the Humanities and Critical Code Studies Lab (USC), and the Digital Arts and Humanities Commons (UCSB).

Code Critique: Livecoding Visuals with Hydra

I wanted to post a couple examples from languages that have been developed specifically for livecoding- the act of creating music and visuals with code in front of a live audience.

So here is an example of Hydra, a JavaScript-based language for visuals developed by Olivia Jack which does a wonderful job imitating old school multichannel video synthesis. This was written by Flor De Fuego. Its result can be run here (which remains editable in browser).

• Title: Let The Chaos Rule the Rest
• Author: Flor De Fuego
• Language: Hydra (authored by Olivia Jack)
• Year: 2019

    //Flor de Fuego 
    osc(300,0.1) .contrast(3) .diff(osc(3000,0.1).rotate(5),1) .modulateScale(osc(3,0.1).kaleid(200),-0.9) 
    .modulateScale(osc(6,0.1).rotate(11).kaleid(-200),0.5) .mult(osc(1,0).kaleid(200).scrollX(0.1).scrollY(-0.1),0.8) 
    .blend(shape(200,0.01).scale(0.5,0.5).color(1,0,0) 
    .add(shape(4,0.1).color(1,0,0).scale(0.5,0.5).scrollX(()=>Math.sin(1*time)*0.26),1).rotate(0,0.8) 
    .add(shape(200,0.1).scale(0.5,0.5).scrollX(()=>Math.sin(1*time)*-0.47).color(0,0,1),1),0.5).rotate(0,0.5) 
    .mult(shape(200,0.01).scale(0.5,0.5) 
    .add(shape(4,0.1).color(1,0.5,1).scale(0.5,0.5).scrollX(()=>Math.sin(1*time)*0.26),1).rotate(0,0.8) 
    .add(shape(200,0.1).scale(0.5,0.5).scrollX(()=>Math.sin(1*time)*-0.47),1)).rotate(0,0.5) 
    //.color(1,[0,1],[0,1]) .rotate(0,0.8) .modulateRotate(osc(2),-1) .saturate([3,4,5,6,10].fast(8))
.diff(src(o0).modulateScale(osc(()=>Math.sin(1*time)*20,0.5),0.03).scrollX(()=>Math.sin(1*time)*0.001).scrollY(()=>Math.sin(1*time)*-0.001)) .modulate(o0,()=>Math.sin(1*time)*0.0001) .mult(shape(4,1).scrollY(-1).modulateScale(osc(3,0.5),-0.5)) .luma(0.1) //.add(src(o0).scrollX(0.01),0.001) //.mult(src(o0),0.01) //.luma(2) .out()

Here is another example, written by Flor and Zach Krall in collaboration. Its result can be seen here (which remains editable in browser).

• Untitled
• Authors: Flor De Fuego and Zach Krall
• Language: Hydra (authored by Olivia Jack)
• Year: 2019

                osc(8,-0.1).color(1,1,1.3).scrollY(1,0.1)
                .modulate(osc(10,0.5).modulate(noise(2)))
                .modulate(noise(20,-1))
                .modulateRotate(noise(10,0.1))
                .modulate(osc(8,0.1)
                .modulate(noise(2))).modulate(o0,0.05)
                .modulate(o1,1).out()
                noise(3,0.1).modulate(noise(1),1)
                .contrast(5).modulateRotate(o1)
                .modulate(o1,1).out(o1)

I'd be happy to to discuss the ins and outs of the code (here is the Hydra Github and master function list), but wanted to mention a couple ancillary thoughts-

One of my favorite things about Hydra is the upload button in the web-based version, which sends whatever you’re working on to the Hydra Patterns Twitter Bot, where then anyone in the world can click, and then edit your code, and then publish their version based on yours, all with attribution. I have never met Flor in-person, whose code is above, yet this language brought us together. Likewise, Zach and Flor collaborated on this code across thousands of miles without having yet met in-person.

This is a little bit of a personal aside, but as I’ve become a participant in the livecode/algorave scene, one of my favorite things about it has been an emerging political context, particularly among audience members. Several times I’ve met “disaffected tech workers” who wanted to come see livecoding to “see what could be created with the same tools” that aren’t in the service of big corporate tech. As a programmer who had just left Facebook recently said to me at a recent show “I’d rather create algorithms that make people dance than chase the monetization of data to political and social destruction.”

Comments

  • I was thrown off at first by the link -- I didn't realize that it directed to the editor homepage which was loading a default demo sketch, and not the featured sketch with code listed above.

    Regarding the "Let The Chaos Rule the Rest" code as given -- are those commented-out lines supposed to be included or omitted? I ask because the last line does not contain an .out() (it is commented out) -- and I believe that this makes the sketch compile but produce no new output. So cutting and pasting the code into hydra-editor does nothing but continue to show the previously loaded default sketch untiil an .out() is added -- am I right?

    For the "Untitled" sketch, it was particularly interesting how resilient its design was. I used the built in "make random change" feature to randomize settings ~30 times, and that tweaked things about the texture and relative motion, but it was not until it finally hit a color() setting and the hue changed that it finally seemed to "jump" to a substantially different appearance.

    One surprising thing about the live-editor is that it isn't tied to language documentation. I found that here:

    https://github.com/ojack/hydra/blob/master/docs/funcs.md

Sign In or Register to comment.