Unit 05 Contextual Influences in Art and Design
Having a look at Street art as an art movement and how it is influenced in certain video games.
Street art is an art movement that usually consists of art done in the streets, they can be paintings/graffiti's on wall or they could also be sculptures placed in streets. The art is sometimes controversial or witty with smart play with the environment. I really enjoy good street art but I don't really like tags or graffiti's they usually look all very similar. I find street art very enjoyable and it really adds to a city's landscape.
Video games that are influenced by street art (mainly graffiti).
Jet Set Radio is a game about gang wars in Tokyo The most common goal in the game is to spray over other gangs graffiti with the player's own.
sideway new york is a platform puzzle game were you play as a graffiti on a wall and you can interact with other street art that is on the wall.
The art style in this game is very inspired by the street art and graffiti's you would see in an urban city.
Getting Up is a action-adventure game. The game focuses on an amateur graffiti artist who uses graffiti and tagging as a way to protest against the corrupt Dystopic
----------------------------------------------------------------------------------------------------
Having a look at Cubism as an art movement and how it is influenced in certain video games.
Cubism is a very abstract art style and usually consists of many geometric shapes forming something and the colours are usually quite inconsistent. I personally don't really like this art movement it feels a bit too abstract and crazy for me.
Finding a game with a Cubism art style was hard to find.
Canvas Clash is a 2-Dimensional, two-player Racing game built using the Unreal 3 Engine. It has a mix art-style of cubism and surrealism.
Making my own cubism art piece with adobe illustrator.
I think that it fits the art-style well enough.
I based my piece of this image
-------------------------------------------------------------------------------------------
Having a look at Minimalism as an art movement and how it is influenced in certain video games
Minimalism is an art style/movement that uses mainly very basic shapes (usually just squares, rectangles, circles and triangles) with few colours but it can also just be a simple silhouette of something or someone. I like minimalistic art it can sometimes look very meaningful.
Every day the same dream
Every Day the Same Dream is a short, 2D art game that puts the player in the role of a man whose life is about to change. Developed for the Experimental Gameplay Project in 2009. And it's art style is very minimalistic
Thomas was alone
Thomas Was Alone is a 2D puzzle platformer video game where you go on an adventure with multiple colour block characters of different shapes and sizes. I't art style is very minimalistic
Minimalist artwork that I have done in the past.
Minimalistic Spinosaurus that I did in class.
I had fun making this with Adobe Illustrator.
-------------------------------------------------------------------------------------------------
Having a look at Surrealism as an art movement and how it is influenced in certain video games.
The Surrealism art movement/style consist of paintings and sculptures showing impossible or dream like worlds and events... etc. I personally find that surrealism is great! it's great because it defies everything that we know and with it you can portrait anything.
The bridge is a puzzle game with many different confusing levels. The art style is very surrealistic with lots of optical illusions and impossible scenery. I personally really like the way this game looks it seems really interesting with all the optical illusions.
AntiChamber is a puzzle game with not much sense to it there is no overall goal it's just a place full of puzzles to solve. The art style of the game is a mix of surrealistic and minimalism. The level design is mind blowing and sometimes catches you by surprise with optical illusions and other mind tricks. I have played this game before and it is really fun and i really like the art style of the game.
Canvas Clash is a 2-Dimensional, two-player Racing game built using the Unreal 3 Engine. It has a mix art-style of cubism and surrealism.
Sketching my own surrealistic art piece, I used my hand as reference to draw this sketch.
I think that it looks good apart from that I think the hand looks a bit off but then again hands are tricky to draw.
-----------------------------------------------------------------------------------------------------
German expressionism
German Expressionism came from Expressionism was a modernist movement, initially in poetry and painting, originating in Germany at the beginning of the 20Th century. Its typical trait is to present the world solely from a subjective perspective, distorting it radically for emotional effect in order to evoke moods or ideas. Expressionist artists sought to express meaning or emotional experience rather than physical reality. This is Wikipedia's definition find it HERE.
German expressionism is a very sad looking art style and it can provoke a lot of emotion. I don't think much of it as i don't enjoy or relate to it in any way.
So basically the expressionism art movement is an art style that expresses a mood and feeling that the creator thinks about a specific subject. It usually consists of dark moods with abstract shapes and dark colours.
Limbo is a 2D puzzle platformer game with a dark German expressionist art style.
In the game you play as a boy who explores a dangerous forest with traps and giant spiders.
My own piece inspired by german expressionism
It's supposed to represent that work you have to do that you don't care about can feel very punishing and horrible.
---------------------------------------------------------------------------------------------------------------
The pixel art movement was created thanks to video games, as the first generations of video gaming devices weren't capable of creating advanced visuals graphics, so they used pixels and bitmaps to create the visual aspects of video games but as time went on and as technology evolved video games became a lot less dependent on pixel art, but quite a few games nowadays still use the art style/movement as it can be nice too look at and isn't to hard to make.
Pixel art back then wasn't really seen as an art form but more of a way to visualize objects on a a screen but nowadays it is seen a lot more as an art form as a lot of video game developers choose to make their games in that art style instead of using higher and more detailed art.
I really enjoy pixel art as it is nostalgic from the old gameboy games i use to play as a kid. it's also a very fun art style that can be at the same time very simplistic or very complex.
Here are a few examples of video games which purposely use pixel art.
StarBound is a survival/adventure game where you can explore different planets and loot different types of dungeons and castles.
Minecraft is a very popular game and is well known for it's pixel art style, it is a survival game where you mine and craft there is no real objective to this game it's an open world sandbox game.
Risk of Rain is a rogue like game where you play level by level fighting bosses and different types of enemies, there are characters and power ups.
My own pixel art piece.
Made this using Photoshop.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Making a presentation about pixel art using a website called Prezi
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Analysing/researching famous art pieces.
Marilyn Monroe by Andy Warhol 1962
This painting is by Andy Warhol and it is about the beauty of Marilyn Monroe and was completed after the actress had died. The painting shows Marilyn Monroe face coloured in many different bright colours. The painting is popular for being pop art and it has a very light tone. The art piece is currently owned by the Tate. I personally think that it looks well done and I understand what the artist wanted to show but it's not something that i would like to have in my house I don't particularly like it.
Fountain by Marcel Duchamp 1917
The piece is by Marcel Duchamp and was submitted for the exhibition of the Society of Independent Artists in 1917, but it was rejected by the committee. Since the original piece has been lost and 17 replicas by Duchamp were made in 1960s. Fountain was a piece which Duchamp called a readymades (also known as found art), as the piece was made out of an already existing object (a urinal). So basically all he did was take a urinal but it on it's back and then signed "R. Mutt 1917" on it. I do acknowledged this piece to being art but I personally don't think that this is a worthy piece of art, because it hardly shows any creativity.
Jake and Dinos Chapman: the End of Fun 2010
The end of fun are miniature sculptures made by the Chapman brothers in 2010. This art piece consists of 9 parts which show landscapes with hundreds if not thousands of small human figurines sculpts filling up the landscapes. The art piece shows a very macabre, sinister and grim art style with Nazi representations killing and torturing other humans, with humans crucified and hung and many severed heads on the end of long sticks. This art piece is an exaggerated historical representation of when the Nazis were invading a city in Russia that still vividly remembers the horrors of the Nazi blockade of the Second World War. I personally think that this art piece is strange and also very fascinating because of how much amazing detail was put into it, it's something that you could probably look at for hours and you would keep on seeing things that you hadn't noticed before but it's not something that I particularly enjoy I just find it disturbingly fascinating.
les demoiselles d'avignon by Bablo Picasso 1907
les demoiselles d'avignon (The Young Ladies of Avignon) is an oil painting by Picasso Current location: museum of modern art in New York City. The painting shows 5 nude women posing with sheets and fruit around them. Picasso's art style is very abstract with not much realism, when painting humans he usually shows them with very bad human proportions and anatomy but that's just the "charm" of his art style and is the main reason he got famous. I personally don't like this type of art style it doesn't excite or fascinate me in any way it just make me feel I little bit bored but I do understand why it is such a popular art piece because of it's unique art style.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
My essay draft
Video games are the
Ultimate art form!
Recently I re watched
a documentary called indie game the movie and in it they talk about how indie
games are made and how it is stressful being an indie game developer, in the
film they interview Phil Fish the creator of Fez and during this interview Phil
fish says ‘’To me
games are like the ultimate art form. It’s just the ultimate medium. I mean,
it’s the sum total of every expressive medium of all time made interactive.
Like how is that not… It’s awesome! ’’ and after hearing that quote I totally
agreed with it I just couldn't see any other art form that could be superior to
videogames. In this essay I
will be explaining why I think that video games should be considered, as the
ultimate art form.
So videogames have
been around for over 40years now and they have always been looked at as being
just a source of entertainment and an escape from reality, but it is only
recently that more and more people have started to look at videogames for being
more of an art from then just a silly way of entertainment.
Now before I can
explain why I think that videogames should be considered as the ultimate art
form I should first define what art is, what it does and how it applies to
videogames.
So what is art?
"Art: the expression or application of human creative skill
and imagination, typically in a visual form such as painting or sculpture,
producing works to be appreciated primarily for their beauty or emotional
power." This is the definition that comes up when you search up the
definition of art on Google.
So how does this apply with videogames? Well videogames
fit this definition quite well, making videogames requires a lot of creative
skill and imagination and can definitely be appreciated for its beauty and
emotional power, here are three examples of well known games that fit this
definition: The Last Of Us, The Walking Dead and Shadow Of The Colossus, all
three of these games are beautiful in their own separate way and they all have
some strong emotional story/feeling to them. But of course not all video games
are seen as having beautiful visuals and emotional stories/meaning to them it depends
on how you play and see the game, but this is the exact same thing with any
other type of art form, Paintings aren't always seen as beautiful and emotional
it really depends on how you view the piece of art.
Ok so now that we know what art is and that videogames are
a type of art form let's have a look at what art does and what is its purpose.
After researching the many different ways people
explain the purpose of Art, I realize that everybody thinks of art very differently,
but in the end they are all saying more or less the same kind of thing. Here
are three quotes by different people who have different opinions on the purpose
of art.
"To inspire an individual to think differently
about their surroundings. To shock, intrigue, impress, alienate, open and
influence others.
For some, it is simply a way of expressing emotion, and quite often some art is never intended to be shared as it is so personal." by Matt F on Yahoo Answers.
For some, it is simply a way of expressing emotion, and quite often some art is never intended to be shared as it is so personal." by Matt F on Yahoo Answers.
"The aim of art is to represent not the outward
appearance of things, but their inward significance." Aristotle Greek philosopher.
"Art doesn't
have a purpose, because art doesn't have a sentient mind. It can't have hopes
or goals. Some artists have purposes and some art
consumers have purposes. Those are different from person
to person." Marcus Geduld on Quora
So after reading
all these different opinions I have decided that it would be best if I just
shared my own opinion on what I think the purpose of art is.
To me the purpose of art is to share a common interest
with others, to express emotions and feelings, to aspire and influence people
in their lives and to start a conversation with others, but what I think is the
best and most important use of art is to create a community by bringing like
minded people together.
All types of art forms have managed to these things
some way or another whether it's an art expo, a club, an art school, an
orchestra, a festival, online websites ...etc.
Ok so how does videogames fit in to all of this, do
videogames also bring like minded people together, create conversation and
influence people's lives?
Well yes they do, and they have been doing so for
years, people all of the world have been connecting and discussing thanks to
videogames, there have been gaming conventions/festivals, like E3, the penny
arcade, gamescom...etc and there are many gaming websites online that give a
place for gamers to talk about videogames and interact and thanks to
multiplayer games I would say that the gaming community are the most connected
art consumers in the world which is awesome!
So now that we have had a look at how videogames definitely
have a place in the art world as its own art form, let's go back to the main
topic and look at why I think that videogames should be considered as the
ultimate art form.
Now the main reason I have for saying that videogames
are the ultimate art form is because videogames consist of many singular art
forms, videogames consist of: music, storytelling, voice acting, animation and
art (painting, drawing, 3D art...etc) kind of like animated films really, but
the only thing that is different from animated films is that videogames are
interactive so instead of just viewing the art and story you get to take place
within the art and story and you become a part of the artistic form that is
videogames, without the player's interactions with the videogame, videogames
wouldn't be the art form it is and that's what makes it so special, it needs a
player or multiple players to become a work of art.
In other words videogames are an art form that you take
part in. And there are some videogames that take it even further for when it
comes to storytelling, games like Minecraft, Grand Theft Auto, Don't starve and
Rust are free roaming sandbox games where the main fun of the games is to go on
an adventure and create your own stories, in the world that the artists are offering
you. Making the piece of art your own as it was your own modified experience of
the game.
And this is why I think that videogames should be
considered the current ultimate art form as the art itself is not limited to a
canvas as it can change depending on the play style of the player. But in the
end it's really a matter of opinion, not everybody sees games the way I do so
not everybody would agree with me. So what do you think?
Should videogames be considered as the current ultimate
art form?
Definition of interactive art: Interactive art is a form of art that involves the spectator in a way that allows the art to achieve its purpose.
Here is a list of websites i found that show interactive art.
http://kkkatzenadvent.com/?v=42
This website is some kind of christmas calendar where every time you click on a number, an animation will occur. I don't really know how to explain this website all i can say is that it has art yo can interact with.
http://www.patatap.com/
This website is really cool. Every time on click on a letter button on your keyboard a sound and animation will occur and you can change the colour scheme by pressing the space bar.
This website is a great example of interactive art.
http://www.koalastothemax.com/
http://manetas.com/pollock/
This website is another really good example of an interactive art piece as it gives the user absolute control on what happens on the web page. This website is basically a white canvas that you can paint on by hovering your mouse over the page, you can also change the colour of the paint by clicking.
http://mrdoob.com/projects/chromeexperiments/google-space/
This website is pretty cool as it shows the google search webpage but with all it's elements floating around on the page. But the best part about this website is that you can interact with the floating elements by clicking on them you can drag them around and throw them across the page.
All the elements are also fully functional.
http://soulwire.co.uk/experiments/muscular-hydrostats/
This website is really fun to play around with. It shows a Tentacle simulation using inverse kinematics that you can modify the colour, size, frictioin...etc of the "creature" with a conrol panel that is in the top right of the page. when the "creature" is clicked on it will follow you mouse cursor around the page.
Interactive art isn't always digital it can also be physical such as these examples:
This interactive art piece is called a wooden mirror as it reflects your silhouette if you stand in fron of it. It does this thanks to a camera, a program, machinery and many small wooden panels. The small wooden panels turn to hide or reflect light depending on where the user is.
This interactive art piece is a mix of digital and physical it consists of using a projector, a program and a wee remote used as a 'gun'. When shooting the 'gun' at the projected light a spurt of colours will be displayed. It's pretty cool.
Blueprint version
This idea is an interactive website with a pixel art eye in the middle that follows you mouse cursor when clicking on the eye the eye would blink and when the eye is taken out of the web page the eye would have a 50% chance of closing and going to sleep or look around maniacally to find the mouse cursor again. It could also have diffrent percentages of chance that when you open the webpage the eye is in a diffrent mood i.e. it could look angry or sad or excited and happy.
This project will consist of HTML, CSS and javascript.
Step 3 figure out a way to make blinking eyelids when the eye is clicked.
I didn't think that this would be too hard to make but it turned that it was a lot harder than what I thought. Originally I planned on making the eyes blink with CSS animations but after literally hours of testing and failing I learned that CSS animation are not reliable for making what I wanted to make so i turned to JavaScript and Jquery and this turned out to be so much easier than I expected.
With the help of an animation plugin called Transit and some Jquery magic I was finally able to make a nice blinking animation for when the Iris is clicked.
Link to this version of the eye prototype HERE
This is the code that i wrote to activate the eyelids
(this code has been slightly changed since)
Transit is just a plugin that allows for smooth css transition animations by using Jquery you can find the plugin HERE
As you can see the Interactive Eye now looks a lot different than before.
I needed to change the iris image because the previous one got blocked, I have added a nice pixel art background but that won't be the final background image. And the only reason the eyelids are of different colour is so that I could differentiate them when I was setting them up.
I have also added some weird music to add more of an atmosphere to it.
What the eye looks when it is blinking/closed.
Step 4 make a looking around animation for when the mouse cursor leaves the webpage.
So after a lot of research on css animations and animation queues i finally managed to make the eye play an animation for when the mouse leaves the webpage and it all works fine apart fo if you spam mouse in and out of the webpage, doing this will mess with the animation queues making the looking around animation jerk and twitch when in play and will not be in the correct order.
Click HERE to see this version of the eye.
Here is a gif showing off how to activate the sleeping animation.
Here is the code the makes the sleeping 'zzz' gif visible when the mouse leaves the webpage and disappear when the mouse reenters the page.
Step 5 make the art
Here is some rough concept art for how i would like my final eye to look.
Final Essay
Video games are the Ultimate art
form!
Recently I re watched a
documentary called "Indie Game The Movie" and in it they talk about
how indie games are made and how it is stressful being an indie game developer,
in the film they interview Phil Fish the creator of platforming game called Fez
and during this interview Phil fish says ‘’To me games are like the ultimate
art form. It’s just the ultimate medium. I mean, it’s the sum total of every
expressive medium of all time made interactive. Like how is that not… It’s
awesome! ’’ And after hearing that quote I totally agreed with it I just
couldn't see any other art form that could be superior to videogames. In this essay I will be explaining why I think that
video games should be considered as, the ultimate art form.
Videogames have been around
for over 40years now and they have always been looked at as being just a source
of entertainment and an escape from reality, but it is only recently that more
and more people have started to look at videogames for being more of an art
from then just a silly way of entertainment.
And to those who still think
that videogames have not achieved its place in the art world and that think
that they should still be classed as just a form of entertainment then they
should really consider having a look at games again, as videogames have evolved
quite a lot. "Art: the expression or application of human creative skill
and imagination, typically in a visual form such as painting or sculpture,
producing works to be appreciated primarily for their beauty or emotional
power." This is the definition that comes up when you search up the
definition of art on Google. Videogames
fit this definition quite well, as making videogames requires a lot of creative
skill and imagination and can definitely be appreciated for its beauty and
emotional power, here are three examples of well known games that fit this
definition: The Last Of Us for its very emotional story and it's amazingly realistic
graphics/visuals, The Walking Dead for its unique cartoonish art style and
difficult emotional story choices and Shadow Of The Colossus for it amazing
landscapes, colossus designs and unique gameplay, all three of these games are
beautiful in their own separate way and they all have some strong emotional
story/feeling to them. But of course not all video games are seen as having
beautiful visuals and emotional stories/meaning to them it depends on how you
play and view the game, but this is the exact same thing with any other type of
art form, Paintings aren't always seen as beautiful and emotional it really
depends on how you view the art piece for example a blank canvas with a single
red dot in the middle could make somebody feel emotionally lonely just by
looking at it or it could make someone feel indifferent as all they see is a
boring red dot.
Chris Hecker believes that games have the potential to
"become the preeminent art and entertainment form of the 21st
century."
Now the main reason I have for saying that videogames are the
ultimate art form is because videogames consist of a mix between many singular
art forms, videogames consist of: music, storytelling, voice acting, animation
and art (painting, drawing, 3D art...etc) kind of like animated films really,
but the only thing that is different from animated films is that videogames are
interactive making it that more immersive, so instead of just viewing the art
and story you get to take place within the art and story and you become a
necessary part of the artistic form that is videogames, without the player's
interactions with the videogame, videogames wouldn't be the art form it is, and
that's what makes it so special and unique, it needs a player or multiple
players to become a work of art.
In other words
videogames are an art form that you take part in.
And there are some
videogames that take it even further for when it comes to storytelling, games
like Minecraft, Grand Theft Auto, Don't starve and Rust are free roaming
sandbox games where the main fun of the games is to go on an adventure and
create your own stories in the world that the artists are offering you. Making
the piece of art your own as it was your own modified experience of the game.
" While films are a very visual and emotional artistic
medium, video games take it one step further into the realm of a unique
personal experience." Jet Li
Videogames are also one of the best ways of expressing a
feeling, emotion or experience as they can simulate these feelings as you play
through the life of a fictional character. 2 examples of games that express
these kind of things are "That Dragon, Cancer" is an interactive retelling of Ryan and Amy Green’s
experience raising their son Joel, a 4-year-old currently fighting his third
year of terminal cancer, and "Depression
Quest" is an interactive fiction game where you play as someone living
with depression.
Another reason for why I think that videogames are superior
to other art forms is that playing games does not always need to be a lonely
experience as a lot of games are also multiplayer games where you get to enjoy
the art form with friends, family or just total strangers thanks to the
internet, this makes the experience that much more diverse and interesting as
you play with different people who think and play differently to you. And of
course I'm not saying that videogames are the only type of art form were you
can interact with other people, you can very well go to a concert or art
exhibition to experience art with other people but videogames allow for such a
different experience and interaction as you don't need to act as yourself if
you didn't want to, you could very well be any kind of person/character you
want to be depending on the game you are playing, for example in the MMO
(massively multiplayer online) game World Of Warcraft you could be a Warrior,
Hunter, Mage...etc.
And this is why I think that videogames should be considered
the current ultimate art form as the art itself is not limited to a canvas as
it can change depending on the players play style, thoughts and ideas. But in
the end it's really a matter of opinion, not everybody sees games the way I do so
not everybody would agree with me. So what do you think?
Should videogames be considered as the current ultimate art
form?
Reference List
Websites
Author
surname
|
Author
initial
|
Year
of publication
|
Title
of website
|
Available
from: URL
|
Accessed
DD Month Year
|
Hecker
|
CH
|
6/5/13
|
About/Me
|
http://chrishecker.com/About/Me
|
25/04/15
|
Li
|
JL
|
5/2/04
|
Jet
Li Interview
|
http://uk.ign.com/articles/2004/02/05/jet-li-interview-2
|
25/04/15
|
Film
Fish
|
PF
|
5/18/12
|
Indie
Game The Movie
|
2/04/15
|
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Interactive Artwork
Definition of interactive art: Interactive art is a form of art that involves the spectator in a way that allows the art to achieve its purpose.
Here is a list of websites i found that show interactive art.
http://kkkatzenadvent.com/?v=42
This website is some kind of christmas calendar where every time you click on a number, an animation will occur. I don't really know how to explain this website all i can say is that it has art yo can interact with.
http://www.patatap.com/
This website is really cool. Every time on click on a letter button on your keyboard a sound and animation will occur and you can change the colour scheme by pressing the space bar.
This website is a great example of interactive art.
http://www.koalastothemax.com/
In this website a circle will quadruplicate into smaller circles every time your mouse hover over them and where the circles can no longer divide into smaller circles, all the coloured circles will show an image of a Koala.
http://manetas.com/pollock/
This website is another really good example of an interactive art piece as it gives the user absolute control on what happens on the web page. This website is basically a white canvas that you can paint on by hovering your mouse over the page, you can also change the colour of the paint by clicking.
http://mrdoob.com/projects/chromeexperiments/google-space/
This website is pretty cool as it shows the google search webpage but with all it's elements floating around on the page. But the best part about this website is that you can interact with the floating elements by clicking on them you can drag them around and throw them across the page.
All the elements are also fully functional.
http://soulwire.co.uk/experiments/muscular-hydrostats/
This website is really fun to play around with. It shows a Tentacle simulation using inverse kinematics that you can modify the colour, size, frictioin...etc of the "creature" with a conrol panel that is in the top right of the page. when the "creature" is clicked on it will follow you mouse cursor around the page.
Interactive art isn't always digital it can also be physical such as these examples:
This interactive art piece consists of a light that follows pedestrians around. This messes with the pedestrians and it becomes very amusing to watch their response.
After researching diffrent interactive art pieces i have come up with 2 ideas to make an interactive art piece of my own. I have come up with an idea for a physical interactive art piece and also a digital interactive art piece.
Blueprints and sketches of some ideas for making an interactive art piece.
So the first idea i came up with was Necronomicon book with a animatronic eye coming out of it and it has a camera with has face tracking software so that the eyes follows the user's head making it an interactive art piece. This piece will consist of a hollow book, an animatronic eye with eyelids, a camera and an Arduino.
But this isn't the project i will be making as it would take too long to make.
Blueprint version
This idea is an interactive website with a pixel art eye in the middle that follows you mouse cursor when clicking on the eye the eye would blink and when the eye is taken out of the web page the eye would have a 50% chance of closing and going to sleep or look around maniacally to find the mouse cursor again. It could also have diffrent percentages of chance that when you open the webpage the eye is in a diffrent mood i.e. it could look angry or sad or excited and happy.
This project will consist of HTML, CSS and javascript.
So after researching interactive art pieces i was mainly inspired by making a digital interactive art piece as i thought that it would be easier to fully accomplish so i decided to make the interactive eye on a website idea instead of the physical interactive eye book idea.
Working on the project
First step find out how i can make an object/div follow the mouse cursor.
My first thought was to make it all myself with javascript but i then realised that it would take too long to do so, so i found a Jquery plugin that would make a div follow the cursor in a set environment.
The plugin is called Jqeye and it can be found HERE
step 2 figure out how the plugin works and create a quick prototype with it.
I made a prototype of the mouse following eye and i posted it on my website HERE
currently the only problem with this prototype is that it doesn't function correctly in Firefox.
Step 3 figure out a way to make blinking eyelids when the eye is clicked.
I didn't think that this would be too hard to make but it turned that it was a lot harder than what I thought. Originally I planned on making the eyes blink with CSS animations but after literally hours of testing and failing I learned that CSS animation are not reliable for making what I wanted to make so i turned to JavaScript and Jquery and this turned out to be so much easier than I expected.
With the help of an animation plugin called Transit and some Jquery magic I was finally able to make a nice blinking animation for when the Iris is clicked.
Link to this version of the eye prototype HERE
This is the code that i wrote to activate the eyelids
(this code has been slightly changed since)
Transit is just a plugin that allows for smooth css transition animations by using Jquery you can find the plugin HERE
As you can see the Interactive Eye now looks a lot different than before.
I needed to change the iris image because the previous one got blocked, I have added a nice pixel art background but that won't be the final background image. And the only reason the eyelids are of different colour is so that I could differentiate them when I was setting them up.
I have also added some weird music to add more of an atmosphere to it.
What the eye looks when it is blinking/closed.
Step 4 make a looking around animation for when the mouse cursor leaves the webpage.
So after a lot of research on css animations and animation queues i finally managed to make the eye play an animation for when the mouse leaves the webpage and it all works fine apart fo if you spam mouse in and out of the webpage, doing this will mess with the animation queues making the looking around animation jerk and twitch when in play and will not be in the correct order.
Click HERE to see this version of the eye.
Here is a gif showing off how to activate the sleeping animation.
Here is the code that performs the animation when the mouse leaves the page and stops the animation when the mouse reenters the webpage.
Here is the code the makes the sleeping 'zzz' gif visible when the mouse leaves the webpage and disappear when the mouse reenters the page.
There is only one bug that occurs with the eye and it is that when you bring you mouse in and out of the webpage multiple times and then wait for the sleeping animation when keeping the mouse cursor out of the webpage, the animation will play incorrectly and will glitch out as the animation queues are messed up and out of sync. Hopefully i will be able to fix this issue but i have no idea of what is causing it.
Now all i need to do is fix this bug and then create all the art assets for the eye.
Step 5 make the art
Here is some rough concept art for how i would like my final eye to look.
I decided to go with some kind of lizard/crocodile/monster eye look as i thought it would look nice.
I will be making the art look a lot more simpler and clean as i am thinking of making it all in a pixel art style.
This is a quick pixel test to see what my concept art would look like if it was in pixels.
In photoshop i used the mosaic pixel filter to quickly achieve this effect.
After a while of trying to make pixel art for this eye i abandoned the idea as i couldn't get the pixels to look the way i wanted them too as i didn't have enough pixel art knowledge to create this. So i went on to make the art in a more simplistic style with adobe illustrator.
Making the scales and the eye
Testing out the art on the eye
Final look of the eye
When loading up the webpage for the first time the art will take a few seconds to load.
Link to the final finished version of the eye HERE
Link to My website HERE to check out all the different versions
In the end i wasn't successful in fixing the bug that i talked about in the end of step 4 so it is still an occurring bug.
I had some friends play test the Eye and they said that they really liked it the only thing that they thought was bothering was that the sound was too loud.
Overall I think that i have achieved a lot throughout this unit and that i have done quite well and I have found this part of the unit very enjoyable and fun as it was exciting to learn so many new things even if it was frustrating at times because of my limited knowledge on javascript but that's what learning is all about.
If i had more time to improve this reptilian eye i would have liked to play around with the art a bit more to make it look better and I would of really liked to fix that animation bug, I would of also liked to give it different mood states shown by the way the eyelids would be placed as you played around with it and a volume control would be useful addition as the music is sometimes too loud.
No comments:
Post a Comment