HCI Assignment 4 & 5 StudentWall

Ola,high fidelity...


UTM StudentWall

Archive contents:
1. HCI assignment 4 & 5 documentation
2. HCI assignment 4 & 5 flash file

http://www.mediafire.com/download.php?wimkem2o2ng

Here is our assignment no 3 about redesign our Student Wall of Faces using powerpoint. Still in low fidelity...

http://www.mediafire.com/download.php?bj1zmnjmthu

HCI Assignment #2

The Wall of Student Faces


We have complete our 2nd assignment for HCI and we have choose 'The wall of Student faces' as our latest task analysis assignment.


Here is the link and full report for our assignment.

http://www.mediafire.com/download.php?zyytet4mxjg



This is our re-do video prototype download link;


http://www.mediafire.com/?cuetmynjmey

Full Report: Wall of Student Faces ( StudentWall )

1.1 Task Analysis

Summary  :

In task analysis, we analyses  a user requirement 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.

We have study some systems such as social networking. Facebook, MySpace, and Friendster are example of it. These websites have system that allow its user to interact with people around the globe in live (real time), and indirectly. For example, Facebook uses chatting system, which allows users to chat in real time and post messages indirectly to other users. Universiti Teknologi Malaysia (UTM), has a system called e-learning, which allows the users to search for update occurring in the UTM society. Unfortunately, this system has some flaws.

The recent system used by UTM, e-learning, has flaw in terms of interaction between the society in UTM. To overlook this problem, we decided to create similar system as e-learning, thus improving it bit by bit. We called the system as the ‘StudentWall’.

The StudentWall system consists of;

-          Account Profiling

-          Posting, receive comments, messages, and forums.

1.      We create the system to have an interface which looks like a wall which has full of picture frames on it. Basically, each picture/image/photo holds an account for a user.

2.      So, in other words, we will have users’ image on the browser screen, align in 5x7 square boxes.

3.      We will have the user to create an account using his/her existing ACiD numbers, metric numbers, and ID numbers. After signing up the account, the user will get to manage and organize his/her profile.

4.      Then, the user will enjoy to perform some tasks/functions available in the system. We will have functions such as messaging, photo viewing, and uploading files.

5.      In the other hand, the user also get to browse other users’ accounts without limitation.

6.      If the user by chance, is using a touch screen devices, performing tasks to this system is an advantage to him/her.

1.2 Task Decomposition

                                  The aim of creating this system called StudentWall is to give assist to students and lecturers, also the academic staff to interact efficiently without encountering problems such as system failure or slow internet connection.

                                    This system are created to have a minimum and yet simple-looking page, so that it will not need to have high bandwith to load its page. Also, this system also free of unnecessary advertisements and banners.

1.3 Methods: Creation of StudentWall

                   To create the the wall of student faces called StudentWall, some steps are needed.

As we mention earlier, the motive of building this system is for student ease.

So, here we highlight the steps taken in order to realize such system;

1.      Collects all information of similar existing system, such as Friendster, MySpace, Facebook , etc.

2.      Observe the systems and take note of its advantage and disadvantages.

3.       Then, people’s views are collected, as some raw information.

4.      We relate and compare the existing systems to UTM’s e-learning website.

5.       We modified, and improved the e-learning system to carry similar traits as other social networking systems.

6.      We create the system as social networking system, but also carry its function as educational website, which give the priority to the users to interact in knowledgeable environment.

1.4 Questionnares :

Question 1: Who is going to use the system?

•      This system can is available for University Teknologi Malaysia’s students, lecturers and staff. 

Question 2: What tasks do they now perform?

•      This system allows users to create, edit, and organise their profile accounts. The interface of this system allows users to identify their accounts and other users’ accounts by clicking on the desired account image ( photos ).  

Question 3: How the system works? 

•      The task just ask the user to click on the image desired. Then it will show the profiles of the accounts.

Question 4: How the system relates with the user?

•      The system acts as a virtual space for users to interact with each other. The user can interacts directly or indirectly with other users.

Question 5: How can the user get used to the system?

It is really easy. This system is developed just similar to existing system like Facebook, Friendster, etc. So, the user will definitely get used to this system if they have experienced similar system.

Question 6: What is the improvements made to this system? 

Interface and functions. The simple-looking interface can make user feel satisfied, as we put away messy pages, background, banners, and ads. The functions also made in simple-looking style so that users will not encounter any problems using the system.

1.5 Task Flow Diagram/Chart:

            We need to understand the system step-by-step in order to performing the tasks/functions smoothly without encountering any problems.  By using the task flow diagram/chart, we will explain briefly on how the system works with the user.

1.4 Conclusion:

•      Overall, this System provide users easy and comfort to manage and organize their accounts in the StudentWall.

•      Interaction between users are improved and problems will not be encountered by the users.

Assignment 2 is in da house...

When the first time I read what's about the assignment,whoa...tough luck...but anyways,we will try our best...がんばるよ！ 

HCI Assignment #1

Download link here...
http://www.mediafire.com/?nzne22mzdtm

Zip contains:
-Analysis Report
-Experiment Video 

 HUMAN COMPUTER INTERACTION

SCV1023-01

ASSIGNMENT 1

MUHAMMAD QAYYUM BIN MOHAMAD SHUHAIMI

AC090097

ABDULLAH MUBARAK BIN AMIR HAMZAH

AC090004

ASYRAF BIN OTHMAN

AC090018

LECTURER:

DR. NOR AZMAN ISMAIL

Human Computer Interaction final report.

• What can you say about the efficiency of each system based on your tiny experiment?

Every system has its own advantages and disadvantages. We figured out that each system that is been introduced to a new user might take some time to adapt to new applications. In our experiment, we test the efficiency of three drawing applications that is Adobe Illustrator, Adobe Flash, and Microsoft Paint. The applications that we’ve tested worked efficiently and we don’t take much time to figure how these applications worked as we have the basics. It takes some time but not much to draw a simple house image.

• What worked, what didn’t work?

In comparison to these three applications, the Adobe Illustrator works best in drawing images. Although Adobe Flash has the ability the same as the Adobe Illustrator like drawing rectangles, circles and other polygons, however, the main function of it is to create animations. In Microsoft Paint, it does have basics functions same as those other two applications, but, its limitation is not being able to create precise house image. For example it’s hard to make the line straight and we cannot estimate the correct size of the windows as there is no ‘copy and paste’ function. However, the other two applications can. 

• Where were you confused, frustrated, surprised?

We were confused at the first we started use two of the software, Adobe Illustrator and Adobe Flash as we’ve never used them before. We are very familiar with the Microsoft Paint and surprisingly, the unfamiliar applications do better than Microsoft Paint. Along the experiment, there are no frustrations brought up and the experiment ends successfully.

• What did you enjoy? And, most importantly, what recommendations do you have to improve all three systems.

Most of the part, we enjoy testing the Adobe Illustrator because the main function it to draw images. When we draw a line, it calculates how long the line is and it can guide us to draw a simple house image accurately with ease. In using the Adobe Flash, it lacks the function in Adobe Illustrator, but, it also easy to use. For example, when we create a rectangle, it automatically fills the empty rectangle with colour. Just as we said, the, main function of this software is to animate objects. The MS Paint is really on the last rank because of the limitations that Microsoft offers to users. The functions are all the same that is to draw images. To improve these three applications, we recommend that developers insert an interactive tutorial just for starters so they can know a little bit of what the function does in the application.

Techniques.

To calculate the result, we monitor what we’ve done by using Techsmith Camtasia Studio 6. And then, we count the mouse clicks and the device switches when we have done recording. The video records the time that we spent to accomplish this task. We divide the task into three tries just to see how we adapt to new applications.

Application:

1.      Adobe Illustrator

	Time(s)	Device Switch	Mouse Clicks
First try	399	11	102
Second try	230	10	69
Third try	168	9	34

2.      Adobe Flash

	Time(s)	Device Switch	Mouse Clicks
First try	166	3	39
Second try	131	3	46
Third try	121	6	30

3.      Microsoft Paint

	Time(s)	Device Switch	Mouse Clicks
First try	130	3	30
Second try	106	2	35
Third try	102	2	33

The HUMAN-COMPUTER INTERACTION

The Human Computer Interaction

Firstly, we need to know the exact meaning of Human Computer Interaction [ HCI ]. 

Basically, from the subject title, it clearly shown that HCI is the ability for human to communicate and interact with computers.
HCI also can be define as the study of interaction between human ( which we can refer as the USER ), and computers.


Interaction between users and computers occurs at the user interface (or simply interface), which includes both software and hardware. 


Human-computer interaction studies a human and a machine,and because of that fact,it draws from supporting knowledge on both the machine and the human side. 
On the machine side, techniques in computer graphics, operating systems, programming languages, and development environments are relevant.


The basic goal of HCI is to improve the interaction between the users and computers by making computers more usable and receptive to the user's needs.


These are the things that HCI are concerned with ;

• methodologies and processes for designing interfaces (i.e., given a task and a class of users, design the best possible interface within given constraints, optimizing for a desired property such as learning ability or efficiency of use)
• methods for implementing interfaces (e.g. software toolkits and libraries; efficient algorithms)
• techniques for evaluating and comparing interfaces
• developing new interfaces and interaction techniques
• developing descriptive and predictive models and theories of interaction

                                       

------------------------------------------

Our Gr0up MemBer

           

Group Profiles

Name       : Asyraf Bin Othman                        Name       : Abdullah Mubarak Bin Amir Hamzah        

Matric No: AC090018                                    Matric No: AC090004

Role         : Page Editor and Moderator            Role         : Page Administrator

Name       : Muhammad Qayyum Bin Mohamad Shuhaimi

Matric No: AC090097

Role         : Page Graphic Editor