Phase 3

PLANNING

For planning, we redesign the icon in the first pages to match the user conceptual model according to the Norman’s guideline which to help user with system model,metaphors,work context. As we can see in the picture below, the icon does not match the meaning of the word. Besides, there are same icon for two different function which can make the user confuse and click it at the wrong button. So, we plan to organize the categorization. For example, for prepaid reload in for reload of phone credit while bill payment is for payment of the bill such as astro bill. Plus, we plan to design a column that show the balance money of the user bank as it is in our planning Norman’s diagram.

TRANSLATION

For translation, the guideline that we applied is make cognitive affordance noticeable. It is under presentation of cognitive affordance. This guideline is applied in the icon of the first pages. We design the icon in 3-dimensional shape to make it easy as it alert the user that it is a button that can be click on, and it is actual exist and visible.

Besides, as we redesign the icon, it help the user to clearly know which button need to be click to determine their task or action based on the meaning of the cognitive affordance. The guideline use was help user determine actions with effective content/meaning in cognitive affordance which is under content and meaning of cognitive affordance. Another Norman’s guideline under content and meaning that we applied is clarity of cognitive affordance. In the first pages of the previous interface, the description of ‘Own Account’ is for transaction between Bank Islam account and other Bank Islam account. The user might think that ‘own account’ is actually means the detail of their own account. So, to avoid the confusing we change the word ‘Own Account’ with ‘Transfer within Bank Islam’. We also change the description of ‘Bill Presentment’ with ‘Bill Payment’. Bill payment is the task of where the user use  to paid their bill. In addition, we grouping the same function of task in one categorize. For example, bill payment is for paid of bill. In the previous design, the bill presentment is the payment of certain organization such as college or other organizations while prepaid reload is where we paid all the bill. For example, ASTRO, digi or GRAB. So, it might confusing the user as if they want to paid for the ASTRO bill, they might click at the bill presentment as they consider it as payment of bill. As we all understand that the word ‘Prepaid Reload’ or ‘Prepaid’ itself mean something that related to phone. So, we categorized payment of bill in bill payment and prepaid reload for phone related.

Plus, we redesign the transaction pages, the pages where the user need to fill in the information to fit it in one pages. We design it like that is because to make the user do less work. In the previous design, the user need to scroll down the pages to fill in the information at the recipient’s information. It is the same in the pages of step 2 and 3 which is the confirmation pages and transaction status. The Norman’s guideline that we applied is provide shortcut which is under task structure. So, by applied this guideline it can save the user’s time.

PHYSICAL ACTION

In physical action, the guideline use is manipulating user interface object which is design layout to support manual dexterity and fitts’law support targeted cursor movement by making selectable objects large enough. We design the icon large enough for the user can clearly saw and sense it.

ASSESSMENT

As for assessment, redesign the last pages of the interface. We design the status part to make it more noticeable and visible. So, the user can know that their transaction is clearly successful. We can see the transaction is successful but it is not notice enough to alert the user. So,we highlight the word “Successful” and show a ‘Thick’ icon to make it more noticeable. This is under presentation of the feedback which is make feedback noticeable.

Original design

Sketch Redesign