Week 10 - Yau Fen Nie

“Design is that area of human experience, skill and knowledge which is concerned with man’s ability to mould his environment to suit his material and spiritual needs.”

Design is everywhere. Design could be viewed as an activity that translates an idea into a blueprint for something useful, whether it's a car, a building, a graphic, a service or a process. The important part is the
translation of the idea, though design's ability to spark the idea in the first place shouldn't be overlooked.

Example: Designing for different culture
-Some guidelines to help with international design:
-Be careful about using images that depict hand gestures or people ( "thumb-up", "moutza", "A-OK", the "Corna")
-Use generic icon
-Choose colour that are not associated with national flags or political movements
-Ensure that the product supports different calenders, date formats and time formats.
-Ensure that the product supports different number formats, currencies, weights and measurement systems.
-Ensure that the product supports international paper sizes, envelope sizes and address format.
-Avoid integrating text in graphics as they cannot be translated easily.
-Allow for text expansion when translated from English.

Using Scenarios in Design
-Scenarios can be used to explicate existing work situation but are more commonly used for expressing proposed or imagined situations to help in conceptual design.
-Four roles of scenarios:
-A basic for the overall design
-For technical implementation
-As a means of cooperation within design teams
-As a means of cooperation accross professional boundaries i.e. in a multidisciplinary team
-Use for the notion of plus and minus of scenarios
-Attempt to capture the most possitive and the most negative consequences of a particular proposed design solution.
-Helping designers to gain a more comprehensive view of the proposal.

Using Prototype in Design

Generating storyboards from scenarios:
`A storyboard represents a sequence of actions or events that the user and the system go through to achieve a task
`A scenario is one story about how a product may be used to achieve a task.
`How?
-Break the scenario into a series of steps which focus on interaction
-Then create one scene in the storyboard for each step

Week 10 - by Tang Yook Meng

Using Prototypes in Design

Generating Storyboards from Scenarios

• A storyboard represents a sequence of actions or events that the user and the system go through to achieve a task.
• A scenario is one story about how a product may be used to achieve a task.
• By: Break the scenario into a series of steps which focus on interaction, and then create 1 scene in the storyboard for each step.

Steps in the travel organizer scenario

1. The Thompson family gathers around the organizer and enters a set of initial requirements.
2. The system’s initial suggestion is that they consider a flotilla holiday but James and Ethan aren't happy.
3. The travel organizer shows them some descriptions of the holiday written by young people.
4. The system asks for various further details.
5. The system confirms that there are places in the Mediterranean.
6. The travel organizer prints out a summary.

Designers are forces to think on:

First:

• Input/output devices
• Where the organizer will be
• Don’t have to decide but are force to think about using such as touch screen or screen
• Screen, helps to explore design decision and alternatives

Second:

• How can the interaction be design for all the family?
• Will they sit or stand?
• How confidential should be?
• What kind of documentation?

Generating card-based prototype from use cases

• Value of card-based prototype – screen or screen elements can be manipulated and moved around in order to simulate interaction
• Storyboard focusing on screen > card-based prototype / can generate directly from use case output.
• The use of case for the visa requirements using the travel organizer:

The system display options for investigating visa and vaccination requirements.

The user chooses the option to find out about visa requirements.

The system prompts user for the name of the destination country.

The user enters the country’s name.

The system checks that the country is valid.

The system prompts the user for her nationality.

The system checks the visa requirements of the entered country for a passport holder of her nationality.

The system displays the visa requirements.

The system displays the option to print out the visa requirement.

The user chooses to print the requirements.

Week 10 - by Lee Chen Yau

Physical Design : Getting Concentrate
Design is about making choices and decisions. Physical interface of interactive product should not conflict with the user's cognitive process which involved in achieving the task.

Example : Designing for different culture
Some guidelines to help with international design
- Be careful about using images that depict hand gestures or people, such as "thumbs-up", "moutza", "A-OK", the "Corna".
- Use a generic icon.
- Choose color that are not associated with national flags or political movements.
- Ensure that the products support different calendars, date formats and time formats, number formats, currencies, weights and measurement systems.
- Ensure the size of international paper, envelope sizes and address format.
- Avoid integrating text in graphics as they cannot be translated easily and allow for text expansion when translated from English.

Using Scenarios in Design
Scenarios can be used to explicate existing work situation but are more commonly used for expressing proposed or imagined situations to help in conceptual design. There are four roles for scenarios:
- A basic for the overall design
- For technical implementation
- As a means of cooperation within design teams
- As a means of cooperation across professional boundaries such as in a multidisciplinary team.

Using Prototypes in Design
Generating storyboards from scenarios:
- A storyboard  represents a sequence of actions or events that the user and the system go through to achieve a task
-  A scenario is one story about how a product may be used to achieve a task.
- How?
   * Break the scenario into a series of steps which focus on interaction
   * Then create one scene in the storyboard for each step

Tool support
- Tools to support prototyping through sketching tools, environments to support icon and menu design, widget libraries and so on.
- User interface software tools support developers by reducing the amount of code that has to be written to implement elements of the user interface such as windows, widgets, and to tie them all together.

Week 10 - by Alice Low Soo Ying

Physical Design
Design is a process about making choices and decisions. We need to made decision in using suitable design element and apply design principal that we know in the design. Design is about balance. In visual, it about the balance of the element of design. In the term of interactive, it about the balance between Environmental, User, Data, Usability requirement and Functional requirement.

Designing for a different culture
Some guidelines when designing for a different culture for international design:
• Be careful about using images that depict hand gestures or people.
   - "thumb-up", "moutza",  "A-OK", the "Corna"
• Use generic icon.
• Choose colour that are not associated with national flags or political movements.
• Ensure that the product supports different calenders, date formats and time formats.
• Ensure that the product supports different number formats, currencies, weights and measurement systems.
• Ensure that the product supports international paper sizes, envelope sizes and address format.
• Avoid integrating text in graphics as they cannot be translated easily.
• Allow for text expansion when translated from English.

Company can decide whether: produce 1 site that appeal across all cultures OR tailor to each country's website to the local culture.

example: coke vs. pepsi

Using Scenarios in Design
• Scenarios can be used to explicate existing work situation but are more commonly used for expressing proposed or imagined situations to help in conceptual design.
• 4 roles for scenarios:
  - A basis for overall design.
  - For technical implementation.
  - As a means of cooperation within design teams.
  - As a means of cooperation across professional boundaries.
• Use for the notion of plus and minus of scenarios
   - Attempt to capture the most possitive and the most negative consequences of a particular proposed design solution.
   - Helping designers to gain a more comprehensive view of the proposal.

Generating prototypes in design
Generating storyboards from scenarios:
• Steps in the travel organizer scenario
   - Focus solely on the screen
   - Focus solely in the environment
• Generating storyboards from use cases
• Generating card-based prototype from use cases
• Using prototypes in design

How to use prototypes in design
Prototyping physical design:
• Expand the cards to generate a more detailed software or paper-based pro type.
• Tool support: To support sketching tools, environments to support icon and menu design
Generate Card-based Prototype from Use Cases

References:
Lecture notes
http://en.wikipedia.org/wiki/Prototype

week 10 - Leng Cheok Kuan

Physical Design: Getting Concentrate

Design is about making choices and decisions. Physical interface of interactive product should not conflict with the user's cognitive processes involved in achieving the task. For example, to help avoid memory overload, interface should list options instead of making user remember a long list of possibilities.

Besides, lecturer had shared some guidelines to help with international design to us. We have advised to be careful about using images that depict hand gestures or people, such as "thumbs-up", "moutza", "A-OK", and the "Corna".
Other than that, we can use generic icon choose color that are not associated with national flags or political movements. We have to ensure that the products support different calendars, date formats and time formats, number formats, currencies, weights and measurement systems. We also have to ensure the size of international paper, envelope sizes and address format. As an information, we have to avoid integrating text in graphics as they cannot be translated easily and allow for text expansion when translated from English.

Company can decide whether:
produce 1 site that appeal accross all cultures OR tailor to each country's website to the local culture?

Coca- cola VS Pepsi


Scenarios can be used to explicate existing work situation but are more commonly used for expressing proposed or imagined situations to help in conceptual design.
Four roles of scenarios:
-A basic for the overall design
-For technical implementation
-As a means of cooperation within design teams
-As a means of cooperation across professional boundaries i.e. in a multidisciplinary team

In addition, use for the notion of plus and minus of scenarios, it attempt to capture the most positive and the most negative consequences of a particular proposed design solution. Besides, it is helping designers to gain a more comprehensive view of the proposal.

Using Prototype in Design
Generating storyboards from scenarios:
- A storyboard represents a sequence of actions or events that the user and the system go through to achieve a task. A scenario is one story about how a product may be used to achieve a task. But how? We have to break the scenario into a series of steps which focus on interaction, then create one scene in the storyboard for each step

week 9 - By Leng Cheok Kuan

What is a prototype? A prototype is:
-Paper- based outline of a screen / sets of screens
-Electronic 'picture'
-3 dimensional paper / cardboard mockup
-Stack of hyperlinked screen shots

Allows stakeholders to:
- Interact with an envisioned product
-Gain experience in realistic setting
-Explore imagines uses

Prototype aids when discussing ideas with stakeholders, communication device among team members and consists of effective way to test ideas. For example, clarify vague requirements, to do user testing and evaluation and check the design capability.
There are two types of prototype which is low- fidelity and high fidelity.

Low- fidelity Prototyping does not look very much like the final product. For example, uses materials that are very different from the intended final version such as paper, cardboard rather than electronic screen and metal. Besides, it tends to be simple, cheap and quick to produce to support the exploration of alternative designs and ideas. The important during conceptual design and are never intended to be kept and integrated into the final product.They are for exploration only.
Storyboard- consists of a series of sketches showing how a user might progress through a task using the product under development.

Advantages:
-Lower development cost
-Evaluate multiple design concepts
-Useful communication device
-Address screen layout issues
-Useful for identifying market requirement
-Proof-of-concept

Disadvantages:
-Limited error checking
-Poor detailed specification to code to
-Facilitator-driven
-Limited utility after requirement established
-Limited usefulness for usability tests
-Navigational and flow limitation



High Fidelity Prototype means uses material that you expect to be in the final product and produces a prototype that look more like to final outcome. For example, prototype of software system developed in Visual Basic VS paper- based mock-up. There are some issue with high-fidelity prototyping which they take too long to build, reviewers and testers tend to comment on superficial aspects rather than content, developers are reluctant to change something they have crafted for hours

Advantages:
-Complete functionality
-Fully interactive
-User Driven
-Clearly defines navigational scheme
-Use for exploration and test
-Look and feel of final product
-Serves as a living specification
-Marketing and sales tool
Disadvantages:
-More expensive to develop
-Time-consuming to create
-Inefficient for proof-of-concept designs
-Not effective for requirements gathering

Week 9 - Yau Fen Nie

Prototype

Prototyping is the process of building a model of a system. In terms of an information system, prototypes are employed to help system designers build an information system that intuitive and easy to manipulate for end users. Prototyping is an iterative process that is part of the analysis phase of the systems development life cycle. Prototype allows stakeholders to interact with an envisioned product, gain experience in realistic setting and explore imagined uses. Besides, prototype aid when discussing ideas with stakeholders, communication device among team members and consist of effective way to test ideas.

Low-fidelity and high-fidelity prototype
There are two difference of prototyping which is low-fidelity prototyping and high-fidelity prototyping. A low-fidelity prototyping is one that does not look very much like the final product. A final production designs often require extensive effort to capture high volume manufacturing detail. Such detail is generally unwarranted for prototypes as some refinement to the design is to be expected. Often prototypes are built using very limited engineering detail as compared to final production intent, which often uses statistical process controls and rigorous testing. On the other hand, the high-fidelity uses materials that you would expect to be in the final product and produces a prototype that looks much more like the final thing. A common prototyping tools which is Flash, Visual Basic and smalltalk . The uses with high-fidelity prototyping are they take too long to build, reviewers and testers tend to comment on superficial aspects rather than content. Furthermore, developers are reluctant to change something they have crafted for hours. A software prototype can set expectations to high.


The advantages of low-fidelity prototype:
- Low-fidelity representations, such as sketches, differ from the final product in interaction design, visual appearance, and level of details. The method is quick and cheap which encourage iterative design idea tryouts between usability tests.
- Quick low -fidelity tests allows designers and users to focus on high-level interaction design and information architecture, rather than on details or visual style.

The disadvantages of low-fidelity prototype:
- Users might judge a low-fidelity prototype as unprofessional.
- While low-fidelity prototypes allow spontaneous changes for exploring interactions, they also sacrifice some realism.
- Limitations in navigation flow while a control person has to "make the interaction".

The advantages of high-fidelity prototype:
- High-fidelity prototypes offer more realistic interactions than low-fidelity.
- Better at conveying the range of design possibilities.
- User-driven.

The disadvantages of high-fidelity prototype:
- High-fidelity prototyping may make designers reluctant to change designs and less likely to fully explore the design space.
- Take a long to build and requires skill.
- Reviewers and testers tend to comment on surface aspects rather than content.