Final AIM Design

1

• Final AIM Design
• By Khalil Wehbi
• December 10, 2007

2
Goals and Objectives

• Project Goal
• To implement changes of site layout, structure
  and design based on user feedback.
• Objectives
• Ask users for opinions on visual and structural
  design, including clear navigation.

3
Documentation

• Scope
• My site was fairly complete upon starting the
  project. Most of the changes that needed to be
  made were visual, including new banners that sit
  at the top of each page. Designing my site up
  until this point has revolved mostly around
  working on consistent navigation.
• The actual time it took to complete this project
  was around four or five hours, mostly spent
  creating new banner images and getting user
  feedback on the site.

4
Visual Specifics

• Color Palette

Color Name Hexadecimal Number
Background Black 000000
Body Background - White FFFFFF
Header Dark grey 505050
Links Light blue/Teal 286EA0
Body text Black 404040

• Font
• 76 Verdana, Tahoma, Arial, sans-serif

5
Target Audience

• Prospective employers and personal friends
• Age 20 and up
• Purpose To display accumulated work both as a
  personal résumé and for people to learn more
  about me.

6
Usability

• Feedback suggest renaming of navigation
• AIM Class ? AIM Fall 07
• Sweet Links ? Favorite Links
• Contact Authorities ? Removed
• Users did not like the animated .gif banners to
  continue animating on all AIM pages, so all but
  the main.html page have static Authoring
  Interactive Media images.
• Suggested contact information to be changed to
  link format.
• E-mail address now links to e-mail form.
• AOL Instant-Messenger name pops up message box in
  the program.

7
URL and structure

• http//iam.colum.edu/students/khalil.wehbi
• Site folder layout
• /pub
• index.html
• about.html
• contact.html
• links.html
• /pub/img
• /pub/aim
• /pub/aim/assignments
• /pub/aim/inclass
• /pub/aim/projects
• /pub/aim/projects/project2
• /pub/aim/projects/project3

8
Credits

• Site template by Andreas Viklund
• Programs used
• SciTE
• Adobe Photoshop
• Adobe Illustrator
• Adobe After Effects
• Gallery created with Lightbox 2.0