Net Art

Art is a work that appeals to the senses and makes the viewer think deeper than they normally would. The beauty and skill of a work is based off of the perspective of the viewer and what the viewer perceives as beauty and skill. Art is a form of communication without words. Art must communicate some form of a message to be art. Art is meant to be interpreted. While the artist may have a message in mind when creating the work, the audience can change its meaning based off of their own perspective. Art is not specific to any one media. Anything can be considered art if it makes the viewer think more and appeals to the senses.

http://thisisabullsemail.000webhostapp.com/interactivefinal/final.html

My Net Art piece consists of two collages that, when the mouse is over the image, the images switch around. I used Photoshop, HTML, CSS and Javascript to create this piece. In Photoshop, I made collages of family pictures that were special to me and had some significance in my life. Then I brought these collages into Dreamweaver using an image tag. I added the IDs called image and image2 so I could adjust their size to fit the screen. When I started using Javascript on this project I used onmouseenter and onmouseleave so the images would change spots. In this piece I wanted to communicate the importance of family in ones life and how these memories are important. While viewing this piece, you may look at one of the images and if the mouse leaves the image it changes. Then you’re focused on another image. This is symbolism as well, because while you can only focus on one memory at a time, all those memories are in your mind.

Advertisements
Posted in Interactive | Tagged , , | Leave a comment

Site Revision Steps

STEP 1: Research

I chose Lucasfilms for my site revision project. Lucasfilms has a navigation system and everything goes back to the homepage. The navigation is basic and clear so anyone can use the site as well. The logo of Lucasfilms is a gray on top of a lighter gray making it hard to read. Also, the organization needs to advertise more on the homepage rather then having one big image and the navigation. If Lucasfilms website had a better color design it could show that they want to entertain rather than to just inform the viewer about what they are. Lucasfilms tries to communicate entertainment and wants to sell their merchandise. However, they would be more effective if they advertised more on their home page and used a different color scheme as well as making the logo more readable.

 

Lucasfilms targets all ages but usually targets fans of action or science fiction movies. Disney, Marvel and DC are targeting this audience more effectively. They use more color design and make their site appeal more to entertainment while Lucasfilms looks more like a business site. When I revise this site I will borrow a more readable logo design, and I will also advertise more of organization on the home page. Finally, I will add more color to catch the eye of the person visiting the site, and make it appeal more to entertainment.

STEP 2: XD Site Draft 1

https://xd.adobe.com/view/e5e4fe2d-4ca3-419e-ba89-27619e0f9d6f/?fullscreen&hints=off

STEP 3: Iteration

https://xd.adobe.com/view/a471351e-bafb-4937-a84f-3041526109af/?fullscreen&hints=off

STEP 4: Implementation

http://thisisabullsemail.000webhostapp.com/intassign5/index.html

In the html I used a the <div> tag to create most of the filler images and title parts of the site. On the next pages I used tables to create a layout where it was shown as an image then text repetitively. After you click on the images, the site will bring the viewer to a larger view of the image. For this part I went back to using the <div> tag for the larger image. All text was attached to a <div> tag in order to change the text color, so the viewer was able to read it. In the style, I used that to create the color scheme. This color scheme was mostly black and gray but the logo was green to add a touch of color to the site. Also, the style was used to create the size of the filler image and the title portion of the site, as well as the padding and certain text sizes.

STEP 5: Revision

http://thisisabullsemail.000webhostapp.com/intassign5/index.html

For the revision portion of the site revision project I edited the header of the site to move as the viewer scrolls down the page so that the viewer may select any of the header options at any time. Also I added more filler image and filler text so that the page could scroll, making it more visible that the header is moving up and down the page.

Posted in Interactive | Tagged , , , , , , , , , , , | Leave a comment

Javascript Site

 https://thisisabullsemail.000webhostapp.com/intassign4/touchy.html

Posted in Interactive | Tagged , | Leave a comment

Javascript Exercises

https://thisisabullsemail.000webhostapp.com/interactive/timebasedevents.html

https://thisisabullsemail.000webhostapp.com/interactive/toggledisplay.html

https://thisisabullsemail.000webhostapp.com/interactive/canvasdrawing.html

https://thisisabullsemail.000webhostapp.com/interactive/keyboardevents.html

https://thisisabullsemail.000webhostapp.com/interactive/multilayerparallaxscrolling.html

Posted in Interactive | Tagged , , | Leave a comment

Responsive Design

http://thisisabullsemail.000webhostapp.com/intdes/

Posted in Interactive | Tagged , , | Leave a comment

Responsive Design

https://xd.adobe.com/view/4e522b02-94e7-49e5-88a3-53d103a065f5/?hints=off

Posted in Interactive | Tagged , , | Leave a comment

Art-influenced site final part

http://thisisabullsemail.000webhostapp.com/interdes/artinfproj.html

Posted in Interactive | Tagged , , | Leave a comment