Web Design Portfolio (KPA)


The goal of this project is to asses the stu­den­t’s per­for­mance and poten­tial in the graphic design field.


The objec­tive of this assign­ment is to pro­vide an assess­ment of the stu­den­t’s port­fo­lio and efforts as part of the Uni­ver­si­ty’s Key Per­for­mance Assess­ment process (for­merly the Whole Per­son Assess­ment Pro­gram) using the cor­re­spond­ing rubric.

Background Reading


Using com­ments and sug­ges­tions for pre­vi­ous eval­u­a­tions and class­room cri­tiques, revise and turn in course assign­ments. This process should be done well before the final dead­line for the review. Often, the best time to revise a project is imme­di­ately after the review. Con­sider the craft nec­es­sary to main­tain a pro­fes­sional level of pro­duc­tion. Doc­u­ment your progress through brain­storm­ing, sketches and revi­sions, both phys­i­cal and digital.

Part One

Project Specifics will be updated to reflect adapt­ing course assignments.

Please sub­mit the fol­low­ing projects to your hosted web­site and to the appro­pri­ate D2L project drop­box for review:

  • Assign­ment 05.06: Frame­works and Lay­out (Choose best three frame­work images, screen­shot of browser, and HTML pages to post)
  • Assign­ment 06.06: Cre­ative Page Layout
  • Assign­ment 08.11: Port­fo­lio Site (hosted site)
  • Semes­ter Two: Assign­ment 01.01.02: Site Lay­out and Frameworks
  • Semes­ter Two: Assign­ment 02.04.02: Dig­i­tal Mag­a­zine and Java Script Inte­gra­tion Part One
  • Semes­ter Two: Assign­ment 03.09.02: User Expe­ri­ence Design
  • Process doc­u­men­ta­tion of a min­i­mum of one project ref­er­enced above (Pro­vide exam­ples, espe­cially sketches to proofs, to fin­ished project.)
  • Web projects com­pleted out­side of course requirements

Make a post for each project on your port­fo­lio site. Doc­u­ment each project with a short descrip­tion of details regard­ing the project para­me­ters: date, size, media, project objec­tive etc. Screen­shot, cre­ate and crop project images to ensure that mul­ti­ple details and sub­tle aspects are pre­served. Some use of stag­ing tem­plates is accept­able, but they should not take the pri­or­ity of the analy­sis of your work.

Using the instruc­tions in class, upload the HTML files to your web­site. Cre­ate a link in the text/image to the index pages of each assign­ment. Ulti­mately, review­ers of your port­fo­lio will want to inspect your code. Pro­vid­ing sta­tic, but func­tional, HTML will accom­mo­date for that inquiry. (If unable to upload the sta­tic pages, ensure that you have ade­quate infor­ma­tion to sup­port your assessment.)

Part Two

Nav­i­gate to your site’s cat­e­gory or tag for the rel­e­vant projects and take a screen shot. Upload it to the appro­pri­ate D2L drop­box and cre­ate a click­able, direct link to the page in the com­ments section.

To take a screen-shot:

  • Com­mand-Shift-4-Space­bar: Takes a screen­shot of the win­dow, and saves it as a file on the desk­top. The file will have a .png extension.
  • Com­mand-Shift‑3: Takes a screen­shot of the entire screen, and saves it as a file on the desk­top. The file will have a .png extension.
  • Instead of using the key­board short­cuts above, screen­shots can be taken by using the Screen­shot appli­ca­tion included with Mac OS X. It is located at /Applications/Utilities/Screenshot or by search­ing via Spot­light in the upper right of the Mac screen.
  • For more infor­ma­tion, please visit: https://​sup​port​.apple​.com/​e​n​-​u​s​/​H​T​2​0​1​361


  • The fol­low­ing rubric posted on D2L will deter­mine Key Pro­gram Assess­ment scores: Web Design Port­fo­lio (KPA)
  • The fol­low­ing rubric posted on D2L will deter­mine Whole Per­son Assess­ment (WPA) scores: WPA-AGRD-Web Design Port­fo­lio (dep­re­cated 11.25.2023)


Cumu­la­tive from each assign­ment or project


As defined by each assign­ment or project.


As defined by cor­re­spond­ing cal­en­dar item, drop­box, dis­cus­sion or con­tent topic description.