Inspiration Images

DIM brief requires to produce two images useing two different visual styles.

As I wasn’t exactly aware of all styles and techniques, my first step is quick research into every single one, so I can get an idea of what I really like and what I would like to explore.

Styles:

  • fantasy – yes
  • horror – yes
  • social realism – no
  • landscape – yes
  • sci-fi – yes
  • abstract – no
  • surreal – no
  • urban – no
  • art noveau – no
  • pre-raphaelite – no

Techniques:

  • collage – no
  • photo composite – no
  • digital painting – yes
  • mixed media – interesting
  • retouch – yes
  • vexel – interesting
  • matte painting – yes

Few examples of styles I like:

Very nice beam and hue, lighting is excellent. Combination of dark and warm orange colours.

Love landscape style and matte painting, nice reflection on sea.

nice idea of rocks with trees and bridge

great idea of island with falls and underwater village,  lightning is brilliant.

Amazing lighting, decomposition affect on arms,body and head is just great

water affect and lighting – amazing, I love to know how to produce such a powerfull art piece. V shape (dragon) gives us reflection of movement.

like the twisting clouds in spiral and hue, landscape

example of landscape and spiral clouds again

spiral cloud looks unreal compare to fire on the ground and mainly on tree. tiny details on lighting. Diagonal line of light, small double lightning/spark in the middle of image

This idea of  smog reminds me more like a big wave falling on city with cloud frame.  My mistake gave me an idea for my submission :

Based on my inspiration images ( moodboard)  I decided on key words &  features I would like to include in my final piece:

  • beam
  • hue
  • landscape (city or nature)
  • spiral cloud/ clouds in general
  • lightning
  • frame
  • wave
  • thinking in colours – orange/red or blue/green
  • thinking in shape –  landscape

This allowed me to determine a styles and techniques  I will be useing  to achieve expected final outcome. Is more like a combination of fantasy, landscape and sci-fi styles which I can easily achieve by useing following techniques:     matte painting & digital painting

 

Rest of the styles don’t  even catch my eye  even the piece can be outstanding. One of those outstanding works which inspired me was image bellow created by artist kubicki.

Useing splashes, staines, leaks, clouds, feathers, possibly rust, bed sheets and more is very interesting and mainly distinctive way of creating art.

As you can see in artists profile, all his work is powerfull and distinctive build on urban style.

jQueryMobile upgrade/not useing jQueryMobile

As I was very impressed with power of jquery and I also wanted to take advantage of jquery’s API I have upgraded first version of jQueryMobile1.0.1 to jQueryMobile1.1.0.

http://www.boristav.sk/_sub/jakub/game3/

Even after this upgrade which promised fixed transitions, I couldn’t say I was happy with final result.

For this reason I have decided to offload my application from jquery and create rest of my own stylesheet for icons, buttons, header and footer. Outcome is almost same, where I dont use any transitions effects.

http://www.boristav.sk/_sub/jakub/game4/

Final Product

We approached the whole process by separation of duties. We each decided on a part of the design that we would accomplish within given headlines and we had to stick to these headlines to achieve satisfactory end results. It was also decided that the final artefact would be a video animation showing the way we proposed Spotify could be integrated within Facebook, therefore fulfilling the brief requirements. All final elements of our design were produced in Adobe Photoshop and the animation video was produced in Abode After Effects, following guidelines given in the brief. We used background music to accompany the animation. This was a royalty free track from http://BeatsRoyaltyFree.com website. This has been properly referenced in the final project submitted to D&AD competition. The final result is shown here:

https://vimeo.com/38841917

Moving on javascript random pick and collapsable div

One of the first javascripts I have planned to use was random pick. Code for this kind of function was found on website:

http://gnwda.org/tutorials/Q&A/java-random.htm

This javascript was working properly on and off for some reason. But on the top of it, after going back from game page to home page useing home btn, javascript failed to load as this example doesnt work in a loop.

Different code was find on website: http://www.javascriptkit.com/javatutors/random2.shtml

After implementing this new code:

function randomGame(){
var myrandom=Math.round(Math.random()*9)
var link1=”game1.html”
var link2=”game2.html”
var link3=”game3.html”
var link4=”game4.html”
var link5=”game5.html”
var link6=”game6.html”
var link7=”game7.html”
var link8=”game8.html”
var link9=”game9.html”
var link10=”game10.html”
if (myrandom==0)
window.location=link1
else if (myrandom==1)
window.location=link2
else if (myrandom==2)
window.location=link3
else if (myrandom==3)
window.location=link4
else if (myrandom==4)
window.location=link5
else if (myrandom==5)
window.location=link6
else if (myrandom==6)
window.location=link7
else if (myrandom==7)
window.location=link8
else if (myrandom==8)
window.location=link9
else if (myrandom==9)
window.location=link10
}

Second function I wanted to implement in one of the game rules was collapsable div.  There is many jQuery with this function, so why do I have to look for simple javascript?

Answer is simple, as jquery should be used in web browsing only, not in app development. Phone runs on different software and hasn’t got that powerfull hardware as PC or Mac.

I was also consider useing just pure CSS3 to achieve this as I came a croos this tutorial: http://dev.opera.com/articles/view/css3-show-and-hide/#sec1

Code seem to be very long and complicated for such a small function so to the end I have decided to use one of the javascripts from my library:

http://www.boristav.sk/_sub/jakub/collapsible/

Video Production

After completing our design in photoshop, we considered video animation would be the most succesfull type of presentation for DA&D.   Producing video animation required preparation which includes few sketches and some ideas regarding an order in which we will introduce spotify key features.

  1. First at all we needed to introduce Spotify and Facebook itself and carry on their integration.
  2. Facebook interface with spotify features, where we describe every individual one.
  3. Music dashboard

Detailed plan of  frames (Spotify and Facebook join together)

Bring mouse pointer to bg (sound on click)

  1. Music dashboard is the most important part of spotify integration, so it’s logical that we introduce  collapsed  Collaborative playlist, Top tracks, trending & recommended tracks first and than follow rest of key features.
  2. Last frames include oportunity to sign up for membership as this is what Spotify is trying to achieve

Spotify-Facebook: Design ideas….

Having come up with some ideas about how to approach the brief, we decided to get down to working on the actual design elements. The brief was very precise in the requirement for the delivery of the final work. Here are some of the interface design ideas we thought of. Some made it to the final project, some didn’t:

  1. Ticker + News Feed
  2. List of online friends. If they listen a music within spotify, play button and name of song appear next to their name. We believe, this extra idea we came up with, makes interactivity even more succesful and mainly people will be aware of spotify as every member is looking through their online friends list.
  3. idea of small spotify player integrated within Music Dashboard, however we didn’d go along with this idea as spotify require launching their spotify application installed on PC/Mac/Tablet/Smartphone
  4. Notification integrated within facebook notifications. We also reducing size of Music Dashboard
  5. Music Dashboard

Whilst we were working on design ideas, Spotify had already started to implement some changes to their Facebook expansion project.  It turns out that it was a good thing we didn’t quite notice these changes on time, because a lot of our ideas were very similar to the ones that were being already implemented by Spotify. This, given the timing of our discovery, was an even nicer surprise for us, because we then realised that we had been along the right track with our brief.

 

Essay 2 – research

It has taken me a while to decide what would be the most appropriate example in this particular assignment. I have looked through the internet and narrowed the theme down to two:

the advert Mary Stopes has published via television last year, offering abortion:

http://www.mariestopes.org.uk/PressReleases/UK/First_ever_TV_commercial_for_Abortion_Services_to_air_in_Britain.aspx

and the controversial issue of euthanasia, looking through an interesting evidence of Dr. Kevorkian’s famous euthanasia trial:

http://www.nrlc.org/news/1999/NRL499/kev.html

I have decided that euthanasia may be more suitable as it is widely debated and transgression is clearly there from Dr. Kevorkian. As well as looking through the video on Youtube: http://www.youtube.com/watch?v=gCIgUM0mkQs

I have also used an example http://www.carenotkilling.org.uk website, as their debates throughout are very organised and I believe they have many followers who fight against euthanasia legalisation in the UK. Finally, thanks to google.com I have found another interesting article about euthanasia propaganda used in media, accessible here:

http://www.dailymail.co.uk/news/article-1377412/Dr-Philip-Nitschke-gives-euthanasia-workshop-video-14-year-olds.html I have already read about this controversial video, unfortunately I have been unable to find the whole film, but the debates surrounding it I have also considered as very interesting.

I have also looked through other article about this video, like http://www.lifesitenews.com/news/uk-marketing-assisted-suicide-educational-videos-for-14-year-olds to make sure that there are not big differences in what public really thinks of it.