Group project 3 - Conceptual & Physical Design
Persona 1
Figure 1 shows the storyboard of Persona 1.
Persona 2
Figure 2 shows the storyboard of Persona 2.
Persona 3
Figure 3 shows the storyboard of Persona 3.
The four pictures below show the crazy 8 sketches of all the group members and the final results of interface after the voting process.
Figure 4 shows the sketch drew by Jack.
Figure 5 shows the sketch drew by Gan Qi You.
Figure 6 shows the sketch drew by Lai Kai Chian.
Figure 7 shows the sketch drew by Shi Jun Hui.
Wireframes
Task 1 Withdrawal of money from bank account
The diagram above is the wireframe of withdrawing money from a bank account. At first, users have to touch the screen and select the language that they prefer to use. After that, users have to press the money withdrawal and insert the debit/credit card. Then the user is required to enter their 6 digit pin number and select the amount withdrawn. Users can either choose the amount shown or enter any amount desired to withdraw. Next, the user needs to confirm the amount to withdraw and wait for a while. When the transaction completes, the machine will show the amount of paper currency to be withdrawn and ask if the user needs to print the receipt or not.
Task 2 Convert paper currency into coins
The diagram above shows the flowchart of how users convert the paper currency into coins. The arrow is the step of the user to press the function in our machine. At first, the user has to select the language to use and select the function of converting the paper currency into coins in the menu. Then, the user is required to insert money and press the confirm button. After that, the user needs to select the amount of coin to convert and the coin will come out at the socket given.
Task 3 Convert big notes of money into corresponding small notes of money
The diagram above shows the flowchart about converting the big notes into small notes of money. First, the user has to select the language to use and choose the function of converting big notes into small notes of money. User is required to insert the paper currency and select the small notes desired to change. The machine will show the amount of paper currency to be withdrawn and the user needs to collect the small notes at the socket.
Task 4 Top up money into Touch N Go card or Identification Card(IC)
The frame above is how we design the task of top up money into Touch N Go. We have given many ideas to form the flow chart based on the reference of the action of how we top up money into Touch N Go and drawing it into a continuous diagram to demonstrate the process. At first the user has to select the language to use and select the function of top up money into Touch N Go in the menu. Then the user is required to select the method of top up using Touch N Go and confirm inserting the Touch N Go card. After that, the user needs to insert the pin number and select the amount to top up. Users can choose whether to top up the amount shown or enter any amount. At last, users need to confirm the amount selected and the status of Touch N Go will be updated.
The ATM machine body is black and the interface screen is blue just like the color of blue to represent the stability in the color psychology and the color of black represents the strength which means that our machine is strong and stable.
In this machine, the flow of every function is designed based on the design in the Automated Teller Machine (ATM). We design the screen and the keypad which is like the one on an ATM so that the users will feel familiar while using this machine. They can apply their user experience on using an ATM while using our machine.
The image above shows the metaphor for withdrawing cash. The action of withdrawing cash in an ATM has become the reference for us to design the diagram flow chart of withdrawing cash in our machine.
The image above shows the metaphor for converting big notes of money into corresponding small notes of money. The action of converting big notes of money into corresponding small notes of money in an ATM has become the reference for us to design the diagram flow chart of converting big notes of money into corresponding small notes of money in our machine.
Metaphor 5
The image above shows the metaphor for top up money into Touch N Go through touch n go card or identification card (IC). The action of top up money into Touch N Go through touch n go card or IC in an ATM has become the reference for us to design the diagram flow chart of top up money into Touch N Go through touch n go card or IC in our machine.
Cash withdrawal icon is a metaphor for withdrawing money from a machine. It is a simple and straightforward name icon. Cash withdrawal icon is designed for all windows, mobile, IOS and especially ATM. The icon from the web is actually the same as the icon that we design.
‘Convert money coins’ icon is a metaphor for converting paper currency into coins. It is a little bit complicated and a straightforward metaphor/name icon. Based on the diagram, there is an arrow pointing from paper currency/notes into coins which represents that the money will change into coins. Our machine will not have the function of changing coins into notes. Therefore, our icon will not exist as the arrow pointing from notes to coins.
‘Convert small notes’ icon is a metaphor for converting big notes to small notes. Icon from the web is a little bit confusing but still can count as a straightforward metaphor icon also. On the other hand, our designed icon is more straightforward compared to the source icon from the web. The arrows are pointing from the big notes which are RM50 to 5 pieces of RM10. There are no arrows pointing from small notes to big notes because we do not have this function in our machine.
Top-up icon is a metaphor of top-up money into Touch N Go Card or Identification Card(IC). The icon that we design is a simple and straightforward icon almost the same as the icon which is searched from the web. The plus symbol means reload or top up. The whole diagram wants to represent that the money reloads/top-up into TNG cards.
.png)
25/32
ReplyDelete