Author: Tenielle K Ellis

Link:  https://imanas.shanghai.nyu.edu/~tke217/Net Art Project/

“我”

About

For my final project, I decided to do this project individually to not only add my personal touch and let my personality shine through the website, but to also challenge how much I’ve learned throughout the semester, especially figuring out how to code myself since that was one of the most complicated processes I had to learn how to do. I’ve never learned how to code before, so this semester was my first insight into web designing. 

Design

For the design I had in mind, I wanted to add quotes that my mother would always teach me growing up. She would have quotes all over the place, and would make sure we would “Live, love, and grow” by them.  I wanted to use the most influential quotes, but also use a collage of pictures/videos from my life to visually explain them. 

I wanted to make my design of the quotes and title page to be simple because I wanted the collage of pictures and videos to shine through. I also wanted there to be a flow in the project, especially since this was a project that was more like presenting “art” and themes like “abstract” “obscurity” “creativity” “personality”. I thought this was a perfect representation of art, because to me, my project was art. I am not so visually artistic, but when there are personal touches, my creativity can flow. I thought this was a unique way of an artistic piece, and I very much enjoyed it. 

Lastly, I also wanted to include some sort of user interaction at the end. So, since this webpage was pertaining towards me and my personal life, I wanted to give the users a chance to share their personal insights/thoughts on quotes that have inspired them. I also wanted this to be saved on the screen, so that maybe they can be inspired from other quotes, or be interested by the differences or similarities between different quotes from different times. (The top line representing the latest time — closely to when the project was finished).

Steps:

This picture below is the cover page of my website. The “我” character is blinking, indicating that it is a button and should be clicked on. 

Next, it leads you to the page where the quotes are displayed. After this, the process is now timed and everything will be autoplayed (except the videos, you just have to click anywhere on the screen to play it, and click again to pause it) 

Now, you will see the video pop up (fullscreen), and shortly after a pop up with instructions guiding the user on how to move about the website. 

After all the quotes and videos are played (4 sets), the user will be taken to the final page below. This page is for the users to explore their creativity and have the chance to type in quotes that they were most inspired by, or quotes they want to put. Before this page, there is a mini-pop up with instructions explaining what this page is about and how to go about it. After the user puts in their quote(s) and presses submit, the quote will not only be displayed on the screen, but also be saved, so that when the user comes back to this page, they will still be able to see their quote as well as others.

Process

The process of making this website was very meticulous and challenging. I’ve always worked with partners before who have taken the role of ‘coder’, so I am not used to coding myself and making a product that is solely of my own idea. I had to go in for help a lot at the IMA lab because simple things like not connecting this html with the second css, or forgetting to grab my document, etc. It was honestly all a struggle for me. 

However, I really like challenges, and I think this was definitely one I could take on, but would need assistance with. I had to make separate htmls, css, and javascripts for each quote, as well as the title & final quote page. I also did all my edits on iMovie, so I just simply added that in on my html page. One thing that I kept having to fix was the position of everything. I wanted to make sure it looked presentable, so I was being very careful about centering the instructions, making sure the videos were full screen, etc. I also wanted to make sure there was some interaction with the user, therefore I set the “我”  or title as blinking, and added the “add your own quote” portion at the very end. 

Honestly, from proposal to presentation I am damn proud of myself. My presentation was exactly how I planned it to be in the beginning, and I honestly did not know that I could execute it as well as I planned it. Throughout the process, I changed some of the design as well, just according to how I felt with the allotted time, help, and creative juices.

Codes

Title page: 

HTML

CSS

Quote #1:

HTML

CSS

JavaScript

Final Page (Insert-Your-Own-Quote):

HTML

CSS

JavaScript

Future 

Given more time, I think I would definitely take into account the judge’s comments about using the medium of a website more wisely, and not confusing it for a video network, like Youtube for example. My only rebuttal, is that I intentionally didn’t want any buttons or interactivity to keep directing the person from website to website because I thought it would defeat the purpose of my webpage being art. I wanted there to be a free-flow because it would represent more of an artistic and creative side of my project. I also would like to add that I added the “Insert-Your-Own-Quote” portion at the very end which would give the user web activity to not only insert their own quotes, but to see others that are saved. Another comment received, was to have consistent design like with my quote fonts, as well as setting sort of a style or theme and go by that throughout the website.  With more time, maybe I could think of another way to execute my ideas, but use another design that fulfills the medium of a website. 

Lastly, I am very proud of myself! I achieved my goals and executed way more than I thought I could. With the help of many teaching assistants in the IMA lab, I was able to design a webpage that had my personal touch, and made it my own.

Link: https://imanas.shanghai.nyu.edu/~tke217/Net Art Project/

This is the link to my final project! Documentation to follow…

About 

To explain a little, this project is very personal! Throughout all of our projects, I enjoyed doing this one the most because it related to me in some way. I am such a rookie at coding and the world of web, so these web design projects were a bit eye opening and challenging for me at the same time. However, from everything I’ve learned I was finally able to put together an art piece that I thought best represented me. Some people may not be able to understand that, but what Net Art is fully understood? Only the creators would know. I am one to use words to express myself, but I am a visual learner. I thought to combine these two methods together and not really give the user any real insight or details into my project, but rather explore through and get a glimpse of Tenielle!

Extra

Most of these quotes are quotes I’ve lived and learned by growing up, as well as taught by my mother. All of these photos/videos are mine, but I only picked those that are from this semester! These collages are supposed to represent the quotes, like a visual representation of what these quotes mean to me 🙂

Final Project Outline

Concept 

Inspired by the numerous Net Art examples we have seen in class as well as finding our own, I discovered common themes: individuality and creativity. Although all of the projects were different, each of them expressed their own message and delivered it in a creative way. For my project, I would like to include those themes, as well as making my project a bit more personal. 

For my project, I want to create a website that is based on my personal experiences using images, videos, and quotes. There will be quotes that pop up on the webpage, then afterwards a collage of videos and pictures that relate to it will pop up. I will put together videos and photos from my life that apply to what the quote is trying to convey. The quotes will either be life sayings that I have sort’ve “abided” by, or famous quotes that I’ve been inspired from. Although this may seem a bit general, I think this is a very creative concept because it is my outlook and perspective on what the quote means, and how it relates to me, then use visuals to depict that. 

I was inspired to do this because throughout all of our projects, I haven’t felt like I put my own “personal touch”. I think that this project would be great to do that because it is all inspired by personal messages and outlooks from the artist. Sometimes as viewers we may not totally understand the message some of these Net Art examples are trying to convey, because only the person that built the website will truly get it. Also, growing up my mother would put positive life quotes all over the house and taught us (her children) how to read some of the most complicated quotes, try to understand it, and see how it applies to our life. I am also a big visual learner, so having these visuals to help the user depict the quotes also relates back to when I was younger and was trying to understand what these quotes mean. 

Sources

1. http://www.dnp.co.jp/museum/nmp/c-ship/projects/nowhere/apbl2.html
2.  http://astronaut.io/#

These two sources combined is what I envision my project to look like. For the first source, how the words are spanning across the screen, that’s how I want my quotes to be displayed. Then, from the second source, take the visuals that are continuously popping up, and place that over the quotes. However, from the second source instead of the background being the world, the background would be the quotes. So, after the user is finished reading the quote, the visual will pop up afterwards to represent, or depict what the quote means. I really like this technique of net art, because although I am not too artistically creative (like drawings, paintings, etc.), I do have a knack for using words to express myself, and I would love to tie in personal experiences to try and explain that. Hopefully with these two techniques combined, I will have my finished project.

Production

The production for this website will hopefully be interactive with the user. After the quote either spans across the webpage, or just pops up (using text fade out & in), I will give the user allotted time (maybe 30 seconds) then  include a pop up with a leading question asking the user: “Did you understand?” or “So, did you get it?” and then having the two options of “Yes, let me see!” and “Nah, let me read that one more time”  and if the user clicks the “yes” button, my video collage containing both video and photo will pop up and they will see the visual representation. If the person clicks on the other button (no), then the pop-up will disappear, and the user will be led back to the quote/saying to re-read it, and then the same pop-up will show to ask the user whether or not they understood or got the quote. Hopefully, if they continuously don’t get the quote, they will be inclined or curious to see if the visual representation can help. Also, I will mostly be dependent on using css style as well as javascript, and will need to do a lot of photo/collage editing in order to have the “right” visual/representation to accurately convey the quotes/sayings.

Rachel Greene’s article about Net Art is very wholesome. She includes the history of the internet and basically throughout her article explains how it has blossomed into a platform for all people, connecting those from all over the world regardless of skin color, race, ethnicity, etc. Everyone shares one thing: Behind screens. 

Honestly, I got a little confused during the reading because the terminology is a bit different. However, I was able to summarize that through her historical context and various amounts of examples, Net Art is sort of underrated in the “Art community” that she also brings up earlier in the reading. She mentions how Net Art was not part of a particular community, and wasn’t really categorized as anything except just excerpts of digital art, however there was finally a name for it: Net Art. 

I thought this reading was interesting because before it was mentioned in class, I never heard of Net Art nor knew what it was. Yet this article made it a little clearer as to the history of the Internet, various examples of digital art, some creators, certain themes such as cyberfeminism or chat rooms, etc. Net Art is a unique form of art that looks very challenging to put together (from an amateur’s point of view), and the obscurity of it makes it more creative which then gets appreciation from viewers like me.