Fixing the Pixel density on Mobile Devices

Mobile devices are increasingly more popular, making responsive design very important. Unfortunately as technology has been getting better and better we now have the problem of pixel density. A formerly 320 px width mobile device is now 768 px wide making our responsive designs no longer work. To fix this issue we must reset the pixel density for our code to display on the screen. To do this we need to include the code below in the head tag.

<meta name=”viewport” content=”width=device-width, initial-scale=1″>

Final Project

This is a competition based on real-life project. You will be creating all necessary collateral and selling it to the client. As your instructor I will be acting as the client contact and the other design professors will also be acting as part of the client for you to present to.

The first part of this project will require you to select an industry/company type for this project. This will be selected as a class.

Industry/Company Selected: Advertising Agency
Presentation Date: Tuesday, May 2nd during class from 10:30 – 1:20 p.m.

Company Name: The Green Panda Group (Green Panda, Green Panda Group)

#1 – Sara, Shelby and Cheyenne
#2 – Emily, Mariah and Lindsey
#3 – Lorin and Taylor
#4 – Eva, Van and Aston
#5 – Claire, Amir and Tyler

Specification sheet (pdf)

Site Re-Design

Using the steps we worked on for our own websites we are going to tackle a re-design of an existing website. By now you have chosen a website to re-design. Below is the schedule for the 4 steps.

Research and Sketch
Due: Thursday, March 23rd

Due: Thursday, March 30th

Due: Starting presentations Tuesday, April 4th

Due: Thursday, April 13th

Specification sheet (pdf)

Build it!

Once we have the design set and “in the real world” had it approved we are ready to proceed to the construction of the site. Utilizing the html, css and bootstrap code we have talked about and reference that is available online, we must now build our site. Begin by building a template for your sit that the header and footer are there and behave as they should across screen sizes and devices. Once that is complete duplicate the file and add content for the 5 pages your site includes. Note: there may be adjustments to the template for your home pages (index.htm).

Due: Tuesday, March 21st

Specification sheet (pdf)

Prepare to Present Your Site

Before we can go to a presentation we need to gather our collateral that we have been working on and get it into a presentable form. For our presentation we need webpages with the digital versions (for viewing on the devices), handouts (packet), presentation method (powerpoint, keynote, presi, etc.) and your presentation prints (normally mounted to foam core). For this run through we will focus on getting the files together and ready, but not print them yet. Once completed upload a pdf of your print files, one for your packet (that contains the urls for the webpages) and your presentation.

Due: Work on this in class Thursday, March 2nd a to be completed to go over Tuesday, March 7th.

Specification sheet (pdf)