Dan
| n o Eld 3)
t s i l ur na
o j o t Pho
99
-1 (1970
Jennifer Fidler Savannah College of Art and Design ITGM 715: Interactive Web Design Summer 2010 Professor David Meyers Project A Design Brief Monday, 28 June 2010
Table of Contents Project Description . . . . . . . 3 Objective/Rationale . . . . . . . 3 Inspiration . . . . . . . 4 Target Audience . . . . . . . 5 Competition . . . . . . . 5 Site Map . . . . . . . 7 Type Studies . . . . . . . 8 Color Studies . . . . . . 10 Thumbnails . . . . . . 12 Digital Comps . . . . . . 17 Revised Comps . . . . . . 19 Final Site . . . . . . 20 Conclusions . . . . . . 22
Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Project Description Using Macromedia Dreamweaver and any tools you prefer to use for image creation (Photoshop, Illustrator, ImageReady, Fireworks, Digital camera, scanner, etc.), create a fully functioning Web site on the artist or artwork of your choice. Your content should include information about something or someone that has inspired you, presented in a compelling way so as to communicate to others what you like about it. Your site can feature a visual artist, performer, curator, film, exhibition, etc. You are free to choose from any influential artist or artwork, but be sure that your research will provide both imagery and explanatory text that you can use in your site.
Objective/Rationale For my artist, I have select Dan Eldon, a young photojournalist who was stoned to death in Somalia during July of 1993. Only twenty-two when he died, Eldon has become known for his amazingly intricate and beautiful crafted sketchbooks in addition to his war photography. While his mother and sister have worked hard to keep his memory alive through publishing his journals and sponsoring documentaries and books about his life, Eldon’s 3 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
life and work has recently become the subject of a Bronwen Hughes film due for release in 2011 and starring Daniel Radcliff as the young artist. It is my hope to create a site that pays tribute to this young man’s outstanding contributions to the arts as both a photographer and activist, while also referencing existing publications and works regarding Eldon’s life and work.
Inspiration In 1997, Eldon’s mother published a series of his sketchbooks in a book titled The Journey is the Destination: The Journals of Dan Eldon. One of my schoolmates at the time had purchased the book and introduced it during a class discussion. I was immediately drawn to this young man’s story and went out to purchase the book for myself. I have since purchased his sister’s book, Dan Eldon: The Art of Life (published in 2001) as well as the documentary Dying to Tell the Story directed by Kyra Thompson. These works will provide the inspiration behind the design and organization of my finished site.
4 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Target Audience Because of this artist’s age, my primary target audience will be 14-24 year olds, both male and female, coming from a variety of socioeconomic and educational backgrounds. By introducing Eldon’s work to this age group, it is my hope to inspire others to use their understanding of his work and life as motivation in their own lives. As a secondary audience, I hope to target the educators and parents of this age group as a way of fostering discussion of Eldon’s life and work with the primary audience and to ultimately continue the aims of the site as new generations of young artists and learners are born. Competition There are a few sites dedicated to promoting the work of Dan Eldon already in place; however, many of these sites focus on promoting other artists and causes in addition to Eldon. My site is aimed at focusing purely on Eldon while also referencing these sites as a supplement to visitors understanding and appreciation of the artist. Here are links to a few of those sites:
5 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Competition (cont.)
Creative Visions Foundation http://www.creativevisions.org/index.htm Initially inspired by the life and work of Dan Eldon, this organization has grown to encompass a larger group of artists and causes.
Dan Eldon (.org) http://www.daneldon.org/site/ A nicely styled tribute, this site provides a tremendous amount of information and references back to the Creative Visions Foundation. However, the overall architecture of the site is a bit frustrating to navigate due to the large number of referencing pages. I hope to create a site that feels less overwhelming for the viewer while imparting a good deal of information.
Dan Eldon (.com) http://www.daneldon.com/ A beautifully crafted site, daneldon.com fails to provide much more than a link to the Creative Visions site. I hope to provide a bit more information than this site, although it is certainly an inspiration in terms of design and style.
6 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Site Map
HOME
ABOUT ARTIST
GALLERY
RESOURCES
IMPRESSIONS
CONTRIBUTE
Background information about Dan Eldon and his photography/artwork, as well as information pertaining to his mother’s and sister’s efforts to publicize his life and work.
Separate galleries for selected works from Eldon’s photography and sketchbooks, as well as videos found on referenced web sites.
A collection of links and videos found from other sites pertaining to Eldon’s work and life, as well as to publications and films.
My impressions of Eldon’s work and life, as well as ways for others to add their thoughts and understandings.
A further collection of links and activist organizations seeking financial and volunteer assistance, as well as ideas for how young artists might draw inspiration from Eldon’s life and work.
7 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Type Studies
8 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Type Studies (cont.)
9 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Color Studies
1.
10.
19.
2.
11.
20.
3.
12.
21.
4.
13.
22.
5.
14.
23.
6.
15.
24.
7.
16.
25.
8.
17.
26.
9.
19.
27.
10 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Color Studies (cont.)
Pantone DS Uncoated: 7.
12. 313-5, 3-8, 2-9, 5-5, 73-2
8. Web Safe Colors: 13.
12. 999900, CCCC66, FFFFCC, FFCC66, FF3300
20.
23.
24.
26.
11 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Thumbnails
Concept A Edge decoration and navigation remains static while content is scrollable in this version. The design work would be created by taking actual elements from Eldon’s sketchbooks and compositing those elements into a new layout.
12 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Thumbnails (cont.)
Concept B This version is composed of non-scrollable pages laid out to resemble a photograph of Eldon’s sketchbook. As the visitor navigates through the site, the angle of the book is maintained but the content adjusts based on the referencing link.
13 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Thumbnails (cont.)
Concept C Navigation at top will remain as a static element in the browser window while the content is scrollable. The nav links in this version will take the form of rollover buttons laid out to resemble one of Eldon’s contact sheets.
14 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Thumbnails (cont.)
Concept D This variation provides rollover navigation both at the top right and down the left side, and the entire page will be scrollable leading to HTML navigation at the bottom of each page. This thumbnail is currently one of my favorite concepts and will be explored further in the coming week along with Concept E.
15 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Thumbnails (cont.)
Concept E Once again, the edge graphics and navigation structure will remain static on the page while only the content will scroll for the visitor. Navigation will be provided in the form of both rollover graphics along the sides and an HTML nav bar located below the banner. Although slightly more traditional in layout than other concepts, this is one of my favorite thumbnails.
16 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Digital Comps
Concept 1 Based on the Concept E thumbnail sketch, this page is meant to provide scrollable text in the content area while all border graphics and navigation elements remain static. The home page comp is on the left and a mock-up for the “About� page is below.
17 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Digital Comps (cont.)
Concept 2 Based on the Concept A thumbnail sketch, this page is once again meant to provide scrollable text in the content area while all border graphics and navigation elements remain static. The home page comp is on the left and a mock-up for the “About� page is below.
18 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Revised Comps
New Comp Using the feedback provided by my classmates, I created a new style and layout by mixing and matching elements from both concepts I presented. The version shown here is from an actual HTML document with external CSS styling referenced. Below shows how the content div scrolls while all other element remain fixed in position.
19 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Final Site http://studentpages.scad.edu/~jfidle20/itgm715/proj_a/index.htm The images shown here are stills from the final Dan Eldon tribute site. Visit the site for yourself using the URL shown above. Left: Home page; Below: About Dan Eldon page
20 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Final Site (cont.) http://studentpages.scad.edu/~jfidle20/itgm715/proj_a/index.htm Top Left: Gallery page; Top Right: Resources page; Bottom Left: Impressions page; Bottom Right: Contribute page
21 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers
Conclusions
Overall, I am very please with the final look and feel of my site, as well as with the technical aspects of the structure and coding. My goal going into this assignment was to create a site that I would be able to use as a teaching tool with my students in the fall, both from a general art history and a graphic design perspective. Looking at the finished site, I feel I was successful in my attempt and will be proud to use this site in my classroom this year. Thank you to my classmates and professor for the feedback and assistance along the way. Without their comments and suggestions, this site would have not been as appealing, both in terms of accessibility and overall aesthetics.
22 Jennifer Fidler | Savannah College of Art and Design | ITGM 715: Interactive Web Design | Summer 2010 | Professor David Meyers