Problem Overview
On the left is a screen grab of the homepage of the web site for the UNI Department of Art. I designed the entire site over the summer about five years ago. I still like it alot and (unless they’re being kind) other people like it as well. We often get emails from alumni as well as from people who have no connection to UNI, saying how much they enjoy it.

That said, nothing lasts forever, nor should it. I have often thought that the department’s digital presence is in need of a complete facelift. But I’ve neglected to do it myself. It would be an exhaustive undertaking, and I have lots of things to do.

So for this problem, I’m asking each of you to come up with at least one proposal (hopefully more) for a new “style”—a new look—for the website. Don’t misunderstand: I’m NOT asking you to design the entire website. In fact, I’m not even asking you to produce an actual functioning web page. At this stage, all I’m asking of you is to use non-web software (such as Photoshop) to develop print-based mock-ups of the possible on-screen appearance of four web pages: 

(1) A new departmental homepage (that’s the most important part—if that’s not absolutely stunning, no one will go any further); 

(2)(3) Layouts in a style that’s consistent with the homepage for any two section pages (such as Degrees, Areas, Facilities, Personnel and so on—the list that’s on the left hand side of the current  website); 

and (4) The individual faculty page for any member of the current faculty.

http://www.uni.edu/artdept/Degrees.htmlhttp://www.uni.edu/artdept/Areas.htmlhttp://www.uni.edu/artdept/Facilities.htmlhttp://www.uni.edu/artdept/Personnel.htmlhttp://www.uni.edu/artdept/Personnel.htmlshapeimage_2_link_0shapeimage_2_link_1shapeimage_2_link_2shapeimage_2_link_3shapeimage_2_link_4
600:125 Section 2
graphic design two | problem 3
Click here to hop to the course calendar
 
This problem will be critiqued in class on Wednesday, October 12. Revisions are due one week later.
home
Technical Concerns
1) You will need to make a decision about the proportion of the website screen. When I designed the current one, I made it 800 pixels wide because the largest number of people could then access it on the widest range of computer screens. That didn’t give me much room, so I decided to make a vertically proportioned page that requires the viewer to scroll down to read the entire page. That means that the “hottest” region on that page is the top two thirds or so. If I had decided not to require scrolling, I probably would have used a page that was 880 pixels wide by 600 pixels tall. Since we’re just doing mock-ups (not actual web pages), you could work at any size in Photoshop so long as it has the proportion of 8 wide by 6 deep (which is the same as 4 x 3). So a reasonable non-scrolling page size might be 9 inches wide by 6.75 inches tall (at 300 dpi), printed horizontally on 11 x 8.5 paper. Or, if you decide to scroll, then the printed image would be 9 inches wide and as deep as you permit.

2) You must use web-safe fonts for the text. (Do NOT use Comic Sans, which is a web-safe font unfortunately, but is universally known as a font that only imbeciles use—and we don’t want to look like imbeciles. It will only attract more.)

3) Even though we are going to look at these page layouts in printed form (we would normally convert them to CMYK before printing), work in RGB and don’t convert. Web sites are in RGB.

4) Important choices you’ll have to make: What font(s) will you use throoughout your pages? At what point size(s)? In what paragraph style, and with what linespacing setting? Will the background be white, black or another color(s)? Or will faint image patterns serve as the background? And what will be the setting for the screen space that’s outside your web page(s), called the browser background? How will you provide (on each and every page) navigation links (buttons or whatever) to other parts of the web site.http://www.fonttester.com/web_safe_fonts.htmlhttp://bancomicsans.com/main/shapeimage_6_link_0shapeimage_6_link_1
To do this, all the text you will need is on the current website. As for photographs, I will make available to you dozens of them (most do not appear on the current site) on various disks. In addition, you shouldn’t hesitate to supplement those with departmental photographs that you yourself might make for this project with a digital camera.