High-fidelity prototypes

High-fidelity prototypes

• Content has a more accurate look and feel to the final product
• Like an artist or designer's composition: rich in detail with all its attributes
• High-fidelity intended to create an try out the contents of a user interface, e.g. information design, visual design, interaction design
• To test the content with end users; get direct feedback, etc.
• High-cost, so used to refine the product rather than big changes
• Like an artist or designer's composition: rich in detail with all its attributes
• High-fidelity intended to create an try out the contents of a user interface, e.g. information design, visual design, interaction design
• To test the content with end users; get direct feedback, etc.
• High-cost, so used to refine the product rather than big changes

 

Monday clinic application prototype demonstration

example final prototype we use for Monday clinic application

Medium-Fidelity

Medium-Fidelity

Computer-based simulation

Medium-fidelity prototypes simulate or animate some but not all features of the intended system. There are three approaches to limit prototype functionality

example Wire-frames and Annotated story boards we use for Monday clinic application

Prototype Fidelity

Prototype Fidelity

Fidelity is the level of detail that content is rendered in the model

• Low-fidelity prototypes
• Midium-fidelity prototypes
• High-fidelity prototypes

Low-fidelity prototypes


does not look very much like the final product

    Create early representations of its content

     Akin to sketches that artist and designers create in early stages: vague and minimally           formed

     Early conceptualisations of page layouts, e.g. rough position of menu areas, banners, toolbars, and content areas

    Simple, cheap, quick to produce

    Some methods:

• Storyboarding
• Sketching
• Index cards
• Wizard of Oz

example sketches we use for Monday clinic application

Prototyping

Prototyping

The original purpose of a prototype is to allow users of the software to evaluate developers' proposals for the design of the eventual product by actually trying them out, rather than having to interpret and evaluate the design based on descriptions.

Broadly, two types of design:

• Conceptual - a concept trying to capture what the product will do and how it will behave
• Physical - concerned with the details of the design; e.g. information, screen and menu structures; icons, graphics, etc

Outline of the prototyping process

The process of prototyping involves the following steps

• Identify basic requirements

         Determine basic requirements including the input and output information desired. Details, such as security, can typically be ignored.

• Develop Initial Prototype

    The initial prototype is developed that includes only user interfaces. (See Horizontal Prototype, below)

• Review

    The customers, including end-users, examine the prototype and provide feedback on additions or changes.

• Revise and Enhance the Prototype

       Using the feedback both the specifications and the prototype can be improved. Negotiation about what is within the scope of the contract/product may be necessary.

Conceptual design

• Transform user requirements/needs into a conceptual model
• “a description of the proposed system in terms of a set of integrated ideas and concepts about what it should do, behave and look like, that will be understandable by the users in the manner intended”
• Don’t move to a solution too quickly. Iterate, iterate, iterate,
• Consider alternatives: prototyping helps

UI Patterns

The user interface, or UI, of a device is the look and feel of the on-screen menu system. How it works, its color scheme, how it responds to button presses, all of these things are part of the user interface.

Why mobile UI design is Important?

Mobile user interface (UI) technology is in the midst of its evolutionary phase. Phones and tablets that use Apple's iOS (iPhone, iPod Touch, and iPad), Google's Android archictecture, Blackberry's operating system, HP's webOS, and Windows® Phone 7 mobile operating system all offer diverse UI design approaches. 

Each Mobile vendor has their own interface UI design according to branding, Target users and budget purposes. Therefore Mobile UI patterns can be applied in different UI designs according to user requirements and vendor standards. Yet Mobile UI focus on giving a user friendly experience to the user and to enhance the navigation, accessibility and rich content in a limited space which is a challenge compared to designing UI in Software Engineering.

Mobile UI is important because it must enable users to access the same content in a smaller window with the same user satisfaction where the user must get the same look and feel as they are using a bigger screen.So Mobile UI is important and concerned with a range of features that vary from position of a single button to tapping on the screen.

Mobile UI design best practices:A pattern must be a best practice, and common enough to be recognized or encountered!

Personas

    Personas

      Like most design elements, personas can be developed iteratively. And like most design elements, there are benefits to creating the personas collaboratively. Involving the stakeholders and other team members increases the accuracy of the persona and creates a level of awareness about the users that helps the team align around them. As people become familiar with the personas, they start talking about them as if they were actual people. When that happens, you have achieved a valuable focus.

    How Many Personas?
      Most interactive products have multiple audience segments. This suggests that you should construct multiple personas. However, with too many personas, the process can get out of hand. As a rule of thumb, three or four personas are enough for most projects. If you find that you are creating more than five or six, stop and reconsider.

Establishing Requirments

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

What is Requirements Analysis?

Requirements analysis is the process of determining user expectations for a new or modified product. These features, called requirements, must be quantifiable, relevant and detailed.

Requirements analysis is taken at the early stage of development life cycle in traditional methodologies where it will take place in iterative cycles. Requirements analysis is initially taken place after feasibility study and requirements gathering to  identify and distinguish essential user requirements in order to build the development path. once the requirements are gathered , they will be analysed and organised according to following categories;

Functional

• What the system should do
• Historically the main focus of requirements activities

Non-functional

• memory size
• response time

Data

• What kinds of data need to be stored?
• How will they be stored   

Why establish requirements for a mobile app?

Establishing requirements for mobile applications is important because it helps to understand and justify user needs and also it can be related to data. 

Data Gathering.

Data Gathering is used to identify user needs, establish requirements and for evaluation purposes. Not only in mobile interface design but also in any discipline data gathering is  important as it helps to understand the the real world user needs and it helps to map real world user needs with system/ application requirements. this helps developers and designers to understand the real world user needs and to design and develop the product or services accordingly. Therefore if the data gathering was not done properly to capture user requirements in the first place, the product/service may go wrong and will not be able to satisfy the user.  there are few different techniques those can be used for data gathering.

Why do we need data gathering?

To find answers  to following questions.


Who is this system for?
What do these people want to do?
Why are they doing it?
Where and When do they will they need to do it?

But if the correct information is not captured for the above questions, the 

requirements will be inaccurate  and then it will lead to a less useful design that will result a poor user satisfaction with the final product.

Usability and user Experience

What is usability?

Usability means making products and systems easier to use, and matching them more closely to user needs and requirements.

The international standard, ISO 9241-11, provides guidance on usability and defines it as:

The extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use.

Usability is about:

• Effectiveness - can users complete tasks, achieve goals with the product, i.e. do what they want to do?
• Efficiency - how much effort do users require to do this? (Often measured in time)
• Satisfaction – what do users think about the products ease of use?
• ….which are affected by:
• The users - who is using the product? e.g. are they highly trained and experienced users, or novices?
• Their goals - what are the users trying to do with the product - does it support what they want to do with it?
• The usage situation (or 'context of use') - where and how is the product being used?

Usability should not be confused with 'functionality', however, as this is purely concerned with the functions and features of the product and has no bearing on whether users are able to use them or not. Increased functionality does not mean improved usability.

Major concepts in Mobile Interaction Design.

Interaction Design (ID)

Interaction design aims to define and facilitate interaction between human beings by means of a product or a service. It focuses on the possibilities to create and encourage behavior facilitating an exchange between people.

Interaction design is the task of enabling interaction between systems and humans to exchange  information, expressions and ideas with each other. Interaction design is the template that will enable the the input, exchange and the output of data.So Interaction Design facilitate the interaction of humans through a  product or service. 

Evolution of Mobile Technology.

In early 2000 the growth of internet was rapidly developing and use of mobile devices have increased during the last decade as mobile is more portable and accessible compared other devices. The mobile technology has gone through significant improvements such as GPS, Social networking, weather updates, access to internet at anytime from anywhere  with personalized content and customization. Therefore the growth of the usage has increased in 90% with in the decade compared to 1990's. 

Reasons why mobile devices are commonly used today.

1. Tablets and mobile devices are more user friendly with compact screen and enhanced interfaces those which are easy to navigate. .

2. Voice recognition software which a keyboard is not essential and saves time for typing text.

3. Touch-screens that brings the technology on finger tips more quick and attractive..

4. Cloud-based storage and software that avoids data loss and automatic backup to photos, documents and other personal data with personalized views.  

5. Mobile devices are only going to get more powerful with less weight and smaller size.

Therefore it is fairly predictable that mobile is the future of technology with devices that are more powerful yet compact and portable. But the smaller it becomes harder to design the interfaces as the user interfaces needs to be user friendly and easy to navigate yet attractively present the content which is one of the major arguments, whether usability or attractiveness?