Week 9 & 10

9th November – 22 November 2020

Experiments in processing


I started with Dan Shiffman’s ‘Loop Mouse’ example, the shaded area follows the mouse. My initial intention was to reverse the dark area with the light creating a kind of focused light area and I also wanted to make the canvas portrait and all the lines vertical. I made many variations of this sketch none where exactly what I set out to do but they were still interesting, I will insert the experiments below.

This was my first vacation and my goal was to change the dan Shiffman sketch so that it’s portrait and the lines/rectangles are horizontal which I managed to achieve. There were parts of this code that I didn’t recognise and don’t think I’ve worked with before which is why some of the following sketches are a little strange as I was trying to change different values throughout the sketch to learn about what the code was there for and that each variable was changing. I also added stroke(30) in the above sketch for this reason as I wanted to clearly see what I was affecting when changing numbers which is why this change is present throughout many of the examples.

I really wanted to change the colour to reverse the black and white ( which I was unable to achieve) but any variation I tried and attempted would always come back with a black/grey middle focus.In this particular example I used something like fill(distance,0,0,125); above the rectangle and I also created two rectangles instead of one which created these kind of strange gradients with the red scale .

I actually really liked the pink part of this sketch as it was somewhere between cartoon and almost a 3D kind of popping out effect and it was achieved with the offset values of the two rectangles. But then again I don’t feel like the black rectangles following the mouse fit into this image at all it would probably be more effective by itself. It’s important to point out that my idea foe developing that dan showman sketch was to portrayed focused and almost censored timelines hence the portrait size of the sketch.

Since I though the black rectangles were too harsh in the above sketch I managed to adjust the transparency changing the colour to grey which was a much more subtle effect.

This sketch, where I finally figured out how to change the height of the rectangles slightly, reminded me ore of those simplistic timelines I began with in other sketches last week. but it’s very minimalistic and simple, and the rectangles aren’t big enough to suggest images or posts on a timeline but the white bar is quite effective.

Here I made the rectangles bigger but these black gaps appeared and I wasn’t really sure where they came from but it was something to do with changing the i value.

This one seemed most like a timeline and it was the last variation I made for now. I enjoyed making so many varying sketched from one origin I think it’s important sometimes to sit for an hour and to limit yourself to see what you can creatively produce as well as learning and analysing. I may not have achieved everything I set out to do but I actually managed to do some of it and beyond so I think this was very productive and my aim is to attempt this with another two example sketches.

My other ideas for this sketch would be to try the tint() function and see if that can affect the colour and possibly spitting the sketch in half with two different colours to represent timelines if the tint() function does work.

The tint didn’t work, I’m not sure why but after taking a break I still went back to this sketch, I though I’d start working on something else but I ended up making more variations.

I introduced a switch state so that the colours would change when the ‘timeline’ was clicked with the mouse. I was working on adding text put realised I was looking at a p5.js example and got discouraged after trying to make it work for quite a while. I think this sketched tied in quite closely to what I was working on at the end of last week but I enjoyed the fact I didn’t need to make a fake timeline in Photoshop and instead everything was coded within processing achieving that minimalistic effect in a much more refined way. I realise it’s probably not necessary for me to input nearly every variation of this sketch on here but then again I thought it’d be nice to display the process of how I work when I code and I like how some of the outputs seem so unrelated but they turn out to be some of my favourites and I hope in the future looking back they will be as much a source of inspiration as the sketches I perceive as ‘relevant’. It’s also nice to compare the later experiment variations to the original Dan Shiffman sketch which I started with to show how something can be an inspiration but definitely doesn’t mean that I just took someone else’s code and stuck my name on it, I always enjoyed completely changing what someone had started with but trying my best to learn along the way.

Sketchbook page, planning which sketches to work on.

While doing research for my extended essay I realised it may be important to include how fake news and fake information is so widely spread now and this is the cause for some of the divides it’s this untrue information that influences how people feel, who they support and further determines their actions. Therefor, I think it may be important to mention the world of deep fakes and how more than ever it’s extremely easy to manipulate people into believing something because lies no longer are just headlines used as clickbait, now it’s possible to create videos where faces are swapped to other peoples and this kind of software is becoming easier to access as all you need is an email address and a credit card. Amber gave me some of these great sources that I will link below. During my studio day I want to document more of the yes/no type of approach and work but I wanted to address this observation now so that it’s something I can come back to and explore further in the future.



‘It’s good for journalists to start getting in the habit of tracking down creators of mysterious web content. And it’s good for the rest of us to start expecting as much from the media. When deepfakes fully arrive, we’ll be glad we’ve prepared. For now, even if it’s not ideal to have amateur political operatives exposed to the ire of the internet, it’s better than carrying on as if we can still trust our lying videos.’ – Dr Regina Rini

Back to processing…

So tomorrow is studio day and I really want to try out this 3 screen/monitor idea me and Jen were talking about. Right now I’m going to try and create some example code so I have something for tomorrow but I just realised that I’m not really sure how I would go about connecting to 3 monitors in real time (especially under these circumstances where I can’t just ask to borrow someone’s laptop or cable for 5 mins) as I only have 1 HDMI port. But I didn’t want to get discouraged by this because If I was to just record and try to show the sketches I make through this video I can’t be sure of what the lighting in the studio will be like and it can’t be guaranteed that there’s no strange reflections on the screen and other little technical hiccups which is why I thought I’d get some footage and this would be a great opportunity for me to play around with and try to get better at After Effects. I remember we had a project with Gillian in 2nd year where we used After Effects and some of the workshops were about mapping video footage onto a phone screen even a moving one so this gave me the idea to just record 3 blank screens and actually add the visuals later which would cancel out weird screen reflections and it allows me to put in work which I make after Friday and potentially I could import various sketches and create a video with maybe 3 different ideas in this same format, it also puts me out of my comfort zone since video editing isn’t something I’m particularly good at.

So I made two very simple sketches for the YES and the NO screen but there are a few things I want to change and I know are possible I’ve just forgotten how to do them. I want to figure out how to fade a screen properly because the transparent rectangle doesn’t work very well because there are grey shadows left behind in the background, but this actually works quite well for my sketch because I’m using greyscale however I would still like to figure out what the other way to do it is. Also I would like to have a way to control how many “yes” and “no” will show up on the screen, right now I don’t really understand how that’s determined as it just uses the random function in place of the mapping. And of course I want to try out different fonts and make a sketch where these two are combined for the middle screen. Overall, I think it’s a good start and to have something visual to reference, this sketch has a lot of potential and I’ll be looking to experiment with images or videos and see what is the most visually effective.

“One consequence of this so-called confirmation bias is that people often seek out, recall and understand information that best confirms what they already believe.”


Cornor pin

I have had a little less time than usual to work on studio since I’ve been focused on DH&T and writing my essay leading up to the deadline for the first essay draft on the 27th but because I’ve been looking at a lot of varying sources and research I have found some interesting things to add to my studio research and I had some realisations that will help when moving forward with studio work. I will definitely be looking into incorporating the idea of fake news, how they’re spread and the impact and effect they may have down the line as well as questioning these algorithms that no one seems to fully understand anymore just like some machine learning software is a mystery because we don’t know exactly how a machine ‘thinks’ once we add artificial intelligence to the mix, and questioning these algorithms and trying to understand how they work or even improvising and making up how they work could be an interesting patch to take. But I have managed to record the 3 monitor idea and get some footage before the studio closed due to Glasgow and Renfrewshire heading into tier 4. I’m really happy with my decision to record 3 empty screens because especially now that I won’t have access to the studio it’s extremely handy that I will be able to swap out the footage and stage example code if it’s necessary. I also enjoyed the fact that I got to learn about something incredibly simple (the corner pin effect in premier pro) that I just didn’t know about before and it made my work much easier. I managed to make a short 30 second video with the yes and no sketches it’s extremely simple right now and there’s defiantly a lot of room for improvement or development but it was still something practical and different for me to try. I still want to take the video into After Effects and try to mask and track the part where my head is in the video in front of the screen but I realise I made the mistake of not having a green screen so it’s probably not going to work very well especially because I’m wearing a black mask the computer screen is also black and so are my clothes. I will try my best and upload the video below.

It turns out my worries about tracking the motion in the clip were valid, when I recorded the footage the 4 corners of the screen weren’t visible and there was no green screen so I think I’ll have to just cut that part of the video out for now. This is a good experiment because next time I want to do this I’ll be more aware of what I should be doing when recording.

Next steps

Until the end of the week I will still be focusing on the essay but once the first draft is submitted I will have around 3 weeks before I receive feedback so that I can dedicate most of my time to studio again. I will continue to hopefully experiment with processing and documentation videos but I do hope that I will take a leap out of my comfort zone and use some of my new research to really dive in and start creating thinks without constant worry and critique from myself, before I start discouraging myself I think I should just produce a portfolio of varying work that I can then criticise and narrow.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s