In your small assigned groups share your user goal along with the sketches/storyboards showing ideas for interaction in your online environment. When sharing your sketches be sure to articulate the reason why you made a particular design decision.
"One important difference between interaction design patterns and architectural design patterns is the concern of interaction design patterns not only with structure and organization of elements but
also with dynamic behaviors and changes in elements in response
to user activity."
About Face 3 pg. 156
As a group begin to identify patterns in the structure and organization of the environment as well as patterns in object and user behaviors. Ask the following questions of your own work and your peers:
-are the patterns being set up visually consistent?
-are the behaviors consistent?
-do the patterns support the goal of the user?
Working with the notion of "elegant interaction design" from
the About Face 3 reading ask the following questions:
-are there any elements or behaviors that can be taken away?
-is every element and behavior necessary for the user
to meet their goal?
Showing posts with label Low-Content Wireframes. Show all posts
Showing posts with label Low-Content Wireframes. Show all posts
11.11.2009
11.04.2009
MSU CAMP: Wireframe
by Hilda Lopez
For academic purposes only.

Wireframe Final
Wireframe Rough Draft 2
Wireframe Rough Draft 1
For academic purposes only.

Wireframe Final
Wireframe Rough Draft 2
Wireframe Rough Draft 1
Douglas J Salon: Wireframe
by Jarod Lew
For academic purposes only.
Wireframe Final
Wireframe Rough Draft 2
Wireframe Rough Draft 1
For academic purposes only.
Wireframe Final
Wireframe Rough Draft 2
Wireframe Rough Draft 1
Meijer: Wireframe
by Jill Shuberg
For academic purposes only.

Wireframe Final
Wireframe Rough Draft 2
Wireframe Rough Draft 1
For academic purposes only.

Wireframe Final
Wireframe Rough Draft 2
Wireframe Rough Draft 1
11.02.2009
Project 2: Part 3: Low-Content Wireframes & Style
Project 2: Part 3: Low-stakes Wireframes & Style
Now that you have developed a user persona with a specific goal, begin to sketch how your user meets that goal in an online environment. Focus on the interactions within the environment: what the user is doing, how the system/environment responds or behaves in response to the user's actions. Annotate that these interactions along with ideas of what the content will be. These annotations must be clear enough so that one can read your wireframe notes and understand what is happening without you present. You can choose to make analog or digital wireframe sketches.
You are NOT working on what the environment "looks like" yet. These are low-content wireframes that begin to layout user paths, system behaviors, and patterns of interaction. The style and content will come in the next round of storyboards.
After you send you wireframe to me for review, you can start to think about the "look and feel" of the environment. Develop a mood/style board that gives a feeling of how your environment will be designed. Show typography, illustration and photography style as well as color palettes.
Now that you have developed a user persona with a specific goal, begin to sketch how your user meets that goal in an online environment. Focus on the interactions within the environment: what the user is doing, how the system/environment responds or behaves in response to the user's actions. Annotate that these interactions along with ideas of what the content will be. These annotations must be clear enough so that one can read your wireframe notes and understand what is happening without you present. You can choose to make analog or digital wireframe sketches.
You are NOT working on what the environment "looks like" yet. These are low-content wireframes that begin to layout user paths, system behaviors, and patterns of interaction. The style and content will come in the next round of storyboards.
After you send you wireframe to me for review, you can start to think about the "look and feel" of the environment. Develop a mood/style board that gives a feeling of how your environment will be designed. Show typography, illustration and photography style as well as color palettes.
Subscribe to:
Posts (Atom)