Web Design

The Iron Yard Austin — Jan 2015

View the Project on GitHub

PreWorkPlus

An extra set of PreWork Reading and Exercises for Web Design. The goals of PreWorkPlus that is it optional continued PreWork for when the main Prework is completed. There is no due date and the topics either build on the PreWork or include new topics.

PreWork and PreWorkPlus Office Hours

For the following two weeks (January 12–16, January 19–23) before our class, Sam will be available during the following times to answer questions in person at The Iron Yard about Prework or PreworkPlus assignments or chat one-on-one:

General Questions from Students

If you have more questions, please email me and I'll answer them!

  1. How long will it take to get used to these programs?

    Design and code is a lot like going to the gym: one day at the gym won't make a difference, so scheduling regular workouts will, so keep at it! Also, the first few days at the gym are the hardest. You're sore, tired, and not used to the routine yet. After that, it becomes easier, and easier to remember.

  2. Do you recommend any tools that might come in handy for these two programs?

    You'll learn pretty quickly that a designer's workflow is made a lot easier and saves them a lot of time when they use keyboard shortcuts on their Macs. Most mac keyboard shortcuts are similar to their Windows counterpart with the use of Command (⌘) shortcut. To review common ones check out this resource by Dan Rodney. The most important for our uses will be New (⌘ + N), Save (⌘ + S), and Refresh (⌘ + R).

    I also think it's a great idea to invest in a cheap two-button mouse. I use the Apple Magic Mouse myself, but ANY mouse will work and it does not have to be an expensive one. It's also a good thing to know that you can adjust your mouse or trackpad settings to our own liking by clicking on the  symbol at the top left of your computer screen, selecting System Preferences and then Mouse or Trackpad. Another great tip: you can left-click on your mouse which having the Control (CTRL) button pushed to access a right-click option or menu.

    Both Photoshop and Illustrator have keyboard shortcuts that will save you lots of time down the road. Both programs use single-button shortcuts to switch between tools. Here are some shortcut cheat-sheets:

Photoshop Assignments

Photoshop is great program for editing or retouching photos. It's great for designing website layouts, just like Illustrator, but because its more available and previews everything in pixels, its more accurate and more popular. It's great for saving a logo as a web-friendly image, but it is not the program that logo should be designed in.

Illustrator Assignments

There are quite a few different elements to Illustrator. One of the best ways I can describe it to new designers is that it is basically the computer version of arts and crafts class as a kid. Shapes and layers are like construction paper. It's great for logos, but not for photo editing. It's great for typography, and loads almost everything as vector, which is made up of points.

Reading about Design Theory

General advice (reading)