CARRIE SUCHARSKI | INTERACTIVE MEDIA DESIGNER
IMD465
Senior Project Design ▪ Ameeta Jadav ▪ Summer Quarter 2005
Visual Comps Concept and Style Guide ▪ August 18,
2005
Concept
The
following document explains the design choices for the website of Elephant Trax.
With this website, I want the viewer to immediately feel
like they are in the wild with one of the jungle’s most powerful animals, the
elephant. The website is designed to have an African tribal and cultural feel.
This is accomplished through decorative elements included in the navigation and
page header section.
Leaves,
brush, and organic curves are used within the design to convey a feeling of
nature, specifically a jungle. This jungle theme is used for two reasons, one
being that elephants live in the jungle, and also because my style of music is
referred to as ‘jungle’. There is also an elephant at the bottom of the page
that is emerging from the brush. The elephant is placed here so that the user
will feel like the elephant, or Elephant Trax, is reaching out to them and is
accessible to anyone.
For
the layout, information is displayed in a standard hierarchal manner. At the
top of the page is the logo and name of the website, followed by the
navigation, which is then followed by a page heading. Next is the body content,
which is then followed by the disclaimer and copyright text.
Visual
Comps
To view the visual comps, please
visit this site: http://trax.vintagestars.com/home.html
Style
Guide
The
following table represents the colors that are used in the logo and within the
website’s style guide and formatting.
|
Hex Code: 00551A |
Dark
Green - Green represents the jungle, nature,
and peacefulness. Website
Use: Table Borders |
|
Hex Code: F9F400 |
Bright
Yellow - Represents the sun, light, and energy.
Also representative of yellow birds within the jungle. Website:
Strong Page Headings |
|
Hex Code: FFF99D |
Light
Yellow - Used in the outline of the Elephant Website
Use: Page/Body Text and Scrollbar accents |
|
Hex Code: EF9C00 |
Bright
Website
Use: Links |
|
Hex Code: 000000 |
Black
- Provides a dark background to make the other elements “pop” into focus.
Black is also used because my music is very mysterious as it does not have
words. Website
Use: Page Background Color |
Font Treatment
For
the logo font, I choose a futuristic type called “Nostromo.” The reason I
choose this blocky and futuristic font is because the other elements in the logo
are very curvy and nature-like. However, I needed this particular font in order
to portray the technology that is used to make my music. For half of my music
collection, the sound is very natural and harmonious. However, there are other
songs in my catalog that sound very synthesized and futuristic, so I could not
leave that element out of the logo.
For
the page text, the following fonts will be applied to each style – content,
headings, links, and disclaimer text. A series of fonts will be used in case a
user does not have the first font available on their machine, so that the
browser can default to the next consecutive font and so on.
Body
Text: Tahoma, Trebuchet, Verdana, 12 pixels, Light Yellow
Links:
Tahoma, Trebuchet, Verdana, font size variable, Bright Orange
Scrollbar:
Dark Green and Light Yellow