Workshop Compilation (Building the dummy website)

Over the last ten or so weeks, Kyle (workshop tutor) has been teaching us how to create a website from scratch. This post contains a compilation of screenshots from each step in the process with highlights over the new content added to each stage. (This is mostly here for my reference to go over what we covered but it is still relevant to the unit). 


Continue reading

Advertisements

D4DME Workshop (Project folder/files hierarchy)

For the first official workshop of the D4DME unit, Kyle (workshop tutor) got us to set up an example project folder to use as a starting point for any website project.

3

Screenshot of Project Folder

The layout was fairly straightforward, as we had setup a similar folder for our dummy website in the past series of workshops. The only new element to the above example was the addition of the templates folder, which allows for cleaner HTML/PHP files (as you can make separate files such as a ‘navigation’ to be included at the top of every file rather than having the same code on every page).

Animation Workshop

To help us with our new task, our workshop was based around animating simple gifs in Photoshop today. Kyle gave us a set of images to animate into a walk-cycle.

walkcycle

Having created my cinemagraph in a similar fashion, I found this process easy to do. Each frame of the animation had to be placed on it’s own layer, which would then in turn become visible/invisible when necessary. As I found this easy to do, I decided to draw my own walk-cycle based on the templates above.
I drew some basic sprites in Photoshop with a flat background and played around with them.

Walk1

I added a shadow that moved beneath the figure as he walked to make the motion seem more dynamic. I then wondered if it would look better to have the character walking in a static position whilst the background scrolled past.

walk2

I personally prefered the second option, as this is usually how movement works in video games; the main character/sprite is almost always positioned at the centre of the screen whilst the world moved around them.

Processing Workshop


Today we had a workshop that introduced us to programming languages. We started off the session by learning a list of keywords (non-specific to Java) and some common misconceptions about programming. We then moved on to a practice session with Java itself. We were basically told that once you know how to write one programming language, you technically known them all (except for the fact that the syntax varies from language to language, just like spoken languages). Learning about the syntax of Java was interesting, as every programming language follows a similar structure but has a unique syntax. We were introduced to a program called ‘Processing’. This program can support Java, JavaScript and Python, though I think we are mostly going to use it for the former of the three.

IMG_20141002_111553765_HDR

Above is a screen shot of part of the work I created today. I understand the basic syntax of Java and how easy it can be to understand, though I am fully aware that it is going to get a lot more complex as we progress. Most of the functions that we used today were called ‘booleans’ and relied on either a true or false outcome in order to perform.

I intend to watch the tutorials on http://www.processing.org/ in order to develop my Java knowledge in my spare time.


Bibliography:

Fry, B. and Reas, C., 2001. Processing [online]. Available from: http://www.processing.org/ [2nd October 2014]

Photoshop Workshop

Untitled-1
For our first workshop, we focused on non-destructive editing using Photoshop and Bridge. Bridge has an option called ‘Photo RAW’ which allows you to make drastic changed to an image without ruining the original file, as you can remove these changes at any point. We were also shown how to create effective layer masks in Photoshop that we could use to create our Alphabet Photography collage if we needed to.

My knowledge of Photoshop stems from an artistic background rather than a photographic one, so my editing skills are a little bit rusty. I found the lecture helpful, as I’ve never really been that great with layer masks.