Feeds:
Posts
Comments

Posts Tagged ‘tutorial’

Hello everyone,

I’d like to thank Philipp for his question about designing posters. Some of you might be also interested in this hot topic so I’ll copy-paste my email reply to Philipp for you. Also, the kind folks at Washington State University are generously sharing a tutorial on the subject. You can download it by clicking on the gigantic PDF icon on the right as well.

Happy designing and here come the instructions:

Normally, you should have a balance between images and words on your poster. In other words, use the principle “a picture is worth a thousand words” from the famous Chinese proverb.

Your text should be clearly visible and easy to read from a distance. Strip everything down to the most effective possible content — the essence that conveys the maximum meaning based on your topic. Breaking the rules is also fine as long as you have a reason justified by your main objective, i.e., communicating meaning in a way that is visually accessible, aesthetically stimulating, and textually focused.

In this project you have the freedom to choose a tone of voice that matches the overall energy of your project. Think about the audience you are designing for. What would resonate with their outlook, interests, and sensitivities? Informal, academic, or a combination of those ingredients will be absolutely fine as long as you get your message across effectively. Making things fresh and entertaining along the way would be a definite plus as well.

Also, have a look at the student-produced posters in Research IV. You can learn a lot about the relationship between form and content and how to balance these elements in your designs.

Advertisements

Read Full Post »

Resources

Read Full Post »

Dear students, this one is more of a resource than a tool, but to keep things simple, I’ve included it in the series.

Moby has created a collection of music you can use in your project videos provided you keep things non-profit. The site is called Moby Gratis and is waiting for you here. Let me remind you that for your new media production adventures you can borrow a camera or other toys from Kai Mettler at the IRC.

Alternatively, you could go totally grass roots by using an Internet camera (the one you have for video chat). A simple way to do it would be to sign up for an account at Viddler, record your video by saving it directly on their site, then copy and embed the video on your site.

We already covered embedding media in class, but if you need some help, I’ll be happy to hear from you!

Read Full Post »

seo rapHi folks,

Well, just when I thought we were done for today, I came across this hip hop site design tutorial over at Justin’s Tasty Blog Snack. Following the elements SEO Rapper outlines will be important in the development of your projects.

Some theoretical background before we go into the video:

Q: What is SEO?

A: Here’s a nice simple definition from the folks at SLS Consulting:

Search engine optimization (SEO) – Creating and improving a website so that it will rank high in the search engines and help potential customers or clients find the website.

. . . and the lyrics, that is, tutorial 😉

Design Coding

Your site design is the first thing people see
it should be reflective of you and the industry
easy to look at with a nice navigation
when you can’t find what you want it causes frustration

a clear Call to action to increase the temptation
use appealing graphics they create motivation
if you have animation
use with moderation
cause search engines can’t index the information

display the logos of all your associations
highlight your contact info that’s an obligation
create a clean design you can use some decoration
but to try to prevent any client hesitation

every page that they click should provide and explanation
should be easy to understand like having a conversation
when you design the style go ahead and use your imagination

but make sure you use correct color combinations
do some investigation, look at other organizations
but don’t duplicate or you might face a litigation
design done, congratulations but it’s time to start construction

follow these instructions when you move into production
your photoshop functions then slice that design
do your layout with divs make sure that it’s aligned
please don’t use tables even though they work fine
when it come to indexing they give searches a hard time

make it easy for the spiders to crawl what you provide
remove font type, font color and font size
no background colors, keep your coding real neat

tag your look and feel on a separate style sheet
better results with xml and css
now you making progress, a lil closer to success
describe your doctype so the browser can relate
make sure you do it great or it won’t validate

check in all browsers, I do it directly
gotta make sure that it renders correctly
some use IE, some others use Flock
some use AOL, I use Firefox

title everything including links and images
don’t use italics, use emphasis
don’t use bold, please use strong
if you use bold that’s old and wrong

when you use CSS, you page will load quicker
client satisfied like they eating on a snicker
they stuck on your page like you made it with a sticker
and then they convert now that’s the real kicker
make you a lil richer, your site a lil slicker

design and code right man I hope you get the picture
what I’m telling you is true man it should be a scripture
if it’s built right you’ll be the pick of the litter
everyone will want to follow you like twitter
competition will get bitter and you’ll shine like glitter

if you trying to grow your company will get bigger
design and code right man can you get with it

Photo by b_d_solis

Read Full Post »

online storage and sharing with box.netBox.net is an online storage service, which you can also use to share files with your site visitors. Here’s how it works:

  • Step 1 — register for a free account (1GB storage space). You can do this by going to the “Sign Up for Box.net” area and selecting the “Lite” option from the “Select Account Type” drop-down menu. Click on the thumbnail image (on this page) to maximize the visual guide in your browser.
  • Step 2 — upload your files, enable the sharing option from your Box.net dashboard and create a widget.
  • Step 3 — embed it in you wordpress.com site using the box.net widget.

If you followed all instructions correctly, you should have a box with shared files just like the one called “Orientation” in the sidebar of this site!

Read Full Post »

In this new series, I’ll introduce you to free/opensource software and web 2.0 services you can incorporate in your projects. You can search for “Tools of the Trade” posts in the “Resources” category.

ViddlerLet’s begin with Viddler. The video bellow is an excellent tutorial on the features of the service. To embed media from Viddler, click the “menu” button, select the “Embed” option from the menu above, choose “WordPress.com” and click “copy code.” Go to you WordPress editor, click “HTML” to the left of “Visual,” paste the code and hit the save button, which has been moved to the right in WordPress 2.5.

Best of luck!

Read Full Post »