Our First Critique is Wednesday!!!
What do you need to submit?
Four jpgs representing the color mock-ups for your redesigned New Jersey State Parks website
- color mock-up of your homepage
- color mock-up of child page #1
- color mock-up of child page #2
- color mock-up of child page #3
Name each page according to what they are, and include your last name. Example: lastname_home, lastname_contact, lastname_parks, etc.
What is a color mock up?
This is the version of your web pages made in Photoshop to look EXACTLY as they will appear online. Of course, these are static designs, so I don’t expect you to show functionality (hover menus, effects, etc). However, the pages should be finished how you want an online visitor to encounter them. This means including a color scheme, fonts, photos and text appropriate to each page. Text can be obtained by copying and pasting from the existing parks site.
Incidentally, your mock ups will likely closely follow the structure of your wireframes. That’s why we did wireframes, after all, to figure things out. That said, feel free to make changes as need be. Designs evolve.
Example of a mock-up (not NJ Parks, obviously, but you get the idea)
…to style and arrange your pages in such a way that they all look like they belong to the same website. Carry over design elements (colors, shapes, etc) and parts of the page (headings, link buttons, etc.) so that everything looks like it belongs together. Pay attention to the elements and principles of design as well as the considerations of web design. And, as always, don’t reinvent the wheel.
Save it… Save it Good!
Once you have all four of your mock-ups done in Photoshop, use the File>Save As function to save a copy in jpg (jpeg) format. Use the maximum quality setting (12). If you haven’t already (and why haven’t you?!?), make sure to save a psd version as well. Psds are editible. Repeat… save both a jpg and a psd of each mock-up.
When Is This Due?
Collect the four jpgs together in a folder titled lastname_project1. Upload this folder to our Class Attendance Dropbox NO LATER than 12:25 pm on Wednesday 10/21/15. We will be critiquing all period, so you will have no further in-class time to work.
That said, I will come in at 11:40 on Wednesday to answer last minute questions. It’s not a good idea to arrive to this pre-class session with a lot of unfinished work to slog through. You won’t have time to do it, and no late work is accepted. You don’t want to get a zero on this one, folks; Project 1 is worth 15% of your total course grade. That said, if something’s not totally perfectly perfect by 12:25, upload it anyway. Some credit is better than no credit.
Come to class Wednesday prepared to take notes on the suggestions people give you as well as to share ideas about your own about your work and the work of others. We will be using the tools of visual analysis (design elements and principles, considerations of web design) as a framework for our discussions.
Remember, crits are the exams of studio classes, and you are expected to show up on time and prepared. We will talk about the process before we get started. Incidentally, it’s natural to feel a little woogy. To me critiques often seem like this:
But don’t freak out. We will strive to make the feedback as constructive/helpful as possible.
Per our syllabus, missing Wednesday’s critique will automatically result in you losing one letter grade for this project. If for some reason you must be absent, turn in your work online prior to the start of class. Absence is not an excuse for late work. In fact, I imagine you know the drill by now: no late work is accepted. In a pinch, upload what you have by the 12:25 deadline. Some credit is better than no credit.
After Wednesday, you will have the weekend to improve your designs according to what you learned in critique, and I highly recommend you take advantage of the opportunity. You don’t have to agree with what everyone said or make each change suggested, but you should carefully consider/tweak so you end up with the best design possible. Remember 15% of your course grade is tied up in this project.
E-mail or leave a comment on this post. The sooner the better. Last minute queries may not get answered.
Finally Final Turn Ins (NOT DUE ‘TIL MONDAY)
On Monday, October 26, all steps of Project 1 must be turned in. That’s next Monday, not this coming Wednesday. I’ll give you more info next class, but in brief, Project 1 includes:
Step 1: Written Analysis of Existing Site
Step 2a: Sitemap of Existing Site
Step 2b: Redesigned Sitemap including photos of your post it or card experiments PLUS a written out flow chart
Step 3: 10+ Thumbnails
Step 4: Four (4) Wireframes (1 each of homepage and the 3 chosen child pages)
Step 5: Four (4) color mock ups (1 each of homepage and 3 chosen child pages) revised to the best you can make them.
If you’ve been keeping up, this should be no big deal… just some gathering and organization, and four days to do it. 🙂
BTW, some of these steps may be in paper form. Gather hardcopy items together in a folder or staple them, and then label with your name. All digital work should be in psd format (so I can see layers), gathered in a folder titled lastname_project1_final, zipped (compressed) and submitted to me via e-mail.
We’ve come a long way and done a lot of work over the past few weeks. I know the theory and technology of Web Page Design can be frustrating at times, but I’m proud of you all for sticking with it. Pats on the back and happy turtles to everyone. P.S. Coding returns on Monday!