Thursday, January 29, 2015

Thursday, 29 January

Please sit with your group, as on Tuesday, preferably with your team in your group

Ergonomics, Affordances, Signifiers, Constraints, Don Norman, Smart Design

According to Don Norman, "Error Messages are Evil"

What's wrong with this picture?



Reiterate Project 1 Assignment 

Use of Video:




Identify next interim steps:
  1. Read the materials provided on Affordances and Constraints in the Resources section below and review your notes from class.
  2. Look, as a team, at a variety of designed situations that meet the criteria set out above. Do a preliminary analysis of your interaction with them using the affordance/constraint framework. Document these interactions in images (still and, if you wish, moving), and words). 
  3. Choose the richest example you found and analyze the affordances and constraints you find, noting how successful or not they were at supporting the intended activity. 
  4. Document your findings either by neatly annotating printed photographs by hand, scanning them on a flatbed scanner and importing them into your document or by importing your photos into a program like Adobe Photoshop or Illustrator and annotating the images digitally. You can, additionally, do a video in which you “walk through” what you found in terms of affordances and constraints through your analysis. You might also consider doing a comparative table summarizing the good and bad affordances and constraints.
Student Groups to Present Their Preliminary Work:
  • Dieter Rams - Jeremy Crawford, Sean Davis, Andrew Denta 
  • Brian Eno - Grant Muterspaugh, Sheunopa Mugobogobo, Bryant Mehay 
  • IDEO - Danielle Zigulech, Clay Wilkerson, Sarah Thompson
  • IDEO - Thomas Torbik, Ellay Williams
Tom's Blog on Affordances, Constraints, and Mapping

Meet with your team
  1. Review your examples and identify the pair of examples you are going to use to illustrate the definitions in your project
  2. Choose the subject of your case study
  3. Begin articulating, in words and images, how to explain the effectiveness of your affordances and constraints.
In-class writing assignment: list the pair of examples for your definitions and the choice of your case study, and why. note your plan of action for the next class.
Please indicate in your in-class writing if you're willing to present your interim work on Tuesday, 3 February for extra credit.
Homework for Tuesday, 3 February at 12:01 am through Oncourse Assignments:

Continue work on Project 1

Read from Universal Principles of DesignAffordances” and “Constraints” (PDFs linked to Project Brief) and UXD pp. 104 – 105 and answer the following questions:
  1. What is an “affordance”? What are the aspects of an affordance? Cite an example of an effective affordance from your own experience.
  2. What is a “constraint”? What are the aspects of a constraint? Cite an example of an effective constraint from your own experience. 
  3. What problems result from poorly designed constraints? Cite an example of a poorly designed constraint from your experience interacting with IT.

Friday, January 23, 2015

Tuesday, 27 January

Week 3: Affordances and Constraints 1/2

The SoIC Pacesetters event: “The Right Questions To Ask” program on January 27, 2015 at 7:30PM in INFO-E150.
Week 1 Terms:
User Interface (UI), User Experience (UXD), Project Life Cycle, Iteration, Reflective, “Computer Administrative Debris,” Principles of Good Design, Edward Tufte, Dieter Rams, Sir Jony Ive

Week 2 Terms:
Information Architecture, Aesthetics, Hierarchy, Icon, Symbol, Typography, Fonts (Serif and Sans Serif), Logotypes, Four principles of page layout, Massimo Vignelli

Week 3 Terms:
Ergonomics, Affordances, Signifiers, Constraints, Don Norman, Smart Design

Review Examples of Mini-Project 1 Logotypes

Discuss Reading Responses 
What is the most surprising thing you learned?
What's the most useful thing you learned? 

Attendance Policy Reiteration



Sketchnoting Resources
http://i300spring2015.blogspot.com/2015/01/sketchnoting-resources.html

Introduce Project 1: Affordances + Constraints

Case Study: Smart Design 
http://smartdesignworldwide.com/

http://smartdesignworldwide.com/


From Objectified:



Affordances/Signifiers -- Good or Bad?






Constraints -- good or bad?




Meet with your group members, exchange contact information, and engage in the following in-class activity:
Each person should choose one object you have with you, e.g. smart phone in case, backpack, clothing, and identify the intended affordances and constraints in each -- are they successful or unsuccessful. Why?
Now make a plan of action with your team for completing the project. How are you going to complete the interim assignment below as a team? (Submit a single write-up at the end of class).
Indicate in your write up if your team is willing to present your preliminary findings on Thursday. 

Homework for Thursday, 29 January:
  1. Read the materials provided on Affordances and Constraints and review your notes from class.
  2. Look, as a team, at a variety of designed situations that meet the criteria set out above. Do a preliminary analysis of your interaction with them using the affordance/constraint framework. Document these interactions in images (still and, if you wish, moving) and in words. 
  3. Choose the richest example you found and analyze the affordances and constraints you find, noting how successful or not they were at supporting the intended activity.

Sketchnoting Resources

Courtesy of and © Omar Sosa Tzec, 2015



Double-click on the link below for a PDF of Omar's complete presentation:

http://www.indiana.edu/~iucdp/i300-sketchnoting-tutorial.pdf

Thursday, January 22, 2015

Thursday, 22 January

Information Architecture, Aesthetics, Hierarchy, Icon, Symbol, Typography, Fonts (Serif and Sans Serif), Logotypes, Four principles of page layout, Massimo Vignelli


Recap of progress to date and review brief

Logotype Evolutions


Additional logotype resources:

www.justcreative.com

http://vimeo.com/113751583

http://www.logodesignlove.com/


In-class review of draft logos with your neighbor


Review formatting guide "designerly" presentations


Omar Sosa Tzec to present on Sketchnoting


Homework for Tuesday, 27 January at 12:01 am through Assignments on Oncourse:
  • Complete Mini-Project 1: Logotype Design exercise
  • Complete Reading Response 2: read UXD pp. 156 – 165 and answer the follow questions:
  1. Define what a layout is and what its purpose is.
  2. What are the primary differences between layouts in print vs. those in electronic media?
  3. What visual tool or organizing principles is commonly used in designing layouts?
  4. What is “typography” and what is its significance?

Wednesday, January 21, 2015

Follow Ups from Tuesday, 20 January class

Just a few summary points:

1. Please let me know early if there's an issue, e.g. with late delivery of your books. The earlier I know the more likely I can do something to help.

2. Please plan to arrive in class early. Now that we're beginning our project work you can use that time to ask for feedback from me and/or the mentors, and to discuss your work with your classmates. Feedback will be key to a successful project.


In terms of this first mini-project, and the subsequent ones:

1. Always read the brief carefully and critically. It's essential that you understand fully what the aims of the project are, the process to follow, and the expected outcomes.

2. Though you chose three precedent logotype in class today please continue your search -- find the best three to serve as inspiration for your own logotypes. Remember, images are not allowed in your logo for this assignment.

3. Use the tools on your word processing or page layout program (Word or InDesign most likely, respectively) and do a version of your name, as you wish it to appear, that echos the design language of your precedent -- font, style, size, spacing, etc.

4. Bring at least one iteration of your own logo to class Thursday -- preferably printed out, but at least on a digital device with a screen larger than a smart phones. We will do an in-class exercise in which you explain to your neighbor in class the precedent you chose, why you chose it, what its features are, and how you applied them in your own logotype design.


One final thing...

If you are doing a "design journal" for extra credit you must use a design journal of the type described in the syllabus. If you are using a regular spiral bound notebook with thin, lined paper that will not work. If you have a question about whether what you have works or not please ask me or one of the mentors. It's not too late to change if you need to.

Tuesday, January 20, 2015

Tuesday, 20 January


Reviewing Week 1: What is Human-Computer Interaction Design


User Interface (UI), User Experience (UXD), Project Life Cycle, Iteration, Reflective“Computer Administrative Debris,” Principles of Good Design, Edward Tufte, Dieter Rams, Sir Jony Ive Week 2: Logos, Layout, and Video


Week 2: Fonts, Layout and Video

 Tools for completing the semesters' projects
Terms:

Information Architecture, Aesthetics, Hierarchy, Icon, Symbol, Typography, Fonts (Serif and Sans Serif), Logotypes, Four principles of page layout, Massimo Vignelli

Attendance policy reiteration:



Discuss reading responses  -- what was the most surprising thing you learned?

For those whose books didn't turn up on time -- you may have an extension to noon on Friday. Submit your assignment and a copy of your book order from last week through Oncourse Assignments.

Introduce Mini-Project 1


Logos and Logotypes 

Branding is very important, especially in the tech industry -- and for individuals working in the tech industry.

Whatever your role at any one time you are an entrepreneur, a brand, yourself.
  • How do you want to present yourself? 
  • What do you want to convey?
To help us think about these issues let's review a few famous logos/logotypes:
  1. What are the "components" of each of these logos?
  2. What are they attempting to convey?









http://www.logodesignsource.com/types.html




/Users/mitchelc/Desktop/logo 2.png



In-class exercise:

With your neighbor, each of you should, in turn, choose one interesting logo from your technology, book bag or clothing, and answer the following questions (in writing):
  1. Is what you've chosen symbolic, or a logotype/wordmark, or a combination? Be specific.
  2. How would you describe the logo -- what is it trying to convey? Is it effective?
  3. What type of font(s) (serif, sans serif, other) are used?
  4. What other notable features of the logotype are there?

Helvetica trailer



Designer Profile: Massimo Vignelli



American Airlines new logo (2013)

In-class exercise search online and choose three preliminary logotype precedents for your own logotype design.
Write down your name and your Group name on your paper including your results from the two in-class writing assignments and turn the paper in at desk in the front of the room.
Questions? 

Homework for Thursday, 22 January:
  • Choose (at least) three precedent logotypes, capture them digitally
  • Generate (at least) one logotype iteration based on your own name
Note: this interim work is to be completed but is not submitted, however, if you wish for feedback you may upload your logotype design and its precedent into your Groups Box folder.