Flash/HTML Project

Good job last night. Below are some other cool examples of Flash as well as the attached presentation from class.

A couple of date reminders:

1. Next week (11/1), your 5 examples of Flash sites are due. Do some exploring, find what you think are 5 great examples of Flash design and write a couple of sentences for each. You might be asking "where do I write these sentences?" Once you find your examples, create a free blog account with blogger, word press, tumblr, etc. and use your new blog for capturing your site links, thumbnails and commentary for each.

2. Required viewing and reading (below)

- Required Viewing - first 6 episodes

- Required Reading - Love The Internet

I'll start off our next class answering questions and reviewing anything that you need more clarification on for the Flash assignment. ALSO, I typically hold lab hours on the Saturday before the  assignment is due. I'll be at the lab on 11/10 @ 3:00-4:00. This will given you some additional time to ask questions and finalize your assignment.

3. Your Flash/HTML site is due 11/15. We will be critiquing everyone's assignment via hosting it within DropBox vs. launching from the class folder. Refer to the lecture deck for details on the assignment. 

4. Here's some best practices to follow as you work on your assignment: 

A. 72 DPI for images ONLY (check this by going to Image > Image Size your dpi is in the resolution box)

These images should be created in photoshop ideally since you have the option to "save for web and devices". This option will allow you to adjust the quality of the image so that file size is as low as possible without losing a significant amount of image quality. 72 dpi is a web standard you do not need a higher resolution for web. If you do have higher res images, it's going to greatly impact the size and performance of your page.

B. Make sure your pictures are the exact same size width and height as the dummy images. 

(Because I coded in what the image sizes should be the browser will shrink or expand the image to fit the size I've specified no matter the original file size BUT the browser shouldn't have to do that much work.) Even if they are 1 pixel off, it will throw the entire layout out of alignment.

C. I will be setting up a public DropBox account for everyone to use in hosting their site. Once I do, I'll post information to this blog. We still have time for this task.

D. Don't forget to save out the favicon for your site (the little image that lives on a site's tab and one that's used for bookmarks) save out a 16x16px PNG and name it favicon.png. 

If you keep the above points in mind when finishing up your site then you're well on your way in developing best practices as a web designer (as well as pissing less developers off). If you have any questions before next class, feel free to e-mail. 

Jessica is also available for questions so feel free to email her at aurorasc@bu.edu.

Below are all the assets and files for the assignment:

HTML template wireframe
PSD Template
HTML Template Files

Attached Lecture Deck

Here's a link to a few past Flash examples that students completed for their assignment. However, we've retooled this particular assignment so they probably won't give you much insight.

This is your chance to jump start your own portfolio site. Do a good job on this. I'm only requiring this one page but the assignment is scalable for you to keep adding pages.

50 most beautiful Flash sites

Magazine Cover Tidbits

There were a few questions in class yesterday that prompted me to give a few more tidbits of advice for the magazine cover design.

1. If you're comfortable printing to a larger size ( tabloid) and trimming on the crop marks, feel free to do so. However, if you don't understand completely or want to wait till class starts, we can do them together.  Either choice is fine.

2. For many magazine logos, there exists vector versions of their logos which can scale infinitely and be edited (if needed) in Illustrator. Brands of the world is a great resource. However, not all are there which means you might have to Google the logo. Once you receive the search results, view by "Images" and look for the vector or largest version there is. For print projects like magazine covers, large is always better. Lastly, if you're making up your magazine or can't find the logo, try and typeset it the best you can.

3. The same goes for images - the larger the image or picture, the better.

4. The easy part of any magazine cover is the image and logo. What makes a really great design is how the other type elements are treated. Research and look carefully at other alike magazines and notice how they structure the type, what colors they use and most of all, how the type works with the image. If you find a great image that doesn't work with the type, find a new image....even if you love the one you have...if people can't read the type, it's not a successful cover design.

5. Design is an organic process. The instructions I put in the lecture are pretty accurate but not perfect. Use common sense or make an executive decision if something's not clear to you. Of course, you can email me and/or the TA at any point with questions.

The sketches and ideas I reviewed yesterday were really tight. This should be a great piece for you to both build your portfolio with as well as solidify the basics of InDesign.

Thx
Scout

InDesign Lecture

Great job on everyone's iphone applications - really! Throughout the critique, there were comments and refinements from your peers and myself on ways they all could be tweaked. If you'd like further clarification on your specific project, let one of us know. It's not required to do anything more to them - for some of you, it's a good portfolio piece so you'd want to make it as good as it can get.

Here is the lecture deck.

Refer to your syllabus for assignment due dates but in a nut shell, sketches of your magazine cover designs along with 3 good magazine cover designs are due next week. We'll also be doing an in-class InDesign walk-thru next week. Final magazine cover due the week after.

Here's a link to some great cover designs I found.