DDM - Design for Digital Media

Diploma of Creative Industries (WDCI)

Teacher Name - lisa.cianci@vu.edu.au
Class Website - http://lisacianci.vucreativeindustries.com/2012/DDM

(login to the website: username = student; password = student)

Class 8 - content development for screen projects


Class: presentation & discussion of Storyboard planning

You should have your planning documentation ready for the storyboard project. In class you will present your planning documents and we will have a class discussion on this assessment task, and any other tasks you have going.

As I have not been here for the first 7 classes, we will also discuss what has been done so far, and I will get a sense of where everyone is at in this subject, take a look at everyone's blogs, and just get a general overview of what's been happening so far.

 

Lab: Content development for screen projects – text and image,  current design trends for website design and development – cutting edge style, Photoshop exercise with styles – creating depth & texture, Photoshop exercise

Text & Image

Have you noticed the way image and text is used in a lot of web sites?

One style that I like and I use it myself (see blackaeonium.net), is combining images with depth and texture as background, with overlaid type.

Other examples include:

More on texture:

http://www.smashingmagazine.com/2011/10/03/whys-hows-textures-web-design/

"Superflat" kitsch style with funky colour combinations:

http://psd.tutsplus.com/articles/inspiration/inspiration-cool-kitsh-pop-art-and-superflat/

Sites with lots of white space and big fonts:

http://www.smashingmagazine.com/2007/01/12/white-space-and-simplicity-an-overview/

http://www.vanseodesign.com/web-design/color-theory/

http://www.webanddesigners.com/15-examples-of-big-fonts-used-in-web-design/

Magazine style sites - often Wordpress driven:

http://www.designiskinky.net/

http://www.1stwebdesigner.com/wordpress/great-magazine-newspaper-wordpress-themes/

Infographic "linkbait":

http://www.thefriendlyblogger.com/seo-infographic-link-bait

Video as background:

MONA gallery (http://mona.net.au/)

http://www.webdeveloperjuice.com/2011/01/14/14-fantastic-websites-using-video-as-background/

Transparent PNG with image & text - often used with overlays & menus:

http://blog.fazai38.com/index.php/2009/04/22/20-creative-usage-of-transparent-png-website/

Use of overlays and modal boxes:

http://www.onextrapixel.com/2012/03/29/15-stunning-jquery-lightbox-plug-ins-for-your-upcoming-designs/

Use of scrolling images, slideshows, image gallery grid layouts:

http://www.1stwebdesigner.com/wordpress/free-portfolio-photo-gallery-wordpress-themes/

http://www.1stwebdesigner.com/css/fresh-jquery-image-gallery-display-solutions/

What are some others? Have you got a favourite website that uses image and text in a way that you like or that is close to your personal stye?

I also like to look at designs from other media when thinking about digital designs. Here are some links for webpages that have "best of" lists for things like album covers, book covers, old film posters etc.

http://www.smashingmagazine.com/tag/covers/

http://neatdesigns.net/40-great-music-album-covers/

https://www.google.com.au/search?q=russian+film+posters+avant+garde

 

When developing designs - especially for use on the web, there is a lot of comment out there on design trends, what to do and not do, the latest contepts, etc. etc... I would take all of these articles & blog posts with a grain of salt.

It is good to read these articles though, as they often provide links to best practice websites (or worst practice sometimes). This can help you get ideas for your own projects.

Creativity doesn't happen in a vacuum. we need to feed our heads to come up with good designs. The idea of "everything is a remix" is valid for all of our creative decisions. This doesn't mean simply appropriating or copying designs, it means drawing inspiration from the work of others to create your own work.

A good quote from a Smashing Mag article:

'While nothing is original, we all need to respect the difference between inspiration and imitation. As Jean Luc Goddard said, “It’s not where you take things from — it’s where you take them to.” And if you don’t take them anywhere, what’s the point?'

http://uxdesign.smashingmagazine.com/2012/03/15/symptoms-of-epidemic-web-design-trends/#more-127815

 

Class Exercise

In designing for websites, your choices may in the end be based upon function and communication - what does the site need to do for the user? what message/s does the site need to send the user?

Just like with your blog personalisation, you need to be conscious of the messages you are sending through design.

today, you will work in Photoshop to create 3 images using a combination of image and text to convey a message. You can choose to create 3 images from any or all of the following options:

1. create an image with text that promotes a product - it may be a real product or imaginary product.

2. find a famous quote or saying online and create an image with text that illustrates or suggests the meaning of the quote.

3. find a line (or lines) from your favourite song (or songs) and create an image with text that somehow conveys the emotion of the text.

Save the PSD files for your own reference, and create a PNG file to submit. Use layers, blends, masks, typography, filters and any effects that will suit the style of your images. Upload these to your Wordpress blog when complete.

Some online Photoshop tutorials that might help in making images with texture and depth:

http://www.smashingmagazine.com/2012/03/09/top-non-destructive-photoshop-techniques/

http://www.smashingmagazine.com/2011/08/12/mastering-photoshop-techniques-layer-styles/

http://www.smashingmagazine.com/2009/12/17/unveiling-photoshop-masks/

http://www.smashingmagazine.com/2011/02/07/mastering-photoshop-noise-textures-gradients-and-rounded-rectangles/

http://www.smashingmagazine.com/2008/01/10/adobe-photoshop-tutorials-best-of/

At the end of the class we will do a walk around and see what everyone has come up with.

 

Reading/viewing for next week:

No reading this week :) Just watch these videos on line - Everything Is A Remix by Kirby Ferguson

http://www.everythingisaremix.info/watch-the-series/

We will have a discussion in class about the nature of creativity and remix. Next week (Class 09) is the ANZAC Day holiday. We will be back for Class 10 in 2 weeks, so you have ample time to watch these videos- be ready to discuss them in class!

You must write a paragraph about one part of this series of videos that really captured your attention. Note which video and the approximate point in time so we can easily scrub to it. It will be interesting to see what everyone chooses, and it will make a starting point for our class discussion.

 

Other Things to Remember

You should be continuing to work on the following Assessment Tasks:

AT2 - Storyboard Trailer;

AT1 - Blog (Keep adding entries to your blog)

Please see me in class if you are having any issues with assessment tasks. There will be time to work on these in class - think of the Lab session from 4-7pm as time to work on assessement tasks as well as class exercises, then you can ask me for help.