2013Words:

Submitted by:Aprilia Ariesia TP025934Chairunisa Bintang TP023847Ibrahim Jamal TP027319Subject: Human Computer Interaction (CT026-3.5-2)Submitted To: Mrs. Aida Zamnah Binti Zainal AbidinHand In Date: 30th August 2013

Table of ContentsWorkload Matrix5Stage 1 User Requirements6Introduction6Data gathering6Questionnaire6Responses summary10Stakeholder analysis17Stakeholder17Potential impact on system18Risk18Stakeholder analysis Matrix18Human Factors20Cognition20Physiology20Perception21User profiling22Hierarchical Task Analysis23HTA for Current System23Refined HTA (Proposed System)25Stage 2 Usability Goals & Competitive Analysis26Introduction26Usability Goals271.Effectiveness272.Efficiency273.Learnability284.Memorability28Usability Design Principles291.Visibility292.Feedback293.Constraints294.Mapping305.Consistency306.Affordances31Competitive Analysis32Evaluation33Stage 3 Prototype and Walkthrough34Introduction34Parallel Prototyping34Peer to Peer Evaluation34Final Sketch35Shopping39Individual Part43User Requirements43Introduction43User Profiling44User Requirement Analysis45Human Factors46Data Gathering46Questionnaire47Interview48Naturalistic observation49Workshop or focus group49Studying documentation49Stakeholder Analysis50Stakeholder categories51Stakeholder analysis matrix51Hierarchical task analysis53Conclusion54Usability Goals and Competitive Analysis55Usability Goals55Competitive Analysis64Stage 3 - Prototype and Walkthrough65Introduction65Representation65Precision66Interactivity67Evolution67References72

Workload MatrixIndividual PartAprilia AriesiaChairunisa BintangIbrahim Jamal

Stage one(User Profiling)-100%-

Stage two(Design Principles, Usability Goals and Competitive Analysis)100%--

Stage three(Prototype and Walkthrough--100%

Signature

Group PartAprilia AriesiaChairunisa BintangIbrahim Jamal

Stage one(User Profiling)20%60%20%

Stage two(Design Principles, Usability Goals and Competitive Analysis)60%20%20%

Stage three(Prototype and Walkthrough20%2o%60%

Signature

Stage 1 User RequirementsIntroductionGroupon Malaysia has been selected as the company for HCI assignment. Groupon Malaysia is basically a franchise of Groupon Inc. that headquartered in Chicago, USA. In this first phase, there are following parts that consist of data gathering, stakeholder analysis, user profiling, human factors and hierarchical task analysis (HTA) that will be utilized within this company. In addition, the motive behind of implementing these following parts within this stage is carried in this assignment in order to ensure that the correct data is gathered to conduct research analysis and as an enhancement outcomes of the interface design towards the website by considering the human and computer aspects.Data gatheringQuestionnaireThe questionnaire towards the Groupon current website has been created that contains 15 questions. Those figures below show the snapshot of the questionnaire that has been created. The fundamental aimed of spreading the questionnaire is to identify the respondent overview and the satisfaction level towards the current interface design of Groupon website. Moreover, this questionnaire also aimed to discuss the popularity level of Groupon websites with online users. Thus, the questionnaire is spreading online so that user can easily fill in the form. In addition, the link of this questionnaire is available on: https://docs.google.com/forms/d/1-B15uJh2yu3o6MJrzHH8DNsrdwW2dbYV9SPbeyq9vQo/viewform

Snapshot of the Questionnaire

Figure 1.0: The introduction and profile of respondent in Groupon Questionnaire (Self-made)

Figure 2.0: Section A of Groupon Questionnaire (self-made)

Figure 3.0: Section B question number 1-3 of Groupon Questionnaire (Self-made)

Figure 4.0: Section B question number 5-6 of Groupon Questionnaire (Self-made)Responses summaryOnce the questionnaire has spread through online, the summary of responses is created based on the questionnaire that has been filled by 37 respondents. In addition, those figure below explicit the diagram of responses summary towards each questions within the questionnaire.

Figure 5.0: Summary of Age, Gender, and Occupation of Groupon Questionnaire respondents. (Self-made)As it is shown in Figure 5, 62% of the respondents are approximately between 20-30 years old and the remaining are between 10-20 years old. This summary also shows whereby Female is more attracted to Groupon website compared to male are slight below the female percentage. In addition, the student is the main domination of the respondent occupation that filled this questionnaire.

Figure 6.0: Summary of question number 1-3 in section A of Groupon questionnaire (Self-made)Relate to figure 6, it is shown that Groupon is one of the well-known company that are operated through online. Therefore, almost quarter of the respondent knows the Groupon through Internet, and followed by friend at 36% and advertisement at 17%. Figure 6 also summarizes the question number 3 that shows alignment of layout provided is not fitted with the screen of their PC, laptop, or any hardware connected to the Internet.

Figure 7.0: Summary of question number 4-5in section A of Groupon questionnaire (Self-made)Although the current Groupon website seems do not have any issues of the navigation bar operations, Figure 7 shows that most of the respondent are disagreed that current website presented by Groupon is clearly provides clear feature or content.

Figure 8.0: Summary of question number 1-2 section B of Groupon questionnaire (Self-made)Based on summary of responses that are shown in Figure 8, most of the correspondents stated the restrains is due to following reason including the long scrollbar, it is not well-organized website especially for the first-time user to look or specific categories. Figure 8 also shows the summary of respondents in terms of the suggestion to enhance the current Groupon website.Figure 9.0: Summary of question number 3-4 section B of Groupon questionnaire (self-made)Figure 9 portrays the statistic of satisfactory level towards the current system. Approximately 31% or one third of the respondents chose level 3 that is categorized as moderate. An explanation of satisfactory level chosen by respondents also has been justified in the next questions.

Figure 10.0: Summary of question number 5-6 section B of Groupon questionnaire (self-made)Figure 10 explicit the statistic of satisfactory level towards feature accessibility of the current system. More than quarter of the vote from respondents chose level 3 and 4. An explanation of satisfactory level chosen in question number 5 by respondents also has been justified in the next questions.Moreover, aside of a questionnaire, the interview has been chosen to attain more data that is necessary towards the current Groupon website. Three members of this group assignment have conducted this interview where each member has assigned to conduct an interview with either Groupon customer or non-Groupon customer. The interview topic has been chosen that discuss the issues regarding the Groupon interface as well as the performance of this website. In addition, the interviewee also provides their answer with solution as an enhancement towards the current Groupon Website. The snapshot below shows the interview form that has been taken by each interviewer.

Snapshot of interview

Figure 11.0: The first interview feedback.The first interview conducted by Chairunisa Bintang towards Arvind Kumar Reddy (a male Groupon customer).Snapshot of interview 2

Figure 12.0: The second interview feedbackThe second interview conducted by Ibrahim Jamal towards Fatma Barkey, (a female Groupon customer.)

Snapshot of interview 3

Figure 13.0: The third interview feedbackThe last interview conducted by Aprilia Ariesia towards Boronov Ilkhom, (a non-Groupon male customer).

Stakeholder analysisStakeholderThe term stakeholder refers to an actor that can be a person or an object such as an organization who has a vested interest in the natural resources towards the project. The stakeholder has the capability to influence the project operations and have something to attain or lose if the situation is unstable or remain the same (Brownen Golder and Meg Gawle, 2005). Moreover, there are several types of stakeholders that are entailed with the system implementation. Each type of stakeholder differs his or her own aim and point of view with another. For instance, some following stakeholders may concern towards the project to be succeeded, whereas the other stakeholder are having a doubt to the result of the project. Therefore, classifying stakeholder into certain groups can enable the Groupon to easily maintain the stakeholder relationship within this company as a result from constructing stakeholder analysis.Basically, stakeholder analysis consists of four following types that contain facilitator, primary stakeholder, secondary stakeholder, and tertiary stakeholder. Firstly, facilitator stakeholder is defined as the users who manage the system within an organization. Moreover, the primary user refers as the users who have a direct impact on the system because of this stakeholder are the one who is using the system. On the other hands, secondary stakeholder refers to the people who are not getting direct impact either positively or negatively of the business activities and decisions. In addition, tertiary user is having capability to affect the system within an organization. Relate to Groupon, Figure 13 shows the stakeholder analysis that has been identified within this company.Facilitator StakeholderGroupons IT team

Primary StakeholderAdministrator

Secondary StakeholderCustomer, Members

Tertiary StakeholderCompetitors such as LivingSocial, Plum District

Figure 14.0: Groupons stakeholder analysis (self-made)

Potential impact on systemEach type of stakeholder is capable to give an impact regarding about the Groupon project. Therefore, the analyst need to understand and identify the impact in each stakeholder towards the project in order to attain more benefits that able to lead the project towards success. For instance, Groupon consider each of their stakeholders that are influence them towards the huge impact of the project, and creates the solution if the expectations are not walking in the right path with the goal of Groupon.RiskDespite Groupons contained stakeholders that are assist the organization to increase the profit and efficiency, there are still a chance of the risk in due to the system fails. Therefore, Figure 14 shows the stakeholder analysis matrix that is used as the tools that map the stakeholder in order to describe each of the stakeholders position, main involvement, impact, and also the risk towards Groupon. Stakeholder analysis MatrixStakeholder Analysis Matrix towards Groupon (self-made) is placed below.

StakeholderStakeholderTypesImportance towards the systemPotential impact to the systemGroupon expectation to stakeholderRiskStakeholder management strategy

IT teamFacilitatorEntails with maintaining the systemHighMonitor the system operationsLacks in recovering the system failsEntails in designing and implementation phase to understand the whole elements n the system

Groupon CustomerSecondaryEntails with the result of the systemHighSatisfied with the new interface designDo not really concern of the new designEntails in providing a suggestion for designing the new user interface

AdminPrimaryEntails with using the systemMediumParticipation in designing phase Lack of capability to operate with new changes resulting inefficiencyEntails in training methods to accommodate new changes

Competitors: Living socialTertiaryPresent huge impacts to the organizationHighGood recognitionProvides better interface and operationsInvolved in discovering the issues that being arise within Groupon

Human Factors Cognition One of the aimed of cognition is to make the user easily remember the website. In order to attract the attention of their customer, this proposed website will be constructed with the aim of reducing the complexity. The unorganized content that being a problem in current website will be redesigned. For instance, designing the proper content and layout that fits with screen and also do not show too much information unless the costumer click Read more for further details. Therefore, this may reduce the customer dissatisfaction and also reduce the confusion within the website.Moreover, another goal of this proposed website is to enable the user to easily recognize the website. Thus the interface is created as simple as possible with the enhanced feature of the operations. For instance, the search engine will be implemented in home page for the customer who wants to filter their preference based on the price, popularity, and the latest deal.The slideshow will be utilized in this proposed website as a solution that enable the user do not scroll the webpage too much. One of the slide shows will contain 3-5 pictures due to the bandwidth usage efficiency only able to hold this data. The risk of the website that use too much picture will resulting the bandwidth slow that makes the website is slow to respond.Physiology Due to the Groupon is one of the companies that utilizing web-based interface, the user need to be able operating with hardware that connected to the Internet such as a computer, and laptop. Nevertheless, most of the online users may feel fatigue if they surf in the Internet too much. Therefore, to make sure that proper setting is suitable with online user, there are following applications that are not harmed to the user health that created to assist user to operate the computer easily.Categorized as one of vision tools, Zoom text magnifier may be one of the best software which is an enhanced screen magnification program that able to enlarge the objects within computer or laptop monitor, yet maintain the feature of the website to fit in every device that the user are using. Therefore, this application can be a solution towards current Groupon website that provides unclear layout whereby one of the side bar is too long compared to other features that requires the customer to scroll down most of the times.Aside of camera picture, and zoom in and zoom out feature, this software is also contained visible pointer that roles as a particular locator to assist user to follow and manage the mouse pointer during the movement on the monitor.PerceptionLast but not least, perception is the other human factor that is aimed for the user to easily realize the content. In a simple word, as a website using the interface as a front-end to communicate with customers, the design of the interface is essential to attract their preference. The website also requires to directing to another link accurately. Moreover, the navigation bar that provides to the user need to be seen easily within the page by holding a record of history where the user have been surfing within the website and the current position of the user. For instance, when the customer has been surfing from previous page into the current page, the navigation bar that placed within the page need to show the different color compared to other pages for the customer to easily realize that they are in one of the pages provided in the website.

User profilingThe user within the website consists of admin, customer, and also IT team. Once they are registered in Groupon, the user able to edit their details that will be automatically saved in Groupon database. For instance, customer changes their phone number details.Relate to Groupon, it is designed to attract potential customer to visit their website, thus the users should be given by the webpages. The navigational tools also will be placed in the same design as other webpages. Moreover, the Groupon logo within the website is required to redirect the link to the homepage so that the user reduce any confusion in a certain page. The website should also provided the security platform to secure the transaction that occurs in the website such as SSL.Towards the expert user, the preference of this user is more into feature available within the website. The layout of the website are fit with the screen, the content is presented clearly, and the application structure should enable them to discover enhanced features. For instance, the user can check the calendar that are associated with the deals period of Groupon, GPS or Google Map to easily show the place of the deals, slideshow, language preference, and many more. These enhancement feature will be implemented by Groupon as a second choice due to many user still decide to remain with old feature interface.Scenario for the proposed system:1. Register form2. Login Form 3. 3. Purchased procedureSince the current Groupon website do not provide a homepage, the proposed project will be created a home page. Within the homepage, the users are able to choose their preference. For those user who are not currently register as a Groupon customer, they can click the Register button that placed in top-right of the website. After the sign up process has been succeed, the users are able to adding content details about themselves. In addition, after customer filled the registration form, Groupon will send email verification to the customer email.Once the customer has registered as a Groupon member, they can continue to log in to the website by providing their username and password as the authentication process. Once the log in and password are corrects with the database, customer are now enable to check the deals as well as edit their details. By registering as member of Groupon, the customer will receive an email from Groupon regarding the promotion or latest deal.Whenever a customer desires to purchase an item or even an offer, the buyer is then required to approve the payment by verifying through the code given. The code can be found in the provided e-mail address of the current buyer, which is then filled in the space where the verification code is asked for. This stage is to verify and avoid any purchase that is not viable.Hierarchical Task AnalysisHTA for Current SystemLog In Process

Registration Process

Purchase Process

Refined HTA (Proposed System)Log In Process

Registration Process

Purchase Process

Stage 2 Usability Goals & Competitive AnalysisIntroductionIn stage 2, the designers or in some cases, the developers will then try to figure out the concepts or possibly metaphors that are necessary to be implemented in the proposed website of Groupon Malaysia, regarding the concerns of the Human Computer Interface (HCI). In terms of determining the concepts, there are three main areas that should be taken into consideration when it comes to implementing a successful website, these three categories are known to be usability goals itself, design principles and last but not least, competitive analysis; all known to enhance the website of Groupon Malaysia in terms of user requirements.In the first area which is the usability goals, we have implemented about 4 components of usability goals which are known to be effectiveness, efficiency, learnability and memorability. There components are being imposed in order to enhance the back-end system for the users and to succeed in developing a superior usability for users, when compared to the current website.The second area talks about the design principles in which all 6 principles are being implemented in the proposed website of Groupon Malaysia. The 6 principles are known to be visibility, feedback, constraints, mapping, consistency and affordances.Other than the first two stages, the third and last stage is to analyse competitors of Groupon Malaysia. This is done in order to gather and research about the strengths and weaknesses of its competitors. Once the research has been done, a discussion and conclusion of each competitors interface design shall be compared with each other.

Usability GoalsThese days, usability goals happen to be one of the most important factors that are needed to be considered and carefully implemented in developing a website. In order to provide a proper Groupon Malaysia website, there will be 4 components instrumented in the proposed website design of Groupon Malaysia.1. Effectiveness: Effectiveness is the most deliberate part of a website interface which is necessary in the design of Groupon Malaysia. The proposed website of Groupon Malaysia is designed to make sure that the website is able to provide tasks and functions that has the ability to accomplish whatever it is supposed to do. Since Groupon Malaysia is an e-business company that provides offers from several retailers and even sells the product straight from their own offers (which has been negotiated with the retailer itself). Therefore, the proposed website of Groupon Malaysia is to ensure that users would have an easy access in purchasing and inheriting information from the website itself due to the enhanced interface of the website.2. Efficiency: In order to make the website as efficient as it can be, the designers have decided to discard any irrelevant information for users. Since the website of Groupon Malaysia is only available for members to view items, there wont be a difference of pages between members and non-members since non-registered members do have access to the website. During the process of signing up, the user is only asked for payment and personal details in order to proceed with exploring the offer that is valid from Groupon Malaysia. There wont be a need of filling out any surveys or questionnaires since it is considered to be a hassle for new users who are just about to use the website.Aside from the registration process, we have also implemented a home page for users to view all categories of offers in one page or even sorted out in chosen ways. The home page is to allow users to have an easy access to whichever offers they are looking for and in need of the home page includes a navigation bar where users are allowed to go through all the pages with one click, making it efficient for users to navigate through the proposed website.

3. Learnability: In order to successfully implement learnability in the proposed website, it is recommended to make the website as simple and elegant as possible, including necessary information and hiding such redundant ones. The reason for making the website simple is to avoid the user finding the website a challenge to navigate through. Other than that, the payment process is highly secured since the user has already provided such necessary information for payment. When a user decides to purchase an item of a coupon, the user only needs to type-in information which may serve as a verification code and the purchase would be successful, without the need to refill the information all over again. These functions of the proposed website make it possible for all target markets to be able to use the website without any further issues.4. Memorability: Memorability has been implemented in the proposed website in order to make it easier for users to visit again and remember where and how to navigate through the website with a sleek and elegant interface. As to maintain an elegant yet modest interface, the proposed website of Groupon Malaysia has the same format between all pages, except the all deals page and the homepage since it may consists of various sections in relation to the company. Providing the same format for pages such as getaways, dining and shopping would allow the user to predict the location of specific information where it is needed, making it possible to dodge the complexity of the website.

Usability Design PrinciplesThe current website of Groupon Malaysia is entirely unorganized due to the fact that there is random information posted below and on the right hand of the interface. Many current users are unsatisfied with the interface of the website, according to the questionnaires and interviews done in the stage of user requirements. Hence, the researchers and developers have decided to implement design principles in the proposed website of Groupon Malaysia which are of 6 varieties.1. Visibility: In the condition of giving a good interface design for the proposed website, the developers would add a homepage where the user can have access to all the linked pages within the website of Groupon Malaysia. In the home page, there will be a navigation bar which will enable users to jump from one page to another without having the opportunity to go back in order to have access to another page. Also, the navigation bar will be available in a different colour than the background colour of the website in order to make is possible for users to spot the navigation bar.

Figure 16.0: Navigation bar of proposed Groupon Malaysia Website (Self-made).

2. Feedback: In order to provide a successful feedback within the Groupon Malaysia website, a change of colour will be placed whenever a button has been clicked in order for the users to be aware if the task is in process or not. If the users has not clicked the button or tab well, the colour of the tab would not have a fading effect since it provides a knowledge that the task is not in progress. Other than that, for the links which are able to be clicked on, there will be an effect such as the change of cursor into a hand with its index finger at a point in order for users to be aware that such text are linked with another page.

Figure 17.0: Navigation bar showing the user the current page (Self-made)3. Constraints: In this proposed website, developers provide constraints when it comes to registration and payment process. The purpose of doing so is to avoid irrelevant accounts and also, Groupon Malaysia does not support the idea of a user having 2 accounts; one email address is valid to have only one account in order to avoid any inconvenience and unnecessary accounts held within the database. On the other hand, the payment process also consists of constraints in terms of payment. Whenever a user wishes to register the payment information such as credit card number, card holders name and several more, there are restrictions in verifying the specified payment information. For example, if a user has given invalid Username or password, the website will check in for verification and will deny if the account does not exist of such.

Figure 18.0: Out of an invalid username entered by a User (Self-made)

4. Mapping: In the proposed website of Groupon Malaysia, the navigation bar has been placed on top and the similar offers are right beside each other. These are the only available functions which has a relationship with other links held within the website. The navigation bar will be placed on the top middle of the interface and each tab is located beside each other in order to avoid any confusion. Also, the similar offers are available more on the bottom part of the website in which they are also beside each other since the current website has issues mainly on the navigation of the similar offers. This would possibly encourage the user to visit the website more due to its convenience.

5. Consistency: In the proposed website of Groupon Malaysia, the appliance of consistency only exists in the category of external consistency. In the appliance of external consistency within the proposed website, only two icons which are links to their social network. These icons are the popular icons of facebook and twitter, both applied at the footer of the website.

Figure 19.0: external consistency of Facebook Inc. and Twitter Inc. (Self-made).

6. Affordances: In appliance of affordances, a slideshow of the latest deals will be placed in the home page in order for users to be updated of the deals in Groupon Malaysia. This slideshow will be located in the middle of the home page for users to be able to verify the value of a slideshow. There is an option or previous and next button for users to be able to view the offers that are either on the previous or next slide. We made the symbols recognizable by all users since it is used worldwide.

Competitive AnalysisA competitive analysis between the competitors of Groupon Malaysia shall be displayed below. These three competitors are known to be JetSetter, LivingSocial and Dealshelve.

Strengths- Simple without any complications- Functions are well arranged.- Simple interface yet attractive.

Strengths- Attractive design in interface.- Images to describe the offers- Good selection of color - A balance of text and images.Strengths- All information visible.

Weaknesses- Lack of suitability in colour combination.- Lack of functionalities provided.Weakness- Less information provided regarding the offersWeakness- Too many irrelevant information- Text is small (readable but not convenient)- Poor colour combination.- Mapping is implemented poorly.

Usability Issues- NoneUsability Issues- Category of deals are not availableUsability Issues- Irrelevant information on home page.

Table 1.0: Competitive Analysis of Groupon Malaysia (Self-made).

EvaluationBased on the implementation and analysis in stage 2, it is found that the developers should design the website as simple as it can be with the possibility of making necessary information visible to the users. This would make users feel comfortable while using the website since they wont be facing any complicated procedures within the website. Aside from making the interface simple, the tabs and buttons should be placed on the same location as it was with the home page in order to avoid confusion with the other pages linked within the website.Moreover, the fonts used in the website should be in the appropriate size where it is visible to users but also, not so big due to the result of unorganized platform. In doing so, it is important to use the same font style in all pages in order to implement recognition for the users of the website. The colour combination should also be considered since it defines the style of the entire website, whether it be elegant, bright or dull. In fact, adding in multimedia contexts such as slideshows or videos would indeed attract that customers even more since it makes the website have a glow to it.Alongside, the proposed website of Groupon Malaysia has encountered all the principles and usability goals and has been implemented well on the pages that are needed, allowing the site of Groupon Malaysia to satisfy the usability of users while using the website.

Stage 3 Prototype and WalkthroughIntroductionGroupon Malaysia was our chosen website for HCI assignment and we conduct three main types to develop better website to Groupon Malaysia (www.groupon.com.my) by using Parallel Prototyping, Peer to Peer Evaluation and Final Sketch by using the method story board. These are methods help us to develop a website that is more useful and take attention of visitors of Groupon Malaysia with the sample and developed website.Parallel Prototyping In this section, each of team members is contributing three scenario of storyboard that will be used for creating Groupon Malaysia website: How to view deals and products easier. How to see the price and details of products that added to cart. How to view Groupon with Slideshow and more organized.Please refer to appendix to see the sketches.

Peer to Peer EvaluationAfter the parallel design that created by every team members, peer to peer evaluation is needed to find out the most effective design as a final sketch. Below table is the result of peer to peer evaluation:Evaluator: Ibrahim JamalFactorsFatema HabibAprilia AriesiaChairunisa Bintang

Interface DesignThe interface is simple and gives attention.Each page has the same interesting interface.The designs of each page look interesting.

ConsistencyStory-board that created is understandable.Storyboards that created are consistent.Storyboards that created are consistent and reliable.

EfficiencyDesign of website is efficient.Overall storyboards are effective for user.Each page of storyboard are efficient for users

Learn abilityInterface with HCI is able to learn.It is easy to attract more users to use the system.Number of step is reduced so learn ability is easy

Final Sketch The conclusion of each design has its own advantages and disadvantages so team members decide to draw the final sketches based on the design principles and usability goals. The final sketch shown in the appendix is a result of the combination of different design elements. Final Homepage 112364589101413121115

7

Section Explanation

1 (Logo)The Logo presents GROUPON company and we just took it and implemented on our website to show the same logo that present Groupon brand.

2 (Select City)To give users options to select their area in Malaysia to view the nearest products and deals to their city.

3 (Home)In home page, users or customers can see the hottest deals and product in Groupon Malaysia.

4 (Dining)Dining page is basically about food and restaurant around Malaysia.

5 (Shopping)Shopping page contain a lot of shopping places and offers that provided for customers.

6 (Gateway)Customers can easily see the deals for travelling and vacations in this page.

7 (All Deals)Customers can view varies of deals.

8 (Login)Shows users how to login or register on Groupon Malaysia as a member.

9 (Slideshow)Shows customers all the newest and hottest products and deal on Groupon Malaysia.

10 (buy now)Shows customers details about the deals or product shown on the slide show with the price to buy it if they would like.

11 (Popularity)List of the most popular products and promotions to customers.

12 (price)List of products and deals according to the price of the products.

13 (Latest Deals)List of latest deals in Groupon Malaysia.

14 (Recent Promotions)Shows customers what is the recent promotion in the Market.

15 (Follow Us)Shows the Footer part of the website to customers and the linked to Groupon in Facebook and Tweeter.

Interactive System DesignHome page

Figure 20.0: Homepage

Figure 20.0 shows Home page of our Groupon Malaysia and we decided to design the interface as sample as useful to get more attention from Groupon customers to increase the visitors of Groupon Malaysia as well increase the selling for all the products and deals on Groupon Malaysia. The Home Page contains a slideshow that shows customers the hottest deals on Groupon Malaysia. Moreover, the purpose of sort of Popularity, Sort by Price, Latest Deals and Recent Promotions is to send customers easy to each page as required.

Dining

Figure 21.0: DiningFigure 21.0 Shows Dining page is a page has all products and deals about food and restaurant to provide a wide choice for Groupon Malaysia customers. Besides that, Dining Page contains many promotions and deals.

Shopping

Figure 23.0: ShoppingFigure 23.0 shows the Shopping Page of Groupon Malaysia to show customers all products and shops around the selected area in Malaysia to give customers much option about shopping specially Clothing.

GetawayFigure 24.0: GetawayFigure 24.0 shows the Getaway Page which contains much option on the interface such as Buy Now to sell the chosen product to customer choice. Also it has wide screen slideshow to show all the hot deals in market around Malaysia.

All Deals

Figure 25.0: All DealsFigure 25.0 shows All Deals Page which contains different deals and promotions around Malaysia to give customer wide opportunity to see different deals on Groupon.

LoginFigure 26.0: Login Page (Self-made).Figure 26.0 shows the login Page that contain all the information that not member needs to input to be a member on Group on Malaysia.

Individual PartUser RequirementsIntroductionFounded by Bias and Mayhew (2005), Usability Engineering Life Cycle (UEL) has been established as an essence to construct the usability test plan. In a simple word, if the analyst can associate the UEL with the product development cycle in the earlier, it will give the analyst a huge beneficial in terms of their analysis and testing regimen that will be able to assist them to attain the data required and present the project with the proper usability design, analysis, as well as testing of the project. As it is shown in Figure 1, they have created Usability Engineering Life Cycle that consists of following stages including requirement analysis, design, testing and development, and many more. As a first stage, Requirement analysis is created in order to build the user uniqueness,capable to verify what the user necessitate, create the aims and objectives that used for usability study that includes user profiling, stakeholder analysis, hierarchical task analysis, data gathering, human factors and many more.

Figure 1, Usability Engineering Life Cycle (Bias and Mayhew, 2005)

User ProfilingUser profile is well known in corporations as a technique that delivering data or information based on the analysis regarding the user uniqueness. In order to build a system, system user needs to be pinpointed in the beginning. Once, system user has been classified, users uniqueness data needs to be attained as it will be used in designing the phase system. Based on Kuniavsky (2003) philosophy, he stated that user profile is nearly equivalent with a persona, which is a type of a fictitious person as a collection of attributes such as goals, attitudes, work, age, and skills. In a simple terms, user profiling of group segmentation consists of important data regarding their uniqueness such as mental, physical characteristic and demographic area in association to the system. Recently, World Wide Web Consortium (W3C, 2004) has focused on physical characteristic user that refers to handicap by providing instruction as their direction in order to assessing accessibility. For instance, perceivable content, and also voice enabled application are same samples of the accessibility that capable the blind people at a particular in order to understand regarding the content of the website.Moreover, user profilings aim and objectives have been set to assist system designers to gain the necessary data that they attained in order to understand their real user through creating a report regarding the real users attributes such as their age, gender, mind-set, educational background, and utilize it within the development process. Moreover, one of the examples regarding the real users attribute is shown in Figure 2. AgeOlder people made more mistakes and having low capability to interact with the system

GenderThe distinction of the gender could lead to some specific design features within the website, such as colour pick used in the system

CulturalFocused on how to integrate and adapt the cultural diversity within the GUI design

Figure 2, Real users attribute example (self-made)User Requirement AnalysisWithin user-centred system design, user requirement analysis is designed to evaluate the potential user towards the system by the user attributes. As a result of this analysis, the system developer will be having verification towards the system whether it is categorized as a user-friendly system that can be able to increase user satisfaction. Nevertheless, the software developer is necessitated to chose the proper technique in order to make sure the process are on the right path. For example, there are several components that can be utilized in order to describe the phase of the analysis structure that comprises of:Information gathering: One of the following methods that are created to collect the data that has been gathered from the user towards the current system that is being operated.User needs identification: Once the issues within current system are identified, the proposed solution will be created that describe the user desired and expectations towards the new enhancement.Envisioning and evaluation: is a method that involves with constructing a prototype for the proposed system main functionality and performance based on the suggestion that has been received from the user. Moreover, this process will remains as long as the user who provides the suggestion regarding the issue that has been encountered is increased.Requirements specification: Placed in the final phase, this phase has entailed with maintaining the changes that are needed before the proposed system is developed completely.

Human FactorsHuman factors refer as the scientific discipline focused on the interpretations towards the interaction among humans and the computerized system in terms of the application of theories, rules and principles, and any other techniques of design that suits with the system necessity and human benefits (Rice.edu, 2008). The fundamental considerations of human factors within HCI are physiology, cognition, and perception that able to affect the communication between computers and the user.Firstly, the system user is contained either individual or group of users from an organization assigning to accomplish the task given within the input of the system. In here, the programmer of the project is required to identify the skill and the lacks of the user during the designing the system interface phase.Moreover, within the cognition phase, the programmers will be required to adjust the content of the interface into the simplest interface in order for the system user to easy to remember, and have a high attention towards the interface of the system. In a simple word, the programmer is required to design the interface that system user can easily understand by using the methods of interface that can capture system user memory to operate the functionality of the system. Data GatheringData gathering is aimed to be a method that utilized in order to enhance the clear objectives and gather the general view of certain research area. In a simple word, data gathering is used in order to gather the necessary, proper, and relevant data that will be used to form a solution of the problem that is being addressed. Data gathering has following types that consist of: Interview Questionnaires, Workshop or focus group, Naturalistic observation, and Studying documentation. Nevertheless, the proper data gathering types need to be chosen properly by the researcher in order to attain data accurately. In addition, each of the data gathering types will be clearly explained clearly below.

QuestionnaireAs one of data gathering types, a questionnaire can be structured or even unstructured. Based on Malcolm J. Conway (2006), Questionnaire is defined as an internal research tool and is one means of eliciting the thoughts, feelings, beliefs, experiences, and attitudes of a sample group of individuals. In depth, a questionnaire that will be presented in either written form is used to gather the necessary data for further analysis of particular research that are consist of preplanned set of questions intended to certain group of people. Once data has been gathered, the final result of the data that has been gathered will determine the result through conducting an analysis. Basically, a questionnaire has following characteristics that are shown in Figure 3.

Figure 3, Questionnaire characteristic ( James.P, 1997) The length of time that respondents will be taken to understand and answer each of the questions that contains in a questionnaire need to be considered, due to the respondents might not be able to answer the questions or the respondents do not have much time to answer resulting the questionnaire data might not be filled accurately.As it mentioned earlier, the questionnaire is contained of the following preplanned questions including multiple choice, and Likert scale. Basically, Likert scale is used within questionnaire due to following reasons including the respondent that need to measure the level of agreement or disagreement level towards the statements given. For instance, Figure 4 shows the example of a Likert scale questions within the questionnaire.

Figure 4, Example of Likert scale Questions (Cvent.com, 2013)InterviewInterview is the primary method to collect the data during the conversation through face to face meeting. In every interview session, there must be one primary interviewer and also one primary interviewee (Martin E. Modell, 2007). There are several types of interview that consists of:Topical Interview : The main discussion of this interview is related to the facts and the event that has been passed intended to the interviewee to share their opinions towards the discussion. For instance, during the Football match, the supporters from both of the teams will be asked regarding the performance of the match after the match has finished.Conversational interview: Also known as flexible interview, this type of interview questions is not organized. In a simple word, every interviewee will be having different questions given by the interviewer. However, the first question will be given the same to all the interviewees to make sure that questions flow is on the right path towards to the aim and objectives of the research. This interview also allows the interviewer to ask the interviewee to provide unscripted feedback in order to elucidate the meaning of questions as required. For instance, Figure 5 shows the example of conversational interview.Interviewer: What marketing books do you like the most to read?Interviewee: I dont read marketing books.Interviewer: Is there any other book from another genre that you like the most to read?

Figure 5, the Example of conversational interview(self-made)Telephone interview: is conducting an interview through the phone by the interviewer to the particular interviewee to ask and record the answer from the interviewee.Naturalistic observationThere are two types of observation that consists of naturalistic observation and laboratory observation. Also known as field observation, naturalistic observation is one of the methods to do a research in order to attain the data required that entails with observing the subjects in their own habitat. (Saumag.edu,2007).The aimed of naturalistic observation is to identify the behaviours in a certain habitat and tend to ignore the lab research that might change the real subjects behaviour. In addition, one of the main benefits by having naturalistic observation is enabled to construct the external validity of the research finding. In a simple word, by having this observation the analyst will be able to refer the result from their observation which is derived from general population that provides the accuracy and prevent ay data manipulation.Workshop or focus groupFocus group is a form of qualitative data collection that refers as a group discussion that contains six to twelve persons who discuss he similar characteristic or main interests.In every focus group, there will be one facilitator that leads the group based on a predetermined set of topics. The facilitator also manages the discussion atmosphere that encourages the participants to discuss regarding their opinion and perceptions. One of the main by conducting a focus group is receiving the information for a certain topic that may be hard to collect by other data gathering methods.Studying documentationAlso one of the data gathering methods that is beneficial for getting the back-end information towards the step that need to be taken and rules for a certain topic.

Stakeholder AnalysisAccording to Kammi Schmeer (2013) is process of systematically gathering and examining qualitative data to decide on whose interest that will be selected into account when enhancing or constructing a policy or system. In a simple word, stakeholder analysis examine each level of interest of the stakeholder that are entailed with the project in order to measure certain limit of each stakeholder intervention within the object. Thus, stakeholder main role is to help in terms of decision-making that make sure each of stakeholder are doing their own rule in the right path. In addition, Figure 6 shows the phase that will be taken in stakeholder analysis.

Figure 6, Eight major steps in stakeholder analysis (Eestum.eu, 2013)To summarize the steps taken within stakeholder analysis, there will be examining the certain stakeholder groups that are entailed with the decision-making of the project and also the sub-groups by defining the influence that stakeholder. For instance, examine the stakeholder through the rank that has the biggest influence towards the project will be one of the following methods to group the stakeholders.After the previous phase has been done, the next phase will conclude the importance of the most influential stakeholder such as the highest position that need to be considered before the analyst separate them into several groups. Moreover, the next step will be creating strategies towards their participation within the project. In this step, if some of the exist stakeholders that are unwilling to be entails within the new stakeholder analysis is having the high chance to be dismissed.Stakeholder categoriesThere are several types of stakeholder that will be involved within every project in an organization that consists of:Primary stakeholder: is referring to those people that assigned by using the system. The primary stakeholder role is receiving the direct impact of the operations and business activities. For instance, employee or staff within an organization.Secondary stakeholders: Distinct from primary stakeholder, secondary stakeholder is a group of people who are not getting direct impact either positively or negatively of the business activities and decisions. For instance, customer can be classified in this stakeholder due to their involvement is not required to the entire aspects of the project.Tertiary stakeholder: refers to the stakeholder that do not have any contribution to the project but capable to present huge impacts towards the result of the organization within an adverse reaction, that are also known as competitors.Facilitating stakeholder: acts as the facilitator whereby a group of person who are maintaining the system within an organization. IT department staff can be one of the examples of this stakeholder since they are the person in charge of maintaining the system within the organizations.Stakeholder analysis matrixStakeholder analysis matrices is one of the main techniques that are designed to map the stakeholder in order to describe each of the stakeholders rank of their position, main involvement and, impact within the project. Moreover, Figure 7 shows the example of stakeholder analysis matrix.

Figure 7, Stakeholder analysis matrices (Monkibo.com, 2009)As it shown in Figure 7, the boxes A,B,C,D are the stakeholder within a project. The implications of each box is concludes below:Box A: is the stakeholder that has high level of priority of the project as well as huge impact towards the succeeding project. The organization needs to maintain the good relationship with this stakeholder in order to make sure the supports given by this stakeholder able to encourage the project to be succeeded. Senior officials can be one of the following examples of this box.Box B: Also categorized s high importance towards the progress of the project to be succeeded but with low influence. This means that they might necessitate particular initiatives if their interest are to be secured. One of the example of this stakeholder can be youth, or even seniors who might be beneficial of the proposed project, but have the least participation within development level.Box C: is the stakeholder who has power of the huge influence within the project, who can easily affect the result of the project, but whose interest are not necessarily aligned with the aims of the project. Box D: is in the lowest priority within the project as well as having least impact compared to others stakeholder towards the system.Thus, stakeholder analysis matrix is able to present the well-defined explanation to the analyst to understand each stakeholder contained in the project, resulting the solution on how to maintain the good relationship towards all of them.

Hierarchical task analysisBased on David Embrey (2000) philosophy, Hierarchical Task Analysis (HTA) is a systematic method that express on how task in organized in order to achieve the objective of a job. HTA entails with examining a top down fashion the overall objectives towards the task, and then break into several sub-tasks and condition under that they need to assign in order to accomplish the aims as it shown in Figure 8.

Figure 8, the examples of HTA (Uu.edu, 2002)To summarize the step towards constructing the HTA that shown in Figure 8, there will be certain phases that need to follow including HTA starts their analysis by creating the overall goals that the person must be accomplished. Once the overall goals have been identified, it will expand into the sub-operations and continued with the plan specifying when they are assigned. The plan roles as the fundamental elements of HTA because of it expresses the information sources in which the employees are assigned to do, in order to signal the necessity for several activities. Every sub-operation within HTA is allowed to be expanded further depending on the tasks and plans that will be given to the analyst. In concludes, one of the main advantages of HTA is enabling the analyst to concentrate on the main points of the task in which can have an impact on plant safety. In depth, By the method of expanding the task into more specific as well as plan for the operation, it resulting the analyst able to easier in terms of maintaining the consistency of every operation.ConclusionIn this report, the user requirement has been clearly discussed. Since user profiling requires certain important information, data gathering methods have been assigned to collect the essential information. Stakeholder analysis also required for every project in order to understand the relations and also the impact that may affecting the project either directly or indirectly. In addition, HTA steps also have been discussed in this assignment for the analyst before doing the operations. Therefore, these elements are able to satisfy user requirements by presenting higher quality of the project as well as fulfilling the user requirements.

Usability Goals and Competitive AnalysisEach and every designer wishes to design a premium interface that is to be respected by their colleagues and impersonated by competitors. But in order to derive such attention, not only does it require motivation but it also takes more than ostentatious advertising. It can also be accomplished by making the use of quality features such as usability goals and design principles. These can be achieved by attentive planning, compassion in users needs and thorough testing. Usability GoalsBefore developing any kind of software or device that is to be evaluated in the market for its launch, it must be evaluated in order to avoid technical failures and it also has to concentrate on the usability principles. Usability evaluation allows the developer or designer to decide whether the product is competent enough for the users satisfactory (Comp 2030, 2012). This is to make sure that the project has reached the level of expectancy and also to reach the goal of the system; such a goal is known to be Usability goals and sometimes usability criteria when it comes to measurements. Basically, the goals are able to be sorted out but shall not reduce to numerical measurements (Faulkner,2000). It is also said that the goals are derivative from the users that have been using the product or even experimenting with it (Kindborg,1999).

Figure: A short comic of Dilbert about Usability Goals. (Janahrend, 2012).

ComponentsSince the abstract terminology of Usability goals can be complicated, there are solutions in making the process less complex. The solution to a trouble-free access is to make use of the main components of Usability goals (Karlsson, 2002). These components may vary of effectiveness, efficiency and safety, utility, learning ability and memorability.1. Effectiveness: This is the most deliberate part since it refers to the objective itself. It is that part of being concerned and aware of whether the system or application should be doing what it is supposed to in order for users to accept the usage. Effectiveness is keenly calculated by test metrics as well as architecture and semiotics (Affordable Usability, 2011).2. Efficiency: Aside from effectiveness, it should also be efficient since users tend to manage their time. Efficiency is to confirm that the user has the ability to utilize and be productive with the system. It is to measure how well the system works on what it is supposed to do (Affordable Usability, 2011). 3. Safety: The reason for even considering safety is to shun all possible errors that can occur while the system is in use. In order to solve these issues, the developer can provide options for recovery in errors such as undo and etc.4. Utility: Utility is to have adequate functionality to contain a range of users tasks in order for them to perform on average. This is usually done by taking essential steps that would determine the users anticipation while using the system (Affordable Usability, 2011). 5. Learnability: learnability is to help the user have an easy access in using the system. Also, the system should be user friendly to certify that the user does not have to consume time in order to learn the functions of the system or software. This step is highly important because some users are not able to find the information they wanted which may lead to the effectiveness of the system. Therefore, it is necessary for learnability to be covered up in order to ensure that users would be able to easily outsource information needed and this would increase the chances of users visiting (Affordable Usability, 2011). This component is calculated by user-research metrics.6. Memorability: this goal is to confirm how easy it is for the user to remember the functions once it has been learned. This can be done by assigning menus and other navigation options. After the user has earned an experience with the system, the aim is to make sure that users would be able to remember where to find information or how it works (Affordable Usability, 2011). If users are able to identify the functions and catch up with the system, it is most likely that users may use the system more frequently. This component is calculated through the basic user-research methods.PrioritizationManagers who concentrate on user-interface merit first selects skilled designers and then organize schedules that comprises time for strategic preparation and attentive testing. The designers commence by decisive user requirements, engendering multiple design options, and carries out extensive assessments. Contemporary user-interface-building tools then allow implementers to rapidly build systems for auxiliary testing. A successful designer goes ahead of hazy ideas when it comes to user friendliness; more than making checklists of subjective guideline. They have a systematic understanding of various communities of users and the errands that must be accomplished (Mifsud, 2011). They revise evidence-based guidelines and hunt the research journalism when needed. Professional designers are intensely committed to allocate the user, which reinforces their resolution when they go through thorny choices, time pressures and fixed budgets.When managers and designers have completed their jobs successfully, their valuable interfaces produce affirmative thoughts of achievement, capability, and mastery in the community. The users have an obvious cerebral model of the interface that permits them to predict what will happen in retort to their actions with poise. In preeminent cases, the interface almost vanishes, allowing users to ponder on their work, discovery, or pleasure (Miffurd, 2011). This kind of soothing environment gives users the mood that they are in the flow of working at their peak, while achieving their goals.

Figure: A designer watching a video of usability testing. (Eatpaintstudio, 2012).

User Experience GoalsWhile usability goals are to enhance the usage of the device, user experience goals are to enhance the users experience with the device or system. User Experience Goals are not really necessary for a developer to employ but it is rather an opportunity to be employed. It also helps the developer to decide whether the system or product has reached its effectiveness and efficiency, whether it is prepared of not (Schrag, 2008). Once the goals has been checked and achieved, there is a higher chance that the users experience would be pleasant. However, it is not easy to be measured. Such may include:1. Satisfying: In order for the system to be more productive for users.2. Motivating: To avoid users from the feeling of giving up.3. Enjoyable: In the process, no frustration should be encountered4. Aesthetically pleasing: Interesting enough for the users to use.5. Fun: For users to feel excited about using the system.6. Supportive of creativity: Design and tools of the system.7. Entertaining: Entertain the users by making the system look attractive.8. Rewarding: There should be a sense of productivity.9. Helpful: Have features in order for the user to not feel lost and insecure while in use.10. Emotionally fulfilling: In order for the user to experience several emotions by using the applications available in the system.Usability Design PrinciplesSince design is often overlooked or misunderstood by designers, some of them (designers or developers) often believe as long as the interface is acceptable and fashionable towards the viewers, it is going to be highly accepted and sufficient for the society. Without being aware, graphical design and composition is what designers and developers usually concentrate on in order to make the project severely attractive and eye-catching. But in fact, does not realize the importance and significance of the visual layout of a project since it determines and basically directs where a user can actually take information that is necessary and relevant. This makes the visual layout much more pertinent compared to the graphical design (Gutierrez, 2013). Overall, a move towards achieving usability goals is to have an easy-to-learn design of the system or even concentrate of the visual layout itself. A well planned interface is understandable and controllable which assist users in completing their tasks without any interference or disapproval; resulting to the relevance of the Usability Design Principles (MTU, 2013).The principles of Usability Design shall be explained below:1. Visibility: Visibility is considered to be a major point when it comes to designing a website or a system. The main goal for a user to view projects is to get something done, either it be a task or just to gather information regarding certain objectives to be completed. In order to provide a superior level of visibility to the user, it is recommended that the functions provided in the system should be based on the users aspect where the users are able to find and recognize the functions where it is applied. In other words, Visibility is successfully sited if the controls are placed in a highly visible location (UCTI, Undated).

This would make it possible for users to easily gather and grasp the necessary information needed in the system, or even to get their tasks done easily if needed; since it is what they visited the website or system for. A triumphant visible interface is to be aware of the international or common understanding of objects that is known to several users (Norman, 1988).

Figure: EZ Toilet flushes (Optionsil, 2013 & Nigel, 2009).The figure above is an EZ toilet flush where it indicates that the toilet flush should be pushed on by the users foot. Since some of the users are aware of the fact that flushes are always located on the top, most of them would not be aware that the tiny object on the floor is a flush. Hence, visibility in this form has not been imposed well.

2. Feedback: Feedback is basically a design principle where it allows users to be updated and aware of what the system or website is in process of. It is also known as a stipulation that informs the user when an action has been demanded or called for. In order to successfully apply a good feedback into the system, it is encouraged for the function to create an action such as a push down effect in order for the user to be aware when an action is in the process or not. Aside from effects, it can also be done by sending a result to the user, informing what certain action and results has been accomplished (Norman, 1988).

Figure: A switch on/off button (Chowdhury, 2013).The figure above is a switch on/ off button without an indication where it is in process or not, whenever the user clicks on the button. This is a sample of a very bad feedback since it doesnt tell the user if the button has been clicked on or not. The solution will be imposed on the figure below, with proper feedback.

Figure: A switch on/off button with proper feedback imposed (Chowdhury, 2013).

3. Constraints: This design principle basically describes and determines the restrictions of interactions within the user and the system or even a website. This principle is applied and often useful in terms of misusing the functions available within the system. The design principle of constraints is divided into three parts known to be Physical, Logical and Cultural (UCTI, Undated) making it possible for all types of functions to have certain types of constraints that are suitable for each. Details aside, the main objective of applying constraints is to avoid users in making errors while using the system.

a) Physical Constraints: Physical constraints are basically concentrated on the term how? In this case, the constraints are suitable with objects which can easily be used in a way that is not suitable as the proper usage such as using the backside instead of the front side. Overall, Physical constraints concentrate on how the function should be applied.b) Logical Constraints: Logical constraints are usually imposed on the term what? In this case, the constraints are applied with objects that can be misplaced into other parts where it isnt supposed to be such as the use of plugging an HDMI and an HADI cable. The slots of these cables can easily be undertaken for and might even be placed in the opposite slots.c) Cultural Constraints: Cultural constraints are typically rigorous with the usage in terms of what? and also learned conventions since it refers to several other countries of even places with different cultures. One might be mistaken for the other since cultures and traditions are not precisely similar when it comes to comparison between the worlds.

Figure: A sample of constraints in entering an e-mail address (Salicetti, 2013).4. Mapping: This design principle is based on the relationship between two or more functions, which are known to be controls and movements in this case (Norman, 1988). Mapping allows the user to identify the relationship between items and also enables the user to predict the results and usage of the function. In order to successfully place a defined mapping area, it is recommended that the designer arrange such functions in relation to how the results are going to be, making the user accustomed to the location of the functions. Without the use of mapping, users may have a possibility growing into frustration while using the system making it impossible for the user to enjoy and use for the second time, or even restricted to due to the unsatisfactory level.

Figure: A sample of improper mapping in terms of keyboard (ally0528, 2013).The figure above is a sample of improper mapping in terms of keyboard navigation. The upper and lower case are beside each other but the left and right case seems to be found nowhere near. This proves the fact that the navigation of the keyboard is in poor application of mapping. The figure below would show the proper mapping of keyboard navigation.

Figure: Proper implementation of keyboard navigation (Wi-tribe, 2013).5. Consistency: In terms of this design principle, the aim is to allow users to have shortcuts by having icons which are familiar to almost all users of technology. Aside from icons, it is also available by having double clicks of even two keys being pushes after one another. In terms of avoiding an unsuccessful application of consistency, shun all icons or shortcuts that are not familiar by users. There are two basic types of consistency; both are known to be in terms of Internal and External Consistency.a) Internal Consistency: This type of consistency refers to the designing operations to act the same way as it is involved within the application only.b) External Consistency: This type of consistency refers to the designing operations to act the same way not only when it is involved within the application but also among other applications as well.

Figure: a sample of internal consistency in the application of MS Word. (Self-made).6. Affordances: Affordances is the last in design principles but it does not make it the least important. This design principle talks about the properties that functions have and based on the properties, how it can be used in such proper way as it has been designed for. This specific type of principle is aimed to enable users to clearly understand what are the functions for and why are they designed in such a way. It is highly recommended to design the system in a way that it is able to provide users hints of how it is to be used.

Figure: A sample of a sign with no consideration of any affordances. (Belarus, 2012).Competitive AnalysisCompetitive analysis is a procedure where companies go through in order to inherit information about the performance status and marketing strategy of the products or brands that are in competition with, within the marketplace. In terms of implementing an effective plan in the strategic way of marketing, companies should be aware of the competitive environment around the marketplace and also, information about the selected companies that they are competing with such as the prices, products, quality, service and several more in order to be able to accurately determine the strengths and weaknesses of the competitors. The use of determining the strengths and weakness is to be able to gain advantage of their barriers held within the competitors market. There are several steps to be considered in order to generate a competitive analysis. These steps are to be provided below.1. Identify Competition: The first step is to identify the companies that are in competition with your product. This is done by gathering the customers viewpoint and to group the results (companies considered to be competitors) according to the price.2. Grouping Competitors: The second step is to group the competitors according to the strategies that they are using, this is done in order to identify what is it that actually motivates the customers to purchase their products.3. Examination of Competitors: This step allows the process of analyzing the marketing strategies of the competitors and also to identify the advantages and disadvantages of the companies. This step gives an opportunity to take down the competitors as its vulnerable state.4. Comparison of Competitors: this step supports the comparison of every competitor that is faced as a threat to the current company. This is done by listing down the features of every product or service that is available from each competitor. These steps are to be taken while analyzing the competitors in order to help determine where would the product fit and be a success in the overall marketplace.

Stage 3 - Prototype and WalkthroughIntroductionAs a definition of Prototype is a not finished or simple working model of a product or a system to provide a review how the product or system will look and behave. On the other hand, producer will have feedback from customer to fix bug and take advantage of what customers need to build a successful and useful product. Prototype contains four elements such as type of prototyping, participatory prototyping, parallel design and peer to peer evaluation. Each one of these element consists definition, example and how we implemented to our topic GroupOn Malaysia (www.groupon.com.my).1. Type of PrototypingType of prototype conducts several types that helps designer to build a great Prototype because of some characteristics such as support creativity to help developer to capture and generate ideas. Also it encourages communication to help designers and users to discuss options and interact with each other. Therefore, there are four main types of Prototyping. RepresentationPrototype as Representation is a term defined as drawing the website before design it on the PC by sketching it on paper or sketching it on computer using specific programs. Both ways are useful because they help the designer in different ways. Firstly, Off-line prototype (Paper prototypes) this type is used by several ways such as Paper sketches, illustrated story-boards, Cardboard mock-ups and videos. Story-board required using in our HCI assignment. We had been using this method to build a new prototype website for Groupon Malaysia. The main advantage of using Offline prototype is that they created quickly and usually it done in the early stages of designing the Website. Second type of prototyping is on-line Prototype (Software prototypes) these prototypes done by computer. They include some types such as computer animations, programs written with scripting language, interactive video presentations and applications developed with interface builders. The disadvantages of using are higher cost than Off-line prototypes and also might require skilled to implement advanced interaction because it does with programs. This is why we had been used story board which is off-line prototype to our GroupOn Website.

There are some advantages and disadvantages of storyboarding:Advantages: Does not require programming skills Provides a quick way to sketch design ideas Complements verbal scenarios easy to meet early stage design feedback from usersDisadvantages: Not practical for detailed design Interaction between the storyboard and a user is limited. Some of the project team members are difficult to draw the sketch by hands.

In conclusion, Representation has two different types of prototypes Off-line and On-line to help designer sketch website before starting with development stage to understand and see in reality how the website will look like. PrecisionPrecision is a type of Prototyping that help designers to show users about the system or website being built. This type of Prototyping provides description such as the user opens the file or the system displays the results. However, it does not give information about what the users of the system will do. Besides that, Precision forces designers to show the interaction of the Website or system to show users how does the user open the file and what are the specific results that will appear on the screen. Among the developing period, the level of Precision usually increases to build a successful Website and more details are set during the development time. Moreover, Precision is harder to be use in On-line Prototype than Off-line Prototype because on off-line prototype needs less skilled and less experience than On-line. An example of Precision is to create a detailed animation that shows feedback from specific action by users. This is how we implemented to our prototype Groupon Malaysia by presented our website to our lecturer an classes mate and shown them the facilities and new interface to Groupon Malaysia.

InteractivityInteractivity is a type of Prototyping and it is an important characteristic of HCI systems because of interactive. However, is it too difficult to design an effective interaction? This is why there are many interactive Websites have a good Look but a poor Feel. Moreover, interaction has very tight quality linked to the end users and understanding of their work practices. Besides that, there is a critical role for an interactive website is to illustrate how the users will be interacting with the website. This role may seem more natural with On-line Prototypes. In fact, it is usually easier to explore different interaction strategy with Off-line Prototypes. An example of Interactive prototyping is to make a series of paper screen images in which one person acts as the user and the other plays the system. EvolutionPrototypes have different life distances depended on purpose of the work. Firstly, Rapid Prototypes are usually created for specific purpose with short period of time and then thrown away. Besides that, Rapid Prototypes are important in the early stages of designing a website and they must be cheap and easy to produce since the goal is to quickly to discover and then thrown away. For Rapid Prototypes it may be off-line or On-line as long as it gives the purpose of creating Rapid Prototype.Secondly, Iterative Prototypes are usually designed later on during development time to give a reflection of a design in progress, it helps designer to reach the goal of designing website through several design iterations however, it is difficult for Iterative to support evolution because usually there is tension between evolving toward the final solution and exploring an unexpected design direction because it may be thrown away completely. There are some advantages of using Iterative Prototypes such as informing some aspect of the design, some Iterative explore different variation of the same theme of the website, and increasing the precision by working out the finer details of the interaction. Finally, Evolutionary Prototypes they are thee stage of Prototyping and they are a special type of Iterative Prototypes because it evolves into part or all of the final system or website. According to Extreme Programming (Beck, 2000), advocates this approach, tightly coupling design and implementation and building the system through constant evolution of its components. Besides that, Evolutionary Prototypes needs more practice and planning than the other Evolution types because it is a representation of the final Website. We had been using this method among our friends to see their feedback about Groupon.com.my and it helped us to developed friendly use website fit among the adult generation to be more useful website.2. Participatory PrototypingParticipatory Prototyping or Cooperative is a design that involves user in all stages of developing this Prototype to call the user at the end to evaluate the website. in this Prototype users are treated as a partner for the Website to help developer avoiding unnecessary paths or bottoms on website and develop a website that solves problems and provides the most friendly interface according to users satisfied. Allowing users feedback on every process of the development will build successful website. A common difficulty of Participatory Prototype is the huge responsibility of satisfied the users because some problems are impossible to solve that required from users. There are some stage should be follow by developer to avoid any difficulties by using this type of Prototype: Cooperating: Participatory design stresses the issue of cooperation within system development projects. Cooperation stresses two fundamental principles, principle which assumes that all stake-holders within a design process are just positioned more like beginners in others and the co-working principle which assumes that a design process is learning process for both computer systems developers and users. Experimenting: The importance of experimentation is an effort to take seriously the idea for design process whether in new possibilities condition or current conditions. Experimentations purpose is to ensure the current work practice is desirable or realizable. In order to facilitate the creation of qualitative new uses and applications, participatory design makes use of exploration in general based on various possible technologies. Contextualizing: Participants have a variety of backgrounds with partly overlapping and partly conflicting interests and concerns. Participatory design need to deal with this variety of interests for the example is the various groups may have different ideas of how the future work might be supported. Participatory design is particularly concerned with the way how the designers consider the outcome of creating something new. Iterating: The future product draws from the point of view and the future instrument of work. Designers co-operate with each other by using objects as a basis for allocating work. There is a focus on throughout the process like early prototype of system.In this stage, the end-users (stakeholders) are asked to participate in the development of the prototype. Usability goals, user requirements, design principles and human factors are the part of this task.3. Parallel DesignParallel design is a project model for usability engineering where multiple designers independently of each other design suggested user interface. These interfaces are then merged to unified design that can be further refined through additional iterative design (Nielsen, 1993). In sample words is a design for human uses and it conducts multiple designers to provide a very useful interface by group team work. There are some advantages and disadvantages of using Parallel design to develop a website. Firstly, by using parallel the final design would be very professional and great because it has multiple designers with different skilled and experience. On the other hand, Parallel design is the most expensive type of Prototypes; this is why it cannot be implementing to all projects.

Figure1: Sign in form(Adapted from: Nielsen, 1993)According to Figure 1 it shows how Parallel design and iterative are based on a version 0 concept, which describes how the interface look and what it is supposed to do for the system.On Figure 1 it also shows how each merged design element can be the best of Parallel versions because the merging designer can also introduce new elements to the design.Moreover, a weakness of Parallel design is waste of resource when many designers do the same project. This is because of the huge information will be Spread on the table of work which will lead to have different opinion and much argument between the designers. This is why its not advice to publish the parallel design versions. However it is the fastest way as I mentioned before for very large and complicated systems, because it less the time spending for developing a website or system. 2. Peer to Peer EvaluationPeer to peer is the evaluation of creative work of performance by other people in the same field in order to maintain or enhance the quality of the work or performance in that field (linfo, 2005). In sample words, Peer to Peer Evaluation is a several questions written on a piece of sheet or typed by computer to a track it a group of people usually the users of the system to see and have returned answer and find out the weaknesses and errors in the performance and this will enable developer to develop excellent system or website. a simple Peer to Peer Evaluation is in Software department, peer review is sometimes used in code development where a team of members will have a meeting and check through code line by line to look for errors. The main goal of Peer to Peer evaluation is to provide suggestions for improvements. Peer to Peer Evaluation mad a big movement when it applied on internet and people started to publish soft copy online format. This is because of several reasons such as it will be widely available for larger number of different groups of people and also its a cheaper way than write it on paper and publish it hard copy.

Brainstorming is an example of peer to peer evaluation. With this method, group members generate alternative ideas or solution for a specific topic. Compare to quality of ideas, quantity and creativity ideas is the important part of brainstorming. After the group members generate the ideas, they grouped into categories. A list of ideas or solutions that related to a particular problem is the outcomes of brainstormingThis following picture is an example of peer to peer evaluation

ReferencesAffairs, A. 2013. Develop a Project Plan | Usability.gov. [online] Available at: http://www.usability.gov/how-to-and-tools/methods/develop-plan.html [Accessed: 29 Aug 2013].Affordableusability.com. 2011. Usability Goals: Learnability. [online] Available at: http://www.affordableusability.com/usability/learnability.html [Accessed: 29 Aug 2013].Blackandgold.com.pk. 2012. wi-tribe AVenger. [online] Available at: http://blackandgold.com.pk/drop/vXi9-p1/ [Accessed: 29 Aug 2013].Chowdhury, R. 2012. 40 CSS3 Button Tutorials For Designers. [online] Available at: http://www.hongkiat.com/blog/css3-button-tutorials/ [Accessed: 29 Aug 2013].Christensen, M. 2010. Usability Goals 101. [e-book] Sweden: Kaeru. Available through: Kaeru http://www.kaeru.se/entry_13.php [Accessed: 29 Aug 2013].Csl.mtu.edu. 2013. HCI Lecture 7 - Usability and Suite Consistency. [online] Available at: http://www.csl.mtu.edu/cs5760/www/Lectures/CurrentLectures/Usability%20and%20Suite%20Consistency.htm [Accessed: 29 Aug 2013].Davidgoodwin.net. 2005. Dave's Gallery :: BELARUS :: DSCF1565. [online] Available at: http://www.davidgoodwin.net/myphotos/album30/DSCF1565 [Accessed: 29 Aug 2013].Emily. 1981. Conversion Optimization is just a click away - Eat Paint Studio. [online] Available at: http://eatpaintstudio.com/2012/06/conversion-optimization-just-clicks-away/ [Accessed: 29 Aug 2013].Globalonlinemarketingconsulting.com. 2013. Peek Over The Shoulder Of Competitors With Our Competitive Analysis. [online] Available at: http://www.globalonlinemarketingconsulting.com/consulting-services/competitive-analysis/ [Accessed: 29 Aug 2013].Golder, B. and Gawle, M. 2005. Stakeholder Analysis. [online] Available at: www.panda.org/standards/1_1_stakeholder_analysis/ [Accessed: 25 July 2013].It.asciicasts.com. 2013. ASCIIcasts - Episode 193 - Modelli non persistenti. [online] Available at: http://it.asciicasts.com/episodes/193-modelli-non-persistenti [Accessed: 29 Aug 2013].Janahrend.com. 1999. People Use Products to be Productive | Jan Ahrend. [online] Available at: http://janahrend.com/blog/people-use-products-to-be-productive/ [Accessed: 29 Aug 2013].Karlsson, M. 2002. Turning Usability Goals into Measurable Objectives. [e-book] Sweden: Linkopings University. pp. 1 - 20. Available through: Kaeru http://www.kaeru.se/LiTH-IDA-Ex-Ing-02-25.pdf [Accessed: 29 Aug 2013].Lin, I. n.d. Human Computer Interaction. [e-book] Taiwan: National Chiao Tung University. pp. 1 - 19. Available through: Chiao Tung University http://caig.cs.nctu.edu.tw/course/HCI08/HCI_2_Usability_F07_C.pdf [Accessed: 29 Aug 2013].Nigel. 2009. E Z Toilet Flusher hands free, step on flush thingy. [online] Available at: http://www.redferret.net/?p=15062 [Accessed: 29 Aug 2013].Optionsil.com. 1967. Tour: Bathrooms Options For Independent Living. [online] Available at: http://www.optionsil.com/model-home/bathrooms/3 [Accessed: 29 Aug 2013].Schrag, J. 2008. The power of user experience goals. Taking Aim, 7 (1), pp. 1 - 3. Available at: http://dux.typepad.com/files/ux2008_takingaim-uxgoals.pdf [Accessed: 3rd August 2013].Tumblr.com. 2013. up arrow on Tumblr. [online] Available at: http://www.tumblr.com/tagged/up-arrow [Accessed: 29 Aug 2013].Usability Goals. n.d. [e-book] pp. 1 - 6. Available through: Soberit http://www.soberit.hut.fi/t-121/t-121.110/english/laskarit_05/4-kaytettavyystavoitteet_en.pdf [Accessed: 29 Aug 2013].Usability Goals and Design Principles. 2012. [e-book] Comp 2030. pp. 1 - 60. http://www.cs.umanitoba.ca/~comp3020/04_Goals.pdf [Accessed: 29 Aug 2013].Usabilitybok.org. 2010. Principles for Usable Design | Usability Body of Knowledge. [online] Available at: http://www.usabilitybok.org/principles-for-usable-design [Accessed: 29 Aug 2013].Usabilitygeek.com. 2011. Why Web Site Usability is Important for a Company | Usability Geek. [online] Available at: http://usabilitygeek.com/why-web-site-usability-is-important-for-a-compan/ [Accessed: 29 Aug 2013].UX Centered Blog. 2009. Usability Guidelines for Heuristic Evaluation. [online] Available at: http://uxcentered.wordpress.com/2009/12/27/hello-world/ [Accessed: 29 Aug 2013].Ux.stackexchange.com. 2013. What is the best time to create Usability Goals (or Criteria) for your application/website and on what basis? - User Experience Stack Exchange. [onlin