Design and Prototyping (Medium-Fidelity) Contd..

Annotated Story Boards

After that we moved into the annotated story boards for more detailed mobile design patterns and for the flow of the interfaces.

Design and Prototyping (Medium-Fidelity)

After sketching the story boards and sketching the interfaces on the papers, the basic idea of the application was generated and then for more detailed mock-ups as the medium fidelity prototypes, we started working with wire frames. For generating the wire frame mock-ups, we used software called Balsamiq by balsamiq.com. Since we had not the licence for the full version, we had to try the web demo instead of having the full functionalised software. But that was very successful and a high detailed rich wire frames could be generated according to the paper sketches. 

Initial Wire frames using Balsamiq (Moday Clinic Mobile App Prototype)

These prototypes are sort of a best-of-both-worlds implementation that allows for a combination of both high-level and detailed views; rapid, iterative changes; and the ability to conduct meaningful user tests to evaluate complex functionality and to help determine system specifics.

Benifits of Medium - Fidelity Prototypes

By combining HTML, CSS, and Javascript (for web applications), we're able to relatively quickly create an interactive example system that is designed to help the client, the development team, and the visual designers better understand the requirements guiding the project. When used as part of an application development project, a prototype can:

Design and Prototyping (Low-Fidelity)

A manifestation of a design that allows stakeholders to interact with it and to explore its usability.

"Prototyping is externalizing and making concrete a design idea for the purpose of Evaluation"
                                                                                                                                      -Bill Verplank-
Prototypes are tangible representations, an attempt to realize any aspect of software content.

Prototypes can help answer questions such as:

1. will the design work properly?
2. Can the design be produced economically?
3. How will users respond to the design?
4. Which approach can be taken to get from concept to product?
5. How an prototyping support product design specification?
6. How can prototyping contribute to better product scheduling and budget planning? 

Levels of Fidelity

The level of "fidelity" of a prototype refers to how closely it resembles the final product. For simplicity's sake, we'll consider three levels of fidelity used for prototypes: Low, Medium, and High.

Low-Fidelity Prototypes have been implemented as a jumbled mass of sticky notes on an office wall; as multi-colored, cryptic scrawling on a white-board, or even as a set of BON (Back of Napkin) scribbles. They're easy to create, inexpensive to change, and are good for providing a basic "high-level view" of the overall system structure.

A low-fidelity prototype can be as simple as a sketch on paper. As an example we used in Monday Clinic Application Prototype,

Task Descriptions (Hierarchical Task Analysis)

A structured, objective approach to describing users’ performance of tasks, hierarchical task analysis originated in human factors. In its most basic form, a hierarchical task analysis provides an understanding of the tasks users need to perform to achieve certain goals. You can break down these tasks into multiple levels of sub tasks  In user experience, you can use hierarchical task analysis to describe the interactions between a user and a software system. When designing a new system, hierarchical task analysis lets you explore various possible approaches to completing the same task. When analyzing an existing system, it can help you to optimize particular interactions.

Applying Hierarchical Task Analysis to User Experience

Hierarchical task analysis requires a detailed understanding of users’ tasks. You can achieve this understanding by,

1. Identifying users’ primary goals
2. Detailing the steps users must perform to accomplish their goals
3. Optimizing these procedures

Example Hierarchical Task Analysis for ordering a book:

0.In order to borrow a book from the library 

1. go to the library 

2. find the required book

2.1 access library catalogue

2.2 access the search screen

2.3 enter search criteria

2.4 identify required book 

2.5 note location

3. go to correct shelf and retrieve book

4. take book to checkout counter

HTA Diagram

Task Descriptions (Use Cases)

What is a UML Use Case Diagram (UCD), and when to use it?

UML Use Case Diagrams can be used to describe the functionality of a system in a horizontal way. That is, rather than merely representing the details of individual features of your system, UCDs can be used to show all of its available functionality. It is important to note, though, that UCDs are fundamentally different from sequence diagrams or flow charts because they do not make any attempt to represent the order or number of times that the systems actions and sub-actions should be executed.

UCDs have only 4 major elements: 

1. The actors that the system you are describing interacts with, 
2. The system itself, the use cases,
3. Services, that the system knows how to perform,
4. The lines that represent relationships between these elements. 

Task Descriptions (Scenarios)

A scenario is a description of a person’s interaction with a system. Scenarios help focus design efforts on the user’s requirements, which are distinct from technical or business requirements. Scenarios may be related to ‘use cases’, which describe interactions at a technical level. Unlike use cases, however, scenarios can be understood by people who do not have any technical background. They are therefore suitable for use during participatory design activities.

When are scenarios appropriate?

Scenarios are appropriate whenever you need to describe a system interaction from the user’s perspective.

They are particularly useful when you need to remove focus from the technology in order to open up design possibilities, or when you need to ensure that technical or budgetary constraints do not override usability constraints without due consideration.

Scenarios can help confine complexity to the technology layer (where it belongs), and prevent it from becoming manifest within the user interface.

Task Analysis

Task analysis analyses what a user is required to do in terms of actions and/or cognitive processes to achieve a task. A detailed task analysis can be conducted to understand the current system and the information flows within it. These information flows are important to the maintenance of the existing system and must be incorporated or substituted in any new system. Task analysis makes it possible to design and allocate tasks appropriately within the new system. The functions to be included within the system and the user interface can then be accurately specified.

Key Concepts

• A user goal    = a state an end-user wishes to achieve 
• A user task    = a user activity required to bring about a goal
• A user action = physical activity (part of a task) with or without a computer

Mobile HCI 2012 Paper Review Presentation

Data Gathering

Data Collection is an important aspect of any type of research study. Inaccurate data collection can impact the results of a study and ultimately lead to invalid results.

Data collection methods for impact evaluation vary along a continuum. At the one end of this continuum are quantitative methods and at the other end of the continuum are Qualitative methods for data collection

Quantitative and Qualitative Data collection methods

The Quantitative data collection methods, rely on random sampling and structured data collection instruments that fit diverse experiences into predetermined response categories. They produce results that are easy to summarize, compare, and generalize.

Envisioning Users (User Profiles)

What is a User Profile?

A user profile is a realistic (but likely fictional) example of a target audience member. The profile commonly takes the form of a one page piece that lists the user’s name, occupation, education, demographic characteristics, computer/web experience, and site goals or likely tasks. A stock photography picture is usually used to give a face to the profile.

For a example:

Envisioning Users (Persona)

What is a persona?

Personas are a common technique used to communicate findings from user research in a simple and accessible manner. They're very useful as they can communicate this information quickly and (if done well) in a fun way that will stick with the design/development team through the rest of the process, ensuring the user research is taken into account throughout the course of the project.

There should be at least one persona to represent each major segment of your users. The word major is used as ideally you should be using 3-5 personas, and with most sites there are a lot more user groups. Each of the personas should have their own personality and be memorable - put too many in front of people and they start to all blur into one. Any more than 5 personas and people often start to feel overwhelmed.

Example :

Establishing Requirements (User Requirements)

Four basic activities in Interaction Design:

1. Identifying users, their needs and requirements
2. Developing alternative designs
3. Building versions of the designs
4. Evaluating designs

Requirement Analysis

The specification activity defines the behavior of a system in development and determines the method for requirements documentation (Natural language documents, Process models, Business definitions, Use cases, User stories or Process specifications).

Establishing what the customer requires from a software system.

ID, HCI, UCD, UX, Usability, Availability and Other Disciplines Which Sharp This Field

All of the above theories and ways of working need to be followed to produce something that is interactive for the user, easy to use, innovative and cater to as wider audience as possible. Some devices may need to be made for a specific audience, therefore you will focus a lot on USD, HCI and perhaps accessibilty. All of the concepts above are cruicial when creating interactive designs for multimedia.

Other Disciplines Which Sharp This Field

• Human factors
• Cognitive science
• Software engineering

All other disciplines listed above have helped further the field of Interactive Desgin. Such things as coginitive science allows for more users to access techonology they may never have been able to use before this. Also, it allows other users to experience techonology in different ways. This opens up a whole new area and innovation in this field and gives designers more options and more to think about when considering the UX, UCD, usability and accessibility of their product/device. The advances in software engineering help make such things as cognitive science possible.

User Experience (UX) and Usability

“User experience encompasses all aspects of the end-user’s interaction with the company, its services, and its products. The first requirement for an exemplary user experience is to meet the exact needs of the customer, without fuss or bother.”

"Usability is how easy something is to use and function. Accessibility is how varied the amount of user the device/program can cater to be it age, gender, ability, disability."

For an example scenario,

The customer, looking for a new digital camera, goes to the large electronic retailer’s website. She quickly finds the camera she wants, puts it in the cart, and without incident, pays for it using the option to pick it up at the store that same day. Quick, easy — she is pleased and excited to receive her camera.

When she arrives at the store, she initially doesn't know where to go, as no visual clues present themselves. After a ten-minute wait at the customer service desk, she’s told she’s in the wrong place and needs to find another desk, this one labeled “Online Receiving”. Once she finds that desk, the clerk, who obviously can’t wait for his shift to end, sighs and says the camera she’s purchased is out of stock. She can buy a different camera at this point, but to receive a credit for her original online purchase, she needs to call an 800 number. She ends up leaving the store without a camera and a charge on her credit card she needs to resolve.