project 1 :: reading

we will have mostly work time during both class sessions this week. we're working toward a process crit on friday oct 9 -- a week from this friday. that should give you plenty of time to work out structural as well as visual issues. 

for friday, read "module and program" up to page 152.

project 1 :: design phase

homework for friday sept 25

alter and update solutions and wireframes based on input from critique. add detail and begin to make connections between tools/modules.

read and view tufte: "iphone interface design" and blogger Chris Fahey's response (with some excellent commenting as well).

start pondering branding-related aspects of your project: a site name, tool/function names, basic identity elements such as typefaces, graphic elements, and color choices.

in class friday sept 25
design round 1, show some sweet design!

wireframing considerations

some things to help keep your head in the right place: 

• your solutions should be directly fulfilling believable, real needs that engage and excite the audience (exerting influence, creating emotional connection, etc)
• be sure you are connecting the physical with the virtual, augmenting or extending each
• your sketches should be structurally/task based (click this, upload this), and consisting of a series of screens. only indicate basic page elements that are used to interact and complete a task. 
• the visualizations of solutions should tell you where you'll need system "components" and in which media they belong.
• put the needs and solutions in a hierarchical list and translate that to visual hierarchy in your online applications
• the components, and hierarchy will help to drive your wireframing, i.e.: bigger areas = more important elements
• while sitemapping/wireframing, consider the structural makeup of the system. for the online interface consider creating: multiple pages, a single page with interchangeable "modules/content buckets", or a mixture of both (most likely the last).
• for the handheld device, simplicity and linear navigation in the interface is important to keep in mind. (problematic with some of last years work, tiny type, too many choices on a screen, not enough visual cues to help the user)

project 1 :: first presentation expectations

for monday's (9.21) presentation I expect a summarization of everything we've done so far with a plan for the rest of the project. This should include:

• recap of activity and audience
• a basic outline of your system supported with visuals. if it's clear to us just from your description and visuals how it the system will work in general and how needs, a sense of belonging, a common symbol system and reciprocal influence are being addressed, you've probably got a good thing going. describe the technologies involved in context in this part. sketches, photos and storyboards will aid this part of the presentation.
• beginning wireframing with verbal description. i do not expect final, fully detailed wireframes of every piece of your system, just the basics. the hierarchy of needs and solutions should give you a basic outline of how to approach the wireframes. these do not need to be illustrator files either. well made, hand drawn, and photographed wireframes would work as well. give us a feel for the main areas of the online interface and the uses of handheld or other devices that are part of your system.you have 5-10 minutes for the presentation with 5-10 post pres class critique.

be concise, be interesting. PRACTICE BEFOREHAND.

this is a great warm-up for the final presentation of the projects in front of an bigger audience. the critiques should be an added brainstorming session for your system, crowd source us to improve your project!

project 1 :: inspiration assignment

Let's crowd source some more links that are Web 2.0 & real world specific, each person owes class one interesting link by next Friday. Post here.

Links from today
Yellow Arrow: http://yellowarrow.net/v3/index.php
Nike+: http://nikerunning.nike.com/nikeos/p/nikeplus/en_US/?rs=1
Sonar iPhone ruler: http://vimeo.com/6068060
Livestrong site: http://www.nike.com/nikeos/p/livestrong/en_US/
Livestrong chalk writer: http://www.youtube.com/watch?v=5Jb-KT4r6NY&feature=player_embedded
Philips food probes: http://www.youtube.com/watch?v=Au2Bueiy6MQ&feature=player_embedded#t=224
Mapping main street: http://www.mappingmainstreet.org/
check out eppelheimer's new pet

what wireframes look like

this may be a bit late, but i wanted to share a few thoughts on wireframing and how to go about this translation to the visual realm, based on michael's experience with section 1. it's a very good idea to visualize your ideas physically, together, on paper. working in illustrator will slow you down and get you bogged down in the details.

Check out some good wireframing methods here on this aptly named blog, Wireframes.

project 1 :: week of sept 14

in class monday 9.14
watch Charles Leadbeater: On Innovation

show+tell: nike, yellow arrow, others

desk crits on activity brainstorming. plot out steps/processes for those activities. begin visual translations into wireframes.

homework for friday 9.18
continue developing activities/processes/visual translations.

plot your posters.

in class friday 9.18
final plotted poster prints due.

desk crits on wireframing of activities/tools.

homework for monday 9.21
prepare a presentation of your interaction solutions (5 minute keynote presentation summarizing research, proposing solution, showing wireframes)

project 1 :: conceptual design :: moving from research to ideas & solutions

the next few class sessions will focus on translating your knowledge of the audience into online (and offline?) activities that will support and enhance their sense of community. it's important to look beyond now-generic web 2.0 functions such as photo-sharing and identify activities that connect people with people and the physical world with the virtual. consider current AND hypothetical technologies and tools for data collecting, especially as they relate to the real world. stay focused on activities and develop processes that allow that action to happen. the online tools you design should flow from those activities and processes. use the skills you've learned in previous classes to sketch out scenarios of how users will move through your system (sketching, storyboarding, diagraming) and how that system will be arranged and presented (sitemapping/wireframing).

a good way to start could be listing requirements based on need next to possible tasks/scenarios to meet those needs, i.e.:

the swimmer

need: a new workout to improve butterfly stroke:
solution: community uploads categorized workouts, swimmer searches butterfly improvement, downloads chosen workout to (waterproof!) iPhone

need: check personal stats and improvement
solution: swim goggle attachment collects speed and positioning data over time, transmitting real-time to site where it's analyzed and presented and diagrammatic data over time, allowing comparison to other members

need: workout buddy
solution: swimmer calls up iPhone app, collected user data online is read and compared to swimmer capabilities and other interested users show up on iPhone area map.

need: competition
solution: swimmer can join the competition area and sign up for "races". goggle attachment monitors position and stop and start times, allowing swimmers in 2 different places at different times to compete.

homework, due monday 9.14

• final poster refinements.
• based on the community reading, brainstorm/list what online activities might reinforce a sense of membership, allow for the reciprocal exertion of influence, fulfill their stated needs, and create a shared emotional connection. what can users do at your web space? what can users do in the real world that the online community can use to improve or offer new services?

project 1 :: week of sept 8

homework for friday 9.11
posters designed, tiled, and up in studio at the start of class
Watch another Clay Shirky video!

in class friday
watch “an Anthropological Introduction to YouTube”!
desk crits on posters in pairs, work time

research poster examples

mister eppelheimer was kind enough to put together some primo examples of last year's research posters, as well as a few other good examples of infographics. check them out here.

project 1 :: week of aug 31

in class:

• community reading discussion / review community models
• work time to continue research and brainstorming

homework:

• continue individual and community research (see deliverable specs below)
• watch clay shirkey video

friday:

• lunch lecture w/garrett @ 10:40
• poster process crit
• class out at 1:20

homework:

• continue development of posters for crit next friday
• labor day is monday -- no class.

project 1 :: visual research posters

design two posters summarizing your research -- one detailing an individual community member, and another detailing the community as a whole. 

Creation of the research posters will fuel ideas for the creation of your "system". Find out all you can about what it takes for an individual, and community, to be involved in your chosen activity. Utilize the principles learned in Information Architecture to organize, display, and connect relevant points. Design as a team so your posters fit together systematically. Don't forget design & hierarchy, these posters should be enlightening and engaging, beautiful and informative.


size: 24" x 36" vertical or horizontal as a pair

color: up to you. 

audience: designers, developers, business specialists (imagine presenting this to a hypothetical group that would be funding, programming and advertising this project)

primary considerations: how can you design this information so it will actually be read and utilized? is the content both concise and highly informative / useful?

content requirements:
"individual" poster

• a persona image
• persona text and/or images describing:
• basic demographic info such as age, education, home, employment, income, etc
• needs for successful activity involvement (may differ from community needs in this area)
• "membership" info (from the reading and/or your own model) such as boundaries, emotional safety, level of belonging and identification, symbols used, etc
• needs for community interaction: what is desired and valued by this person?

"community" poster

• visually / textually describe the following:
• images of / basic description of the community
• activity information such as physical boundaries/setting, what's/who's involved, equipment, etc (images and captions/labels)
• shared values of the group
• how influence works (provide an example)
• how shared emotional connection happens (provide examples)

optional: inclusion of your model of community (a simplified version) on the community poster. this could help visualize/organize the information listed above. 

DUE: friday sept 11

project 1 :: homework for next class

in class:

• o'reilly reading discussion
• announce teams
• teams get together & discuss activities -- present activity ideas to class by end

homework:

• community reading: psychological sense of community 
• propose your own community model with your partner, diagram the model for next class (post to your blogs)
• start research & brainstorm activity info (activity parameters such as physical boundaries, what's/who's involved, equipment, etc)
• research and brainstorm basic community info, demographics, individual and community wants and needs, motivations, etc

project 1 :: teams

here's how you'll be paired up for the duration of this project. the next step is to begin discussing options for activities that you can agree to work on together, and the communities that engage in those activities.

kyle - genia

josh - matt 

gentry - adam

nik - veronica 

amy - sheila

laura - kaufman

project 1 :: community building system

design a multimedia system for a community of individuals involved in a common activity. this system should move content fluidly across platforms/mediums to display, map and share information. define ways to facilitate interaction and sharing, finding ways to collect information from the real world to send, analyze, and visualize in the electronic world. an online area will respond to the needs of the whole community, while an iphone application will be designed with the individual user in mind.

project objectives

• understand what Web 2.0 means
• understand the differences between, and design appropriately for, both static and dynamic content
• design for a specific user group considering ethnography, age, location, etc.
• apply user research to inform both your concept and design
• apply (and expand) your technical and design knowledge from Information Architecture to complex situations
• design at both the component and system level for screen-based communications
• further develop your presentation and critique skills
• integrate linear and non-linear elements into a seamless user experience.
• understand the multiple tools & multiple technologies makeup of interactive design and explore their combination of these technologies
• design screen-based systems that rely on and respond to user input
• understand the separation of design and content that is integral to current multi-authored web content
• demonstrate understanding of user-centered, contextually appropriate navigation structures

project considerations

• consider both available and hypothetical technologies when concepting, be creative!
• almost ANY individual activity can be the basis for a community, think about it!
• your ideas and the design of your interfaces are the most important aspects of this project
• you will not be expected to program functioning prototypes of this project, static click through demos and timeline-based flash are fully acceptable
• those inclined and interested in deeper technologies like actionscripting and javascript are encouraged to develop those skills and use them for the prototyping of this project

urls and hosting

in the interests of getting the most of your multimedia experience, your future as designers, and being prepared for looming job searches, i am requiring that you purchase your very own url and get hosting for it.

as discussed in class, get domain names and hosting from different vendors, which will give you the most flexibility in the future.

here's some links for your domain name (just the url you type in; your "web address") search:
godaddy
network solutions
yahoo
dreamhost

here's some links for your hosting (servers where your actual files will reside) search:
lunarpages
surpasshosting
hostmonster
dreamhost
midphase
hostgator

Use google or check some of these comparison sites:
http://www.hosting-review.com/
http://www.upperhost.com/

don't purchase hosting yet, just research and pick a couple possible hosts. also, search for the best deal on domain names. please post the host and domain name holder you'd like to use.

bring possible url names on monday (8.31): should it be your name, something clever and design related, or something you could build a business venture on? If you have an awesome name that's available, reserve it and keep it to yourself, or a sneaky classmate might steal it.

day one info / homework

in class:
- view "the machine is us/ing us" video

homework:
- make three suggestions for two-person working teams to me via email. give a first, second, and third choice.

- list potential activities that you would be interested in studying further

- read "what is web 2.0" by tim o'reilly

FIND+SHARE

use this community space to link up projects utilizing multiple media (or technologies). of particular interest are unique navigation / interaction structures, integration of linear and non-linear elements, community-based / participatory projects, and the like.

we will try to look at these on a regular basis so everyone is nicely up-to-date with the contemporary multimedia landscape.

ABOUT THIS BLOG

1
all project descriptions, objectives, specifications and deadlines will be posted here. it is your responsibility to check regularly for important updates, new assignments and topical references.

2
i intend the blog to function as an ongoing dialog and extension beyond the classroom. If you have project-specific questions that arise outside of class please ask. everyone is welcome to reply and i will respond on/before online hours or in class.

3
required readings and discussion topics are provided to clarify and expand your knowledge of issues addressed in studio and design in general. we will discuss these either as a class or you will be asked to post responses to this blog.

4
visual & creative inspiration abounds online and i encourage you to embark upon serendipitous or purposeful surfing. once you find something share-worthy post it to "find+share".

5
occasionally i will assign an online crit in order to provide an alternative forum for classroom feedback and collaborative effort.

if those reasons aren't enough to get involved, remember, your online presence does count toward your online participation grade. i evaluate post quality and quantity, which is factored into individual project grades under the "process" and "participation" sections.