Niewland Media

Think Fresh! …New Media Design & Development

Tutorials

Week 12 (Nov. 28/30): Student Grading on Group and Personal Rubrics

This week you are responsible for filling in your student grades according to your personal rubrics and group rubrics and submitting them to me, either by email or through my mailbox in the CSMM office. You must ‘mark’ your group rubric in your teams and only submit one copy. You will grade your own personal rubrics individually and submit them as well. If you were in the first tutorial group which was during the show, you may submit your rubrics no later than Wednesday morning by email or through my mailbox in the CSMM office on the 3rd floor of TSH. If you have any questions don’t hesitate to ask!

Week 11 (Nov. 21/23): Studio Day!

This week students voted to use tutorial time to put final touches on their projects to be ready for the Showcase. Looking forward to the 28th! :)

Week 10 (Nov. 14/16):  QR Barcodes, Vector Graphics And Saving Images For Web & Devices

QR Barcodes

For many of you, you may wish to include a QR barcode on your print document, video or website.  First of all, what is a QR code?  A QR code is a ‘Quick Response’ code which is a type of matrix barcode (or two-dimensional code) first designed for the automotive industry but more recently adapted to other industries.  Anyone with a barcode reader on their smart phone can scan the barcode to automatically have a web link, phone number or plain text displayed on their phone.  As you may have seen on campus, many posters now have these barcodes integrated on them to allow for ease of access to digital content.  QR codes may also be useful on business cards, websites, videos and many other forms of communication media.

Want to make your own?  Follow this link:  http://qrcode.kaywa.com/

Here is an interesting video of creative use of a QR code:

What Are Vector Graphics?

Vector graphics use geometrical primitives such as points, lines, curves and shapes or polygons, which are all based on mathematical expressions, to represent images in computer graphics.  You will need to use a vector based program like Illustrator to create these types of graphics.  It is of utmost importance that you create vector files for graphics like logos which will need to be resized on to many different media and remain consistent and crisp whether on a business card or on the side of a plane.

The following video illustrates the difference between bitmaps and vectors:

Saving Images For Web & Devices

When creating images it is important that you save them properly according to your needs for the file. When saving images for web and devices make sure that you keep them at a lower resolution than for print (72 DPI is standard for the web) and make sure that they are also in RGB format since that is the colour format our computer screens and mobile devices work with. If you are working with transparent backgrounds for your images then your best bet is to save them as .PNG files so that you preserve the transparency.  You cannot save .JPEGs, for example, that have transparent backgrounds.  If you save an image with a transparent background as a .JPG it will just save the transparent areas as white.  If you optimize your files for web and devices and size them accordingly, they will display as you want them to and you’ll ensure they have fast loading time.

Here is a quick video showing what we went over in tutorial detailing how to save for web and devices in both Photoshop and Illustrator:

Week 9 (Nov. 7/9):  Studio Day & Rubric Review

For those re-working their rubrics, make sure  you take a look at the outline with instructions provided by Professor Smith.  It is located under Week 5 of the lectures but I’ll also repost it here:

MM2A03-GroupProjectAndPersonalAccomplishmentRubric.doc

Definitions of grading descriptions as provided in the outline are:

A+ Exceptional. Thorough knowledge of concepts and/or techniques and exceptional skill or great originality in the use of those concepts/techniques in satisfying the requirements of an assignment or course.

A Excellent. Thorough knowledge of concepts and/or techniques together with a high degree of skill and/or some elements of originality in satisfying the requirements of an assignment or course.

B+ Very Good. Thorough knowledge of concepts and/or techniques together with a fairly high degree of skill in the use of those concepts/techniques in satisfying the requirements of an assignment or course.

B Good. Good level of knowledge of concepts and/or techniques together with considerable skill in using them to satisfy the requirements of an assignment or course.

C+ Competent. Acceptable level of knowledge of concepts and/or techniques together with considerable skill in using them to satisfy the requirements of an assignment or course.

C Fairly Competent. Acceptable level of knowledge of concepts and/or techniques together with some skill in using them to satisfy the requirements of an assignment or course.

D+ Passing. Slightly better than minimal knowledge of required concepts and/or techniques together with some ability to use them in satisfying the requirements of an assignment or course.

D Barely Passing. Minimum knowledge of concepts and/or techniques needed to satisfy the requirements of an assignment or course.

E Marginally Failing.

F Failing.

Make sure you use proper phrasing for your marking system.  For example, an A+ would be ‘exceptional’ rather than ‘acceptable.’  You may also wish to review sample rubrics provided at the following link:  http://course1.winona.edu/shatfield/air/rubrics.htm as noted in lecture.

Week 8 (Oct. 31/Nov. 2):  Studio Day & Film Tips

In response to AnmL requests for more in class studio time, this week’s tutorial was a studio day!  I’m happy to see the progress groups have been making in the quest for a fabulous end project.  Make sure to stick to the guidelines you’ve set for yourself in your rubrics and flowcharts.

For those doing video shoots this week, make sure you keep video tips we’ve discussed in mind.  Don’t forget that you need to consider lighting (dull light makes for grainy footage), steadiness (use a tripod to avoid shaky footage), framing (if possible, use more than one camera so you can have shots from a distance and close up shots of the same action – BE CREATIVE) and audio (do you need mics on location?).  Make sure you’re prepared with your storyboards so you know what you’re shooting which will optimize your time…and most importantly….ENJOY!

Here’s a link for 8 ways to shoot video like a pro:

http://lifehacker.com/214043/8-ways-to-shoot-video-like-a-pro

If you are shooting video with a DSLR camera here is a quick video of things to check before hitting the record button:

Week 7 (Oct. 24/26):  Poster Design & The LNMC Halloween Photoshop Contest Plus How To Make Print Ready Files With Bleeds!

This week we’re practicing Photoshop techniques by creating our best Halloween posters!  If you’d like to submit your poster to the LNMC Halloween Photoshop Contest, here is the link for you to upload and enter your poster:

http://www.facebook.com/lyonsnewmedia?sk=app_254553244581393

Poster design is a skill many designers need to develop in order to market companies/products/events.  Think about how you would market your group project through a poster – we may have you design some for your year end show!

Here’s the link we went through in class for 32 brilliant poster design tutorials in Photoshop:

http://www.youthedesigner.com/2011/08/01/32-brilliant-poster-design-tutorials-in-photoshop/

We also discussed how to set up files to be print ready – which means they must have a resolution of 300 pixels per inch, they must be in CMYK colour format, and they must have a bleed if your artwork goes to the edge of your work.

Here are some videos which show the importance of bleeds for printing and how to set up Photoshop or Illustrator files with smart guides for printing as we went through in class with our posters.  Note that different printing companies require different bleeds in some cases but the standard is generally .175 of an inch to .25 of an inch.

The importance of bleed in a print ready file:

How to set up print ready files with a bleed in Photoshop:

How to set up print ready files with a bleed in Illustrator:

Week 6 (Oct. 17/19):  Introduction To The Lyons New Media Centre With Chris McAllister & Greg Atkinson!  ~ Thanks To Chris & Greg For Hosting Our Tours!

The Lyons New Media Centre is a fabulous resource for all students but especially Multimedia students!  Chris McAllister & Greg Atkinson (both Multimedia grads) are available for help/advice on Tuesdays and Thursdays in the LNMC as part of the Nerd Herd.  They are a great resource if you need advice on developing your multimedia projects or if you are thinking about developing your own business doing multimedia work.  There are also two computers dedicated for the use of Lynda.com (an awesome software training site with thousands of helpful tutorials).  Lynda.com is a pay site but you get it for FREE in the LNMC!!  There will also be multimedia contests and guest speakers as well as co-op opportunities so make sure you keep track of their current events.  The green screen room, gaming room, and editing suites are available to be reserved so keep that in mind when figuring out what tools you need to develop your own projects.  You may also sign out cameras and other equipment from the centre.  Here are useful links to the LNMC:

LNMC Website:  http://library.mcmaster.ca/lyons

LNMC Facebook:  http://www.facebook.com/lyonsnewmedia

LNMC Twitter:  http://twitter.com/lyonsnewmedia

Chris McAllister:  ANML:  Chris McAllister  Email:  cmcallister@mcmaster.ca

Greg Atkinson:  Email:  atkinson@mcmaster.ca

Week 5 (Oct. 12):  Wednesday Only Tutorial Group Due To Monday Holiday

Group Workshop Day!

Week 4 (Oct. 3/5):  Creating Custom Photoshop Brushes, Recap On FTP And Intro To Web Apps

Photoshop brush sets will become your best friends when creating unique textures to your digital designs.  We experimented with creating our own brushes using silhouette stencils found online (like my Marilyn Monroe stencil) in addition to brush sets we found on Brusheezy.com.  Try layering different brush styles to build your own unique textures.  Remember to keep a folder handy called ‘My Photoshop Brushes’ or something similar so that you have easy access to your brushes as you build your collection.  Most importantly, have fun!  Here is a video which details the process we went over in class.

Since some students had further questions about the process of using FTP we had a recap in tutorial.  The following video details what we went over:

Web apps can be handy tools when constructing websites.  In tutorial we went through two of my favourite and most useful apps – FireBug & MeasureIt.  You can find details about these apps at the following links:

Firebug : integrates with Firefox to put a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page.  You can also find it available for Chrome in the Chrome Web Apps Store.

MeasureIt : draw a ruler across any webpage to check the width, height, or alignment of page elements in pixels.  You can also find it available for Chrome in the Chrome Web Apps Store.

Week 3 (Sept. 26/28):  Deconstructing Website Design

Think about your favourite website.  What makes it so appealing to you?  How does the website incorporate the traditional Elements & Principles of Art with The 9 Essential Principles For Good Web Design as we discussed in lecture this week?  Through analysis and deconstruction of successful design, we gain the ability to understand what makes design successful and how it may be improved if at all.  It also serves to inspire our own work.

Some websites found and presented by students in class demonstrating design techniques include:

www.JimCarrey.com, TheWildernessDowntown.com, www.Google.com, www.sutherlandmodels.com

For more inspiration visit:  50 Great Website Designs For Your Inspiration

Week 2 (Sept. 19/22):  Building A WordPress Website

First of all, what is WordPress?

WordPress is a free, web-based software program that anyone can use to build and maintain a website or blog. It was originally intended as an easy way to set up a blog. But, thanks to the efforts of a large “open source” community of WordPress programmers working to extend and improve its capabilities, WordPress has become much more than just a tool for bloggers.

WordPress can be a great resource for creating all different kinds of websites.  I’ve attached a good video that details what we went over in tutorial on how to create a new WordPress site if you’d like to host one yourself.

Alternatively, you can create your own WordPress site hosted through the McMaster library as we did in tutorial.  Go to:  http://blog.lib.mcmaster.ca/start-your-own/ and select ‘click here to start a blog’.  Your site should be available to you as long as you have an active McMaster email account.  You can also create a WordPress site through www.WordPress.com which would be available to you beyond your school years if you like using it.  One thing to note is there are limitations to how you can use WordPress through the library or WordPress.com  since you don’t have ftp access to your files on the server.  For example, when creating a WP site through the library, you only have access to the plugins which they have made available to you, whereas, when hosting your site yourself, you have unlimited options for plugins you can install, use and manipulate.  The obvious advantage to building a WP site without purchasing hosting is that you can have an operating WP site and avoid hosting costs.  For this reason, the library WP and WordPress.com are good options for practicing using WordPress but ultimately you might opt to host one yourself if you continue to use the software and seek unlimited editing capabilities.

The following video details the steps you need to take in order to install WordPress with your own hosting plan.

Week 1 (Sept. 12/14):  Join Your Artists New Media League Class Website!

Follow the link to create your Artists New Media League profile!

http://sws.humanities.mcmaster.ca/~artistsnewmedialeague

Be Sociable, Share!