Create Mockups for the Home and Contact Pages OR Create Two Full Color Still Images for Animation Project


 

In this lab you will create mockups (comps) for your home page and contact page. Remember to include enough (or all) details to give a realistic perspective of what your project will look like as a website or animation project. Your mockups should be complete enough that someone else could build the website or animation project from the mockups.

Be sure to include the actual font, font sizes, exact sized images (or placeholder images), and exact size text that will mirror the final pages or project frames. Refer to the lecture for best practices and what to include in your mockups if you are not sure.

You may use any graphics editor program that you like (Adobe Photoshop, Fireworks, Illustrator, etc.) and save your work as TWO separate JPG files.

Upload your two files to your STUDENT SERVER SPACE and provide the url to your instructor in the dropbox comments area below. Provide your instructor with the link to your student space url where the files are located.

Animation Students: Create Two Still Images for Final Animation Project

Animation is simply a collection of still images that give the user the illusion of movement. For this lab, you will take those first steps and create the first two images that will ultimately be the first two animation frames for your final project. You may use Photoshop for raster needs, but your actual layouts MUST be created using Illustrator.

Your project will be a series of images that focus on the main components of user experience design. Consider this project as an overview that illustrates or explains these main user experience concepts to someone (a client, a relative, etc) who knows nothing at all about the field. How would you, a design and animation expert who knows about user experience, help a non-designer understand what UX is? The answer to that question is the subject of your animation project as a whole. It is recommended that you FIRST decide which subjects of UX you wish to explain, considering everything you have learned thus far, and then begin this week’s project creation.

NOTE: Like web mockups are static images for a final project that would be built in HTML, these static images are mockups for a final project that would be animated. You will NOT be animating anything in this course, so focus on the art and layout and message.

To help you get started, this week you will need to create two images/layouts for your project: one image/layout will be the title image that you’ll use to let viewers know what your project is about. The second layout/image should illustrate the first piece of information you will present to viewers as you educate them on the concept of UX. This image/layout will be your source of inspiration next week when you will add three more images/layouts to your project.

When you submit these static images, in the drop box area be sure to include all the details and include any notations that are necessary to explain your images and overall project goal for your instructor. If you prefer to submit this information within a Word document you are welcome to do so.

An important point to keep in mind is that these images are the first glimpses of your design, so it is very important to create professional quality pieces. Make sure you pay attention to details and ensure the two images will animate without any hiccups.

You must use Illustrator for your projects, but will also need to export your .AI files as TWO separate JPG files for submission. Be sure to label your images appropriately.

Upload your files to your STUDENT SERVER SPACE and provide the url to your instructor in the dropbox comments area below. Provide your instructor with the link to your student space url where the files are located.

Please check the Course Calendar for specific due dates.