Technological Considerations in Interface Design

Technological Considerations in Interface Design

Physical characteristics of the device and device internal software affects the screen interface design. Graphics compatibility for Screen design must be ensured with the following system components:

• System power.
• Screen size.
• Screen resolution.
• Display colors.
• Other display features.
• Development and implementation tools being used.
• System platform being used.
• Platform style guide being used.

Information Retrieval (IR): it concerns with the study of finding required data. i.e., IR helps users to notice data that matches their data desires. Technically, IR studies the organization, acquisition, distribution, storage, and retrieval of data.

Information retrieval models

An IR model directs how a document and a query are characterized and how the significance of a document to a user query is defined. Following are the main models in IR

• Boolean model
  • Each document or query in Boolean model,is treated as a “bag” of words or terms. Mathematically for a given collection of documents D, let V = {t₁, t₂, …,t_|V|} be the set of distinctive words/terms in the collection. V is called the vocabulary. A weight w_ij> 0 is associated with each term t_iof a document d_j∈D. For a term that does not appear in document d_j, w_ij= 0.

d_j= (w_1j, w_2j, …, w_|V|j),

• Query terms are combined together logically using the Boolean operators such as AND, OR and NOT.

Example : ((data AND warehousing) AND (NOT text))

• Vector space model (VSM)
  • In VSM too, Documents are treated as a “bag” of words or terms. Each document is represented as a vector. However, the term weights are no longer 0 or 1. Each term weight is computed based on some variations of called Term Frequency TF or TF-IDF scheme.
  • Term Frequency (TF) Scheme: The weight of a term t_iin document d_jis the number of times that t_iappears in d_j, denoted by f_ij. Normalization may also be applied.

,,

Here,

tf: still term frequency

idf: inverse document frequency.

n: total number of docs

df_i: the number of docs that t_i appears.

1.5.5 Popular HCI Tools

HCI Browser

This Browser (HCIB) is designed and implemented by the research team of North Carolina University. It can be downloaded fromhttp://ils.unc.edu/hcibrowser . Following are the features of HCI Browser:

• Web presenting task can be evaluated using this tool.
• designed to assist research activities in HCI through internet
• Can be added as an add-on to the Firefox browser.
• Presents operations for users working in toolbar area.
• Presents the following to the users:
  • administer pre- task questionnaires
  • administer post-task questionnaires
  • event data of searching and browsing activities.
• Saves the following events of browser:
  • Pages loaded
  • Links clicked
  • Window and tab focus changes
  • Open/close windows and tabs
  • Back/forward button clicks
  • Typed URLs
  • Scrolling
  • History/bookmarks menu
• Closes windows automatically.
• Generates a new log file for each process
• Includes the following entries for log file:
  • login time,
  • session id,
  • user id, and
  • Process id

Sketch Tools

Natural art work designers are in need of many free form software tools to express their sketching designs. Right now, existing software tools support pen and ink input to certain extent only. There is a need for intelligent software that can sketch, recognize and convert the natural sketches automatically. Following are such tools:

Inkkit

It is a toolkit used to sketch diagrams. It can be applied over a range of domains.

This software is able to run on a Tablet PC. InkKit consists of the following:

1. User Interface
   1. The user interface is supported by two main views:

1. sketch pages
   • This view supports easy drawing process.
2. portfolios.
   • Here this point displays a set of sketches. These sketches can be linked to enable relationships.

2. Recognition Engine
   1. The power of InkKitis its recognition engine
   2. To recognize a specific diagram, it creates a diagram domain and provides examples.

The sketches on this user interface design will normally be converted into both HTML and Java. It is a research tool designed for non-commercial purpose.

Freeform

Freeform tools provide a pen based interface. This tool is mainly used to design controls in the forms by hand sketching.

Requirements :Visual Basic

Features:

• Designs of user interfaces are quicker and easier than creating them with a form builder.

SketchNode

Sketchnode is a tool used to draw graphs with edges and nodes easily. This tool runs on Tablet PC. Design in this tool can be either done by pen or using drag and drop interaction. Optimization algorithms are used for transforming of not clear graph into a clearer one.

Features:

• supports both low and high fidelity graph rendering.
• Easy design process
• No convolution of images due to optimization.

Intelligent Mind Map

Humans effectively and effortlessly split between drawing and writing ink. This split is difficult to achieve in digital systems. This tool supports for the informal document on the tablet PC by recognition and ink reflow techniques.

TATool

This tool is designed to generate task representations in hierarchical manner. This research was carried out in the Patras University. The original task of this TATool is to analysis the task in interactive system design. It is recognized as a common tool to design hierarchical structures and Visualized objects This tool TATool generates output in XML form and an RTF report. This software runs only on Windows OS. It maps user-system interaction’s recorded events to the process model.

COGTool

It is one of the HCI tools used to predict total execution time for a skilled user for performing a particular sequence of actions on a system. The predictions made by CogTool are based on, a psychological theory of human cognitive and motor capabilities, called the Keystroke-Level Model (KLM). Following are the features:

• automates the application of KLM to specific problems, providing an alternative to time-consuming and expensive user testing.
• predicts what KLM can predict, that is, execution time for a skilled user of a system.

Drawbacks

It cannot predict learning time, problem-solving paths, or user satisfaction with a system.

CMTool

CMTool aims to achieve the task modelling process. Any major task can be splitted into many sub tasks by divide and conquer strategy and organising the task in hierarchical structure. This tool uses this hierarchical way along with logical operators such as AND , OR , NOT to solve the sub task. Following are its features:

• supports graphical and character notations for task representation.
• supports temporal analysis for each task
• supports relational database, grouping the various systems analyzed, with additional identification information.
• supports quantitative analysis tools for the task metrics
• provides various representations of data in the form of tree view , report view , structured view.
• automates synthesis of task structures already stored

1.6 Architecture of HCI systems

Architecture of a HCI system should describe the working procedure of cooperation between inputs and outputs.

There are two standard HCI architectures as follows:

1. Unimodal systems
2. Multimodal systems

1.6.1 Unimodal Architecture

Modality means an independent single channel. Unimodal systems are designed based on single modality. They are further classified based on the nature as follows:

• Visual
• Audio
• Sensor

1.6.1.1 Visual HCI:

Its application areas are facial expression analysis, Body movement tracking, gesture recognition and Gaze detection.

Table 1.7 – Visual HCI Research areas

1.6.1.2 Audio HCI

This uses various audio signals to acquire information. They are helpful, unique and trustable. It’s application areas are speaker recognition, musical integration, auditory emotion analysis and Human made noise or sign detections.

1.6.1.3 Sensor HCI

It uses atleast one sensor between user and computer to enable interaction. Examples of sensors are not limited to pen based interaction, joysticks, mouse-keyboard, haptic sensors, taste or smell sensors, pressure sensors and motion tracking sensors.

1.6.2 Multimodal Architecture

It combines multiple modalities. Here modalities refer to communication channels. The channels are sensors for sight ,taste , hear ,smell and touch. Gesture ,speech and gaze are common forms of input models. The examples of multimodal applications are not limited to smart video conferencing, driver monitoring, intelligent games, helping disable people and smart homes.

1.7 Advances in HCI

Ubiquitous Computing and Ambient Intelligence:

It is also known as third way of computing that is interaction among many computers and one person. The evolution is as follows:

• First way of computing – main frame era – many people one computer.
• Second way of computing – PC era – one person many computers.

1.8 Overview

The remaining part of this book includes both theoretical material and practical approaches to designing user interfaces. The topics include:

• Usability engineering principles
• Experimental and prototype cognitive architectures
• Design of effective spoken dialogue systems
• Role of recommender [e1]systems in web technologies
• Advanced visualization techniques based on ontologies
• Intelligent and adaptive HCI
• Ubiquitous computing and Ambient Intelligence.

1.9 HCI Sample Exercises

1. Application of Weber’s Law in the design of Human Interfaces

1. Weber’s Law
   1. It states that the size of the observable various is a constant proportion (K times) of the actual stimulus value.
   2. Stimulus intensity must be changed with a minimum amount to create a observable difference in sensory experience.
2. Weber’s Law to user interfaces
   1. Information in a computer can be displayed in various formats such as text, pictures, drawings, maps, graphs, videos etc. This information may be from small to large in size with respect to the following:
      1. Brightness
      2. loudness
      3. line length
      4. visual weight of fonts in typography
      5. color matching

Weber’s law helps to analyze and design the above effectively.

Procedure

Changing Shape – Rectangle Experiment

1. Design a form with the following :
   1. 6 rectangular blocks -objects with different colour
   2. a stop clock timer -to observe the time value
   3. Start button -to start the event
   4. Text box -to display the time value
   5. Reset button-to restart the experiment
2. Press “START”button.
3. Observe all blocks minutely and identify the one that expands in breadth after some time.
4. Stop timer themoment difference is identified.
5. Record time.
6. Repeat steps 2 to 5 and plot graph between’% colour difference’and’number of attempts’.
7. Repeat same experiment by pressing “RESET” button.

Changing Shape – Circle Experiment

1. Design a form with the following
   1. six circles-object with colour
   2. a stop clock timer -to observe the time value
   3. Start button -to start the event
   4. Text box -to display the value
   5. Reset button-to restart the experiment
2. Press“START”button.
3. Observe all circles minutely and identify the one that expands in radius after some time.
4. Stop timer themomentarea difference is identified.
5. Record time and the % noticed difference or the %area difference.
6. Repeat steps 2 to 5 and plot graph between’% radial difference’Vs’number of attempts’.

ChangingColor – CircleExperiment

1. Design a form with the following
   1. 6 circles-object with colour
   2. a stop clock timer -to observe the time value
   3. Start button -to start the event
   4. Text box -to display the value
   5. Reset button-to restart the experiment
2. Press“START”button.
3. Observe all circles minutely and identify the one that changes colour after some time.
4. Stop timer the moment colour difference is identified.
5. Record time and the % noticed difference or the %area difference.
6. Repeat steps 2 to 5 and plot graph between’% colour difference’Vs’number of attempts’.

Discussion

• Good user interface design can be made by avoiding uneven size or mismatching colour controls.

2. GOMS(Goals,Operators,Methods, andSelection rules)

Objective

To build a GOMSmodelforcomparing the actualtimetaken for a task by two interfaces and predict the best one.

Experimental Procedure

1. Design twodifferent user interfaces with the following controls:
   1. Label-to display users with questions
   2. Text box-to receive information about the user
   3. Button-to perform action
   4. Timer-to inform time to the user
   5. List box / option button-to display answers to the questions
2. Make Interface-1to have list-boxestoinput user responses.
3. Make Interface-2to haveradio-buttons toinput user responses.
4. Use this interfaces to rate understanding of few core subjects.
5. Press“Start”button tostartrecordtime beforeshowing responses to interface-1
6. Giveresponses for each subject using interface-1.
7. Press“Stop”buttonto stop recording of time after finishing all responses.
8. Repeatsameprocedurefromsteps 5to7forinterface-2.

Observation:

• There might be a difference in the task completion time, because of
  • Difference in interaction elementschosen andtheir layout
  • a cognitive / perceptual factor is contributing to task completion time
• An interaction task is always guided by the user goals, interface operators andalternative methods available on interface for achieving those goals.

3. Colour Design for a User Form

Objective

To apply colour theoryand features required for colour textand background legibility in creating attractiveuser form.

Basics

Primary Colours: colours that cannot be created by mixing others.

e.g. Red, yellow and blue.

Secondary Colours:colours achieved by a mixture of two primaries

e.g. Green, orange and purple

Tertiary Colours:colours achieved by a mixture of primary and

secondary hues.

e.g. Yellow-orange, red-orange, red-purple,

blue-purple, blue-green & yellow-green

Complementary Colours: colours located opposite each other on a colour wheel.

Analogous Colours:colours located close together on a colour wheel.

Procedure

1. Design a form thatconsistsoftwosections
   1. Contentwindow
   2. Colour- settingwindow
2. Design a Content Window with broad blackoutline.
   1. Split broad outline as three or more sections based on the usage withthin blackborders.
   2. Selectanyofthesesectionsbyclickingwithintheboundary.
   3. Change selection section border colour into red.
   4. Use coloursettingwindow tochange colours of the selectedsection.
3. Design a Colour settingwindow(Textcoloursetting)
   1. Place three text boxes and slider to receive RGB colour values.
   2. Design a button to apply the computed RGB colorvalue.
4. Design a Colour-settingwindow(Bakgroundcolour setting)
   1. Place three text boxes and slider to receive RGB colour values.
   2. Design a button to apply the computed RGB colourvalue.
5. Apply colour brightness difference and colour difference formulae to see if they really work in practiceimproving legibility of the colour text.

Observations:

• Allows user to apply various colours to text as well as its background andcreate differentcolourcontrasts.

Review Questions

1. How do you justify HCI as an interdisciplinary research domain?
2. Why is HCI so important?
3. Describe the framework of the three level model of HCI.
4. Summarize the factors in HCI.
5. Describe the framework of broad HCI issues and concerns.
6. Discuss on the design principles of HCI
7. Summarize advanced I/O devices

[e1]Recommender or recommended