Author: Sebastian Lau

Posted on

Week 11: Internet Art – Sebastian Lau (Chen)

After doing some looking around I came across this interesting website: https://www.jimpunk.com/

To me, it’s pretty abstract so I don’t really know what’s going on, but there’s a ton of stuff to explore within the site. Each of the keys on the “laptop” corresponds to a different page and a little image pops up when you hover over them. The text at the bottom of the laptop also changes. 

When I clicked on this key it transported me to a page which opened up more pop-up pages. 

The site also uses a lot of ASCII art (as can be seen by the homepage). If you look at the person’s twitter (the blue box thing with wingdings or something) the artist posts web-based art (like emojis and ASCII). The website strikes me as old due to its design, but the artist keeps it somewhat updated (there was a “post” on one of his pages from 2016. His Twitter is more regularly updated I believe. There was also a page talking about copyright/plagiarism which reminded me of the article we read about interpreting people’s art in different ways and whether that counts as plagiarism. The page linked to blog posts written in a language I couldn’t understand, but on the page, the author was pretending to be an artist that was okay with stealing and reappropriating art. 

Posted on

Video Project: Survive the Night – Sebastian Lau (Chen)

http://imanas.shanghai.nyu.edu/~shl620/videoproject/

Description:

April, Vivian and I made a choose your own adventure game. The premise is you receive a call from April, who has just woken up inside a random room and is being chased by a monster. Your decisions can get her out, steer her the wrong way, or can even uncover new secrets. You are tasked with helping April out by texting her directions/instructions. While your decisions might not seem so impactful at first, they can make a difference in whether April survives the night. There are 3 different endings, with around 4 different choices to make throughout the game (for the longest playthrough. The shortest one is around 2-3 choices). Our game was loosely inspired by Black Mirror’s Bandersnatch as well as horror movies such as The Blair Witch Project. 

Visuals/Style:

Our visual design is based on someone’s laptop. The user is calling their lost friend while sending them instructions via text message. I took a picture of the web version of WeChat as originally I was going to Inspect Element, manually change the text and then screenshot it. Luckily, I decided on focusing on whether I could just make a similar WeChat interface with colored boxes and I think I got a decent approximation. Especially looking at how many different paths we have now and how one line could result in new functions being made I am very glad I decided to try to find a more efficient way. The camera quality is decent, not so bad that you can’t see, but not crystal clear so that it’s believable that it’s a video call. April also shakes the camera a bit to give that frantic/scared vibe which I think is helpful for our story. The ending message is pretty plain in terms of design. So is the caller ID. I mainly focused on getting the WeChat interface to be as realistic as possible. The background gives some information/clues as to who you really are which I think is a nice touch if you’re attentive. 

Code:

Coding was quite a doozy. While I don’t think that it was very difficult in terms of complexity, there were just so many paths and choices that it was very easy to get overwhelmed. Especially since I was unable to link another script. I tried to make one so that the main script wouldn’t be too cluttered, but whenever I put stuff on the other script it wouldn’t work. I’m not too sure as to why and I didn’t really have a bunch of time so I decided to just do everything on one page. Even though there were many different paths, they were quite similar in terms of coding. I would create texts and make their opacity = 1 based on the timing of the video and what you chose. I think I was most proud of streamlining the process of shifting the messages up when the chat window got full. After I realized I could just have the lines turn into the ones after it, it was much easier. I would only need to type in one line instead of 7. I am quite pleased with the effect as I think it looks like an actual messaging platform. 

I also utilized a handy piece of code which changed the onclick function of buttons. Had it not been for that I would have had to make many different button IDs and after looking at the functions I’ve had to make I am glad that I was able to make buttons a bit more efficient. 

The overlay hover function was a nice addition as well as relevant to the medium we were trying to emulate. Unfortunately, I was unable to find out how to make the hangup button disappear slowly as it might in other computer video calling software. Originally, we were planning on adding more functions, like muting and switching between voice and video, but there wasn’t enough time to justify rather irrelevant things. 

Teamwork:

I think it might have been a mistake allocating work as we did. While I do regret it, it was I who suggested we split up the work into Web Design, Video Editing, and Coding. While I didn’t have much to do the first week other than practice, once everything was finished there was much to implement. Vivian and April definitely did 99% of the video, whether it was editing or acting. I mostly did the coding and some of the Web Design (like the WeChat interface). While I do enjoy coding more than trying to act or design stuff, I think it might be wiser next time to split the work based on when we need to do it. Yes, I could have practiced some of the coding while they were working on the video, but it was quite difficult without the videos (and a bit difficult even with the videos). 

Reflections:

I feel like I have truly been growing in terms of my abilities as well as how much effort I put into my project. While perhaps not the most technologically impressive, this project has definitely been the one I have worked the hardest on. While it can be a bit tiring, I am excited to tackle the Internet Art project with my own ideas so that I can really implement my vision and design a project that I can have fun with while working on it. 

This image is low quality from what I can see on my computer screen so hopefully you’ll judge it based on our presentation rather than the blog post.

Posted on

Week 9: Video Project Idea – Sebastian Lau (Chen)

My partners are April and Vivian. We weren’t really sure what we wanted to do so I drew inspiration from those choose your own adventure type games from Matt and Matt’s first project as well as Black Mirror’s Bandersnatch. April had the idea of making it horror based where your decisions could save someone, or kill them. Our story will be set in the Academic Building (although it’s just meant to be a regular building). The user will be on a video call with their friend who is trapped inside the building, trying to escape from some unseen monster. The instructions you give him will either set him free, kill him, or reveal more about the story. Other than the choices, we wanted to fully utilize the computer screen (as the video call will only be taking up a part of the screen). We want to implement the ability to let the user click through their browser to reveal more about the story. 

Posted on

Audio Project: Piano Soundboard – Sebastian Lau (Chen)

http://imanas.shanghai.nyu.edu/~shl620/soundboard/

Description:

Alina and I struggled a bit in the beginning when we were looking for a project to latch onto. Originally we were going to do something with the sounds of the city (e.g. construction, cars, etc.) but we weren’t sure what. I took inspiration from Carlo who had presented his own soundboard in another class. While Alina and I were testing out the audio equipment we found that we could replicate ASMR with the quality of the microphones. At first, we thought of doing an ASMR soundboard, but when Alina recorded some piano sounds we decided to go for a piano soundboard instead. I didn’t want to blatantly copy Carlo (although soundboards are a pretty common thing) so I made sure to distinguish our soundboard from his. If you look at our website, the background is constantly shifting (very similar to Kahoot). Each button has a different color palette associated with it, so the last button you click is the color palette the background will take on. We also wanted to give the user the ability to reset the soundboard without refreshing the page so we gave the spacebar the ability to reset both the sounds and the background color palette. We topped this off with a “groovy” font which gave the one simple instruction of how to reset the soundboard. 

Visuals/Style:

I like the shifting background quite a bit. Initially, we were going to have the button clicks change the background in some way (e.g. more buttons –> quicker/more energetic background shifting).  Instead, we settled on having it change the color palette as if your mood was changing based on what sounds you picked. Each sound has its own color palette! The buttons themselves are unmarked white rings which glow much brighter while the sounds are playing. We chose to leave the buttons without text or any indicators of what the sound might be in order to let the user explore it themselves. Also, it would’ve been more work. Regardless, some soundboards don’t have any text or pictures to tell their users what button corresponds to which sound. We removed the blue halo thing that often surrounds a button when pressed as it looked rather unappealing. 

Code:

Although I searched up the shifting background code, it was very difficult to find a way to change the color range. After a bit of searching, I realized I could use variables to change the colors instead of using getElementById or any of that jazz. 

I also added code to change the button image to a glowing one when the button was pressed, and then to revert back to the old image once the sound had reached the end or was reset (due to the spacebar). We thought this would be helpful to let the user know which buttons were currently in use. 

I implemented a bit of code to allow the user to repeatedly click on the same button and have the sound restart (previously nothing would happen) by setting the current time to 0 and then playing the sound again. 

We found a way to shut off every piece of audio when the spacebar was clicked. For some reason, we would need to click it twice in order to fully refresh everything. I added a setTimeout function to wait a bit and then redo the spacebar function to make it as if I had clicked the spacebar twice. 

Teamwork:

I feel like Alina and I worked very well together despite (or as a result of) our ability to split work. Alina did all of the sound recording, editing and created the button images. I did most of the coding. I think we both focused on areas that we were more comfortable in as Alina had already mixed/edited sounds before I had even rented out any recording equipment. As a result, I think we were able to reach a better balance between visuals/style and actual functionality/code. Compared to my last project, it is much more pleasing to look at, however, it might not be as complex. I personally think that we were able to finish the project quite quickly. 

Reflections:

I feel like this project is more complete than my last, despite finishing the soundboard much later. It has both a nice visual aspect and a complex coding side to it. Next time I would have liked to finish the project a bit earlier, but I think given that our group was ready to ask others for help quite easily I am happy that we were able to soldier through and figure out a majority of the things on our own (although we did receive some good pointers and tips from Leon, Ann and Dave). 

Posted on

Non-Fiction Film: Meteorology and the World (Reflections – Sebastian Lau)

Group Members: Jenny, Candy, Tyler, Sebastian

Description:

Our non-fiction film explores meteorology and it’s significance/impact in the world, from tourism and globalization to gentrification. We also looked at the cultural and historical impact of the Zikawei Observatory as well as other sites included in its network of data collection points. The aim of our non-fiction film was to show how the rather invisible or unnoticed effects of meteorology actually influence our world. We also wanted to represent it as something more than just a field of science, but also as a driving force in various aspects of our life. 

We thought it would be beneficial to look at the history of weather data collection as the impact back then was much more noticeable in regards to meteorology’s effect on the economy. We also looked at a few other sites, the church near the observatory, the Signal Tower and the Customs Building. Both the Signal Tower and Customs Building relied on this web of data collection and distribution in order to reliably receive goods arriving from the sea. The church is situated right next to the Observatory and while initially there was a bit of resistance from the church when the Observatory was being proposed, they eventually helped construct it. 

We chose to represent all of this by copying Henri Le Luc’s method of research when the Observatory proposal was rejected. He took readings at 5am, 9am, 12pm, 4pm, and 9pm of various meteorological observations (such as temperature, wind speed, etc.).  We each took videos of the sites at those times (Tyler and I split up the church and Observatory, Candy and Jenny did the Signal Tower and Customs Building). Jenny also made an intro with historical pictures as we felt like the connection between the sites (and with the economy, gentrification, etc.) wasn’t very obvious. 

Visuals/Style: 

Initially, we wanted to show our footage in quadrants with the weather information over it. I am not sure how the others shot their locations, but I tended to pan from side to side or up and down with my locations. After some feedback, we realized that it was a bit confusing (especially since we were meant to have voiceovers specific to a certain location) so we decided to have the footage that the voiceover was talking about take up a majority of the screen and have the other three locations off to the side. Jenny’s slideshow, in the beginning, showcases historical pictures of the locations as well as the data that they collected. 

Audio:

We each recorded personal voiceovers (around 30 seconds long). They each were relevant to a certain place and idea that was affected by it. For example, I went to the Observatory and talked about gentrification/the economy as the area near the Observatory was being turned into a park. We also found background music for the video. The introductory voiceover gave context to the locations and how they were related. I feel like these were all necessary as the connections between the locations most likely feel very random without context. 

Teamwork:

I feel like we all worked together well. There wasn’t really any fighting or conflict so we were able to get started with collecting material right away. Sometimes it didn’t really feel like we worked together, as we collected materials by ourselves and didn’t really work together on the video editing that much either. In some ways, I think that was good, as we were able to independently contribute to the project without needing other people to be free or requiring someone to tell us what to do. On the other hand, I think the fact that we did our own things meant that we might not have been as efficient as we could’ve been. All things considered, I enjoyed the freedom of being able to go film when I wanted, rather than having to find a time where everyone was free and have to coordinate something. For the film editing, I feel like the situation was similar. We didn’t really work together on it, but kind of worked on it individually with maybe the exception of Jenny who more or less oversaw most of the editing process. 

Reflections:

I feel like I did collect good footage and substantial amounts of B-Roll. However, I felt like I could’ve helped more with video editing. I didn’t really help much with it other than giving ideas and helping with the script, but I never actually touched the video editing software. I suppose I sent in and ordered my footage in time to give Jenny ample time to work on it, but I could have been more proactive with trying to help as I could have sent/wrote my voiceover earlier. On Sunday I helped a bit with finding background music (which might not have been implemented as they had already found music, but were looking for alternatives just in case) and with proofreading and changing the introduction script.