Title: Interface Programming 2
1- Interface Programming 2
- Week 14
2 Calendar
3 This Week's Agenda
- Quick lesson on how to begin your printed
portfolio assignment - We will take a look at some of last year's
portfolio entries. - Full work day
- Take advantage of today to get 1-1 in-person
feedback from me.
4 How to contact me next week
- While I am out of town, you can contact me the
following ways - If you have a technical question about your site,
please log into laulima at http//laulima.hawaii.e
du, go to the discussion board, and post your
question. I will be logging onto laulima all week
and checking the discussion. I will answer all
questions posted to the discussion board on the
discussion board so that everyone can see the
answers. - If you need for me to see your source files
(.fla's) then post your files to the laulima
server via the drop box. Consider zipping up your
files if you are loading external swf's or mp3's. - If you do not want to post your question
publicly, you can email me, but I want to
encourage you to use laulima so that we can all
learn from each other's experiences.
5 Printed portfolio assignment
- How to prepare your web site to become a
portfolio entry - Gather all of your assets
- Creative brief
- Sketches
- Site map
- Page maps
- Studies
- Save out 300dpi images of your content
- make a folder to place all of your portfolio
entry images - digitize your sketches (scan them, clean them up,
save them out as uncompressed .tiffs)? - update and save out your site map and page maps
(.tiffs)? - save out any comps that you will need (.tiffs)?
- take screenshots of your final site
6 Printed portfolio assignment
- Tips for digitizing your sketches
- clean up your sketches before scanning them
- use a thick black marker in order to get a high
contrast scan - adjust the scanner contrast settings before
scanning - scan your sketches at 300dpi
- clean them up in Photoshop
- erase dirt and unnecessary artifacts from your
scan - dont go crazy with this, they are sketches after
all - adjust your image (levels, contrast, etc.)?
- save all images as uncompressed .tifs into your
portfolio folder
7 Printed portfolio assignment
- tips for designing your portfolio layout
- design the layout for how you want to show the
progression of your designs from sketch to final - consider a diagram/flowchart/hierarchy tree
showing the full design process on one page - things to keep in mind
- what is the narrative of my portfolio entry?
- beginning, middle, end
- beginning what is the primary design problem at
hand? who is the client? what is the targeted
audience? what is your primary goal/objective for
the site? what are the major obstacles? - middle what steps did you take to try to solve
your design problem(s)? - end how did you ultimately solve/resolve all of
your design problems? - how can I best show this full design problem
solving process from concept to final design?
8 Printed portfolio assignment
- elements to consider including in your portfolio
entry - your name, the class, the date
- a project title
- brief description of the project (1 or two
paragraphs at the most - consider including your
primary goals/objectives, main design problems at
hand, and target audience)? - thumbnail sketches
- artwork/concept sketches
- thematic color studies and/or typography studies
- a diagram/flowchart/hierarchy tree that
demonstrates the full design process on one page - final images of the site, perhaps seen inside of
a browser window, or perhaps a zoomed-in close-up
or detailed view
9 Printed portfolio assignment
- typography study examples
10 Printed portfolio assignment
- color study/background color study example
DIRECTION A HOTStylistic risk level
HighColors Warm (Shades of Reds, Oranges,
Yellows, Black, Greys, and White)?
DIRECTION B COOL Stylistic risk level
MediumColors Cool (Shades of Blues, Greys, and
White)?
11(No Transcript)
12 Final Assignment
Due Week 16B
- Art 257258 Flash Web Site
- Assignment create an advanced Flash web site.
You can choose any site/client/idea that you
want, however your site must warrant the use of
Flash versus HTML. In other words, if you ask
yourself, should this be an HTML site instead?
and the answer is Yes then you should
consider another idea. - Your final site should include
- A custom preloader
- An animated intro
- Multiple pages/sections (minimum of 3)?
- Transitions between pages/sections
- SWFObject and CSS for placing/publishing your
flash into HTML - NOTE You can NOT do your own Flash portfolio
site.
13 Final Assignment
Due Week 16B
- Art 257258 Flash Web Site
- Objectives
- To apply the skills learned in both motion
graphic design and interface programming 2 into
one unified interface. - Complete the creative problem-solving process
from the preliminary planning stage and
exploration through revisions to the final
product. - Experiment by taking risks through the process of
exploration during the creative problem solving
process. - Demonstrate relevant contemporary responses to
motion graphic design and interface programming
using ActionScript, HTML, and CSS. - Analyze and apply the visual elements of line,
shape, value, color, texture, time, motion and
the design principles of balance, rhythm,
repetition, emphasis, contrast, variation, and
unity to interface design assignments. - Incorporate typography, shape and sequential
graphics/images in a time-based, interactive
interface. - Analyze the way motion is used to convey
sequential organization of information in time. - Demonstrate strong group communication skills and
the ability to speak clearly during critiques.
14 Final Assignment
Due Week 16B
- Art 257258 Flash Web Site
- Format Flash inside of an HTML page.
- Use a combination of Flash, SWFobject, HTML, and
CSS to design your site as it will appear in the
browser. - Post a link to your final site from both your Art
257 AND Art 258 class web pages!!