We will be watching videos by Bill Viola,
Gary Hill, Cheryl Doneagain, Tony Oursler, and Sadie Benning, among others
as examples of fine arts video. We will also be watching segments from
HBO and commercial televison and cinema for formal critique.Due to the
small format and target venue, titles are not recommended.Begin by spending
as much time as possible with the camera. Experiment. Shoot what interests
you, what is around you. Remember the drifting, floating bag in the movie
'American Beauty'?Download/offload segments of this footage and experiment
in Premiere or Final Cut Pro. Utilize compositing techniques, fades, cuts,
dissolves, slow and fast motion effects and transitions.
Ultimately only use an effect if it enhances the content.The duration, content,
and style of the video is up to you. There can be a series of related shorts,
or one longer piece. Audio is an often overlooked element, and will make
or break your work. 3 excellent links: ifilm.com newvenue.com vdb.org Your
final step is to compress the video for the web and place it
on a webpage. The user should be able to select an link and see
the movie open up in a fitted window, preferably in the center
of the screen.
Subject
matter: desktop iconography,forms,menus, rollovers, perhaps in a subversive
or unpredictable way (see the handout for examples- visit the sites mentioned
as well).
Use screen shots to gather source material. Be creative.Requirements/options:3
to 5 robust flashed web pages, linked. Minimum 5 rollovers with animation,
dropdown menus, links.5 to 10 more basic flash or html pages linked.10
to 15 images put together in photoshop and printed, exhibition quality.
Include an artist statement, and a list of 5 artists you can discuss in
terms of their influence.
Related Artists
Gamet Hertz | from Web Work : A History
of Internet Art Artforum May 2000
Natalie Bookchin | from Web Work : A History
of Internet Art Artforum May 2000
Exquisite
Corpse
Look up the definition of exquisite corpse. Note the
context in which the first surrealist drawings were made.
Each course level will have limitations or specific technical objectives,
such as the use of scrollers, video, and audio.
Interpret the body part you have selected: Possibilities include video stills,
animation, lateral and hierarchical web links, text, abstraction, metaphors,
and a mix of traditional and electronic media - such as video, audio, photography,
drawing, painting, printmaking, and collage.
Individual student bodypart links will be displayed on a macro interface
for the final.
NOTE: the links below link directly to a swf...This will
not work in exlorer
Environs
Each
section will interpret this differently depending on skill level, number
of people in your group, and time constraints.Your section will decide on
the interface, the macro/micro elements, linking, and navigation.Your microenvironments
will be web-rooms, areas of distinct mood, feeling, and appearance. The user
must navigate through these actively or passively, from environment
to environment, from macro level to micro. Reference
Tufte for ideas on flatness, layering, and macro/micro relationships,
and note use of lateral and/or hierarchical navigation.Consider
animation, video, and audio. Level 1 starts on this midterm.
Level 2 students start on this at midterm as well, after developing web spaces.
Level 3 and 4 start immediately.
Interior/exterior
Create
two environments, either representational or abstract, that deal with contrasting
exterior and interior environments. Level
1: consider adding the elements of
motion graphics, speed, acceleration, and tempo, to the concepts covered
in the first half of the semester.
A good way to begin would be to create two
images/environments in Photoshop, and bring them into Flash.
Size is a consideration:
proportions should not exceed 550 x 400 (the default stage size in Flash)
but you can alter this to be any format – long, skinny, tiny…use
your imagination.
Imported jpgs should be no more than 30k; Try to keep the size of your final
movie to 100k or less.
Load and unload movie commands will aid
you in linking smaller movies into larger user experiences.
Consider contrast: Interior/exterior, top/bottom.
Wet/dry, dark/light, up/down - and process: collage, creating images from
scratch, using a camera or camcorder. Hunt for ideas and images.
Student artist Statement/Alex Podesta "Pine" New
Media 1, Semester 1. I tried to explore the interior/exterior
theme of this assignment in a number of ways. The most obvious is the
dichotomy of the scenes - the first is of the exterior of a house and the
second is of the interior of the same house. Eachscene focuses on a physical
window - the first framing and then zooming in on an exterior view of the
window and the second sticking on the interior view of the window. Each
scene reinforces the window focus by using "window-like" framing elements. These "window-like" framing
elements become buttons that further explore the interior/exterior interplay
by acting as the links or doorways between scenes. To a minimal degree,
the interior/exterior theme is reinforced by the presence of differing
soundtracks for each scene. Influences for this piece are
a little difficult to talk about because they are not really all that
evident in the finished product. Aesthetically I was trying to borrow from
the same visual vocabulary used by Vincent Gallo in "Buffalo 66" -
i.e. cold exteriors, dusty interiors and extensive use of stills. Thematically
the piece grows out of the melancholy affinity that people often form
for certain periods of their past but I think this part is at best only
hinted at.
Webspace
Create
a home base/webspace/website/ for research and experimentation.
Consider this site as a sketchbook or idea warehouse. _levels
1 and 2Site contents must include an index, statement, portfolio, contact
and links pages.
Do not use flash until the page works graphically, without animation.
Examine how pages are created on other sites.
Analyze the navigation strategies. Define the site’s emotional center
using Hillman Curtis’ method presented in his book,
Flash Web Design. Experiment with bg images, rollovers, drop down menus,
named anchors, email links, image maps,
For the initial demonstration we will define a site in Dreamweaver, and
create an empty, titled, index.html page. Rename and save this page as
links.html, portfolio.html, contact.html and statement.html. Link them
together with simple text/html links so you can navigate from one to another.
I will demonstrate this in class, along with other template techniques.
The more simple sites you create, the faster you will learn, and the easier
it will be to incorporate more sophisticated techniques._all levels: Investigate
the links in my link section. Think about the the web/virtual/monitor
environment as an installation space or exhibition venue. Consider working
outside the computer monitor in installation, broadcast, audio projects.
_notes
Having
a web presence necessitates an understanding of many different technologies
and WYSIWYG programs: Macromedia and Adobe products, javascripting, actionscripting
(Flash), Browser characteristics and limitations, and platforms. This requires
constant research, experimentation. development, and application.
_popup
windows
Sooner or later you need to open an image, a movie, in
another window. Getting rid of borders, having the window appear in a particular
place, having the image or movie fit correctly in the window...these are
issues addressed by different technologies. the DHTML link below is a nice
solution, but is designed for a text link, and it takes some knowledge
and tweaking to make it work for an IMAGE MAP or THUMBNAIL image. OPEN
PICTURE WINDOW FEVER is a dreamweaver extension that works well for thumbnails.
http://www.dhtmlshock.com 1 Keep in mind this creates a text link. Clickable thumbs, image maps
will have to be tweaked
2 the correct pathname to the file is important. remember, you can change
this in dreamweaver.
_dreamweaver notes
1
The best resource to begin with is the macromedia site. There you will
find extensions, tutorials, and forums.
2. Extensions will augment the standard toolbox that came with the program.
Learning to download and use extensions will increase your productivity.
3. The new media enterprise is often one of working alone, using tutorials,
manuals, and experimentation in order to learn.
When you have a problem the best thing to do is go to an online resource,
a forum, where you can post your question. Usually, within a day or so you
will get answers from the group.
4. Information on this page will continue to expand. It is Dreamweaver specific.
Information on javascripting, xml, browsers, will be found on the notes/web
section of this site.
_text
Style sheets (CSS) provide the
most control. The cleanest generic html font I have used is geneva 1 point.
It does not blur like verdana does in some resolutions. PC does not support
geneva, and converts to arial.
_image maps
potential problem.
If you create library items using image maps, name them with unique names.
If you do not, then upon dragging them into a page, they will be confused
with image maps already on that page, resulting in image maps placed in the
wrong areas or not working. You can name image maps in the properties window.
You can name tables and layers as well to avoid confusion.
_remove
underline on links
put the following
code in between the head tags:
<style><!--
A { text-decoration:none }
//--></style>
_Change color on rollover
put the
following code in between the head tags:<STYLE type="text/css">
<!--
A:hover { color:red }
-->
</STYLE>for more on this go to: www.smartwebby.com/web_site_design _back-to-top
anchor not taking you all the way to
the top? remove the 'paragraph' format at the top and change it to 'none'
_library items
and templates
using these can save you immense amounts
of time. Learn to use them.
_define your audience
This will
affect your design decisions, connection speeds,
page sizes, browser limitations.
_define the emotional center of the site
Use
Hillman Curtis' method of defining the three most
important ideas driving your work. This allows you
to coordinate the elements and principles of design
present in your site : emphasis, unity, contrast,
movement....
2. Get a copy of the extension used to get rid
of the line created around a link that has been
clicked - my copy is called IE Link scrubber
and came with "Dreamweaver 4 Magic".
This does wonders for the look of your site.
3. Visit linkdup.com frequently
and get on their mailing list.
4. Sign up for user forums and daily mailings
on the Macromedia and Adobe webistes, for example
Dreamweaver, Flash, and Photoshop. The sooner
you overcome the technical learning curve, the
sooner you can spend your time making art. This
involves an investment in time and effort. Some
of the most noted new media artists and theorists
have worked as web designers and programmers.
The integration and understanding of design,
fine art, scripting, 3rd party software, multiple
platforms, and many other elements allows you
to communicate effectively.
5. Research typography and page layout. Experiment
with javascripting, actionscripting, and css
styles. Learn as much as you can about video,
audio, and 3d.
6. Read theory to contextualize your artwork.
Write and re-write your artist statement. This
section does not try to take the place of the
many online resources that provide tutorials
and downloads. It is a place for notes on various
things that come up during class or working with
Flash.
_flash
is used not just
for effects and animation that provides visual
interest, but for the layering of information,
as described by Edward Tufte in Envisioning
Information.
Example: Folder tabs instead of scrolling down
long html pages. Or panel scrollers. Or sliding
panels, or the text scroller you may be using
throughout this site.
What we will discuss is the application of
these technologies. Are they appropriate to
the work? Trendy eye candy or efficient navigation
aids?
_flash text
1 Use a pixal font and follow directions that
come with the font or are on the font website
(listed on the previous teaching page under
fonts) 2 if it is blurry on one side, try center
justifying the alignment, or snap to pixal/object.
Make sure there are no fractions when you select
the text and view the placement coordinates.
Sometimes however - you can break this rule
and add .5 to the placement if the 0 0 coordinates
still apppear fuzzy.3 In some instances you
make it dynamic and save the outline4 Scrolling
text fields are dynamic text. The cleanest
dynamic font is geneva 10 pt for mac. Unfortunately,
PC doesn't have geneva, so it converts to arial,
which nis less pleasing. You can also make
the scroller using a panel. See components
in the flash library.
_preloaders
When
you do incorporate flash into your web experience,
you will need a preloader to let your audience
know the loading status of the page content.
There are many recipes for preloaders. I
use two on this site, one from Flash MX magic
and one from flashcomponents.net (there
are 2 at that site: one called loader, the
other preloader). There is also one listed
in the Peachpit Press Advanced Flash bookRegardless
of which you select, be sure it utilizes
the new 'get bytes loaded' command, and not
the 'if frame loaded' command previously
in use, and now not supported. Once
you create one that works, it becomes a library
element that you can drag into the first
frame of every movie you make.instructor
note: see hypermedia_spring_2002/grodner,
jarrel, reneau for examples of student sites
