Objective

To design and develop a digital portfolio in the form a personal web site for self-promotion purposes. To showcase web design and web development skills for the purpose of obtaining employment.

Description

Design a digital portfolio in the form of a web site. Publish your web site under your own domain name. The web site should be compatible with the look-and-feel of your other self-promotion materials (i.e. your business card).

The contents of your digital portfolio should contain at least the following:

• a home page (a.k.a. splash page or front page)
• samples from your portfolio
• résumé page
• contact information
• philosophy statement (optional)
• personal information (optional)

Procedure

1. RESEARCH AND DOMAIN SET-UP: Research existing portfolio web sites of design firms, freelance designers, photographers, illustrators, etc. (be sure to review these local links). Then review and critique the digital portfolios of recent Parkland graphic design graduates. Your objective should be to make your portfolio web site better than theirs. Purchase your domain name and sign-up for a hosting package.

2. DEVELOP THE CONCEPT: In your sketchbook begin to conceptualize ideas for this project (see sample thumbnails). Make at least 10 sketches of all possible directions you might take this project. Draw exactly how you intend to layout key pages of your site (i.e. splash page, inside page, portfolio page). Edit your concepts down to your best three ideas and redraw them inside a browser window using a felt tip pen (download blank browser window ). Rough out site maps (download examples of site maps) as needed to explain your navigation scheme. Share your concepts/site map with your team members and ask for feedback.

3. PROTOTYPE MOCK-UP: Based on the critique of the above, create a prototype "mock-up" of key sample screens in Adobe Photoshop which will indicate the "look and feel" of the web site. Place your art inside a blank browser window (download blank browser chrome in PNG format). Also develop your site architecture by preparing the text for your web site and publish a text-only web site (see example). Generate web-ready JPEGs of your prototype screens and publish them on your personal projects page for critique.

4. TEMPLATE PRODUCTION: Revise your layout as needed, then slice up your pixel elements and produce working template pages in XHMTL. Publish your templates on your personal projects page for critique.

5. WEBSITE PRODUCTION: Revise your template as needed, then produce a fully functional web site. Publish your web site with your own hosting service and make a link from your personal projects page for critique.

6. FINAL PRESENTATION: Based on the critique of the above, revise your web site as needed and present your finished site on screen for final critique. If necessary, make refinements until you are 100% satisfied with the project.

7. GRADING: Review your projects page and make sure you have an accurate record of your process. You will not receive credit for this project if any of the above elements are missing.

8. STUDENT GALLERY ARCHIVES: Prepare a ZIP archive of your finished web site and drop it in Angel's drop box. Your project may be published in a showcase of student work on Parkland's web site.