Author: Amirul Syafiq
Project Task 7: Computer Prototyping
Prototype
Changes made
- Notify users when input is wrong or not filled in
- Add logout button
- Redesign registration form
- Redesign function to navigate from each pages
- Remove menu side bar
- Fixed and resize company logo at top of the page
Briefing text
Pre-test
Welcome to Tokey & Co. usability testing session for Fly Wash website prototype.
Tokey & Co. will provide a Fly Wash service to UTM students that will help making a delivery for their laundry. Fly Wash service will ease the students’ burden and responsibility by saving their time and energy. Fly Wash is a web based system available to any internet users. This website will enable user to request delivery for their laundry online.
Users are able to create new account for their own use. After the user got their own account, they can have access to the website.
Users can choose 3 option whether to request pickup, view recent pickups and view price rate for the service.
You are required to finish 4 tasks in total. If for whatever reason you are not able to finish the tasks given, please say “terminate”. The tasks will be done consecutively.
Here is a consent form for you to review before running the testing session. Make sure you clearly understand the conditions and sign the form.
You may start the task whenever you are ready to.
Post-test
Thank you for willingly to participate in Tokey & Co. usability testing session.
We appreciate what you have done. Thank you!
Informed consent form
Questionnaire
Usability testing
User 1:
User 2:
User 3:
User 4:
User 5:
User 6:
Results from performance measurements
Task 1: Registration
Time taken for designer : 11.05s
Time taken for User 1 : 19.71s
Status : Complete
S(User 1) = 100(11.05)/19.71
= 56.06%
Time taken for User 2 : 24.5s
Status : Complete
S(User 2) = 100(11.05)/24.5
= 45.10%
Time taken for User 3 : 11.81s
Status : Complete
S(User 3) = 100(11.05)/11.81
= 93.56%
Time taken for User 4 : 11.49s
Status : Complete
S(User 4) = 100(11.05)/11.49
= 96.17%
Time taken for User 5 : 12.32s
Status : Complete
S(User 5) = 100(11.05)/12.32
= 89.69%
Time taken for User 6 : 16.71s
Status : Complete
S(User 6) = 100(11.05)/16.71
= 66.13%
Task 2: Login
Time taken for designer : 7.36s
Time taken for User 1 : 13.62s
Status : Complete
S(User 1) = 100(7.36)/13.62
= 54.04%
Time taken for User 2 : 17.56s
Status : Complete
S(User 2) = 100(7.36)/17.56
= 41.91%
Time taken for User 3 : 7.37s
Status : Complete
S(User 3) = 100(7.36)/7.37
= 99.86%
Time taken for User 4 : 12.62s
Status : Complete
S(User 4) = 100(7.36)/12.62
= 58.32%
Time taken for User 5 : 7.66s
Status : Complete
S(User 5) = 100(7.36)/7.66
= 96.08%
Time taken for User 6 : 11.08s
Status : Complete
S(User 6) = 100(7.36)/11.08
= 66.42%
Task 3: Request pickup
Time taken for designer : 15.47s
Time taken for User 1 : 53.84s
Status : Complete
S(User 1) = 100(15.47)/53.84
= 28.73%
Time taken for User 2 : 76.87s
Status : Complete
S(User 2) = 100(15.47)/76.87
= 20.12%
Time taken for User 3 : 19.03s
Status : Complete
S(User 3) = 100(15.47)/19.03
= 81.29%
Time taken for User 4 : 29.32s
Status : Complete
S(User 4) = 100(15.47)/29.32
= 52.76%
Time taken for User 5 : 38.26s
Status : Complete
S(User 5) = 100(15.46)/38.26
= 40.43%
Time taken for User 6 : 58.50s
Status : Complete
S(User 6) = 100(15.46)/58.50
= 26.44%
Task 4: Recent pickups
Time taken for designer : 1.86s
Time taken for User 1 : 2.68s
Status : Complete
S(User 1) = 100(1.86)/2.68
= 69.40%
Time taken for User 2 : 2.35s
Status : Complete
S(User 2) = 100(1.86)/2.35
= 79.15%
Time taken for User 3 : 2.17s
Status : Complete
S(User 3) = 100(1.86)/2.17
= 85.71%
Time taken for User 4 : 3.22s
Status : Complete
S(User 4) = 100(1.86)/3.22
= 57.76%
Time taken for User 5 : 2.91s
Status : Complete
S(User 5) = 100(1.86)/2.91
= 63.92%
Time taken for User 6 : 2.76s
Status : Complete
S(User 6) = 100(1.86)/2.76
= 67.39%
Task 5: Price rate
Time taken for designer : 1.79s
Time taken for User 1 : 2.48s
Status : Complete
S(User 1) = 100(1.79)/2.48
= 72.18%
Time taken for User 2 : 2.16s
Status : Complete
S(User 2) = 100(1.79)/2.16
= 82.87%
Time taken for User 3 : 1.97s
Status : Complete
S(User 3) = 100(1.79)/1.97
= 90.86%
Time taken for User 4 : 2.52s
Status : Complete
S(User 4) = 100(1.79)/2.52
= 71.03%
Time taken for User 5 : 2.74s
Status : Complete
S(User 5) = 100(1.79)/2.74
= 65.33%
Time taken for User 6 : 2.30s
Status : Complete
S(User 6) = 100(1.79)/2.30
= 77.83%
Results from subjective measurements
Discussion
According to the results obtained, we could say that we achieved our expectations. All of the users completed the task even there are some error made. Our main objective for this project is to make sure that all the tasks and functions are working properly.
Based on the number of clicks and time spent on a specific task, we conclude that
- Easiest — Task 4 and 5
- Most of the user use 1 click only and short time to complete the tasks
- Most difficult — Task 3
- Users take times to fill in the form
Conclusion based on user performance score:
- Task 1: Registration
- All user completed the task quickly and get high score
- Task 2: Login
- Only 1 user take long time to complete the task because he input the wrong password at first try
- Task 3: Request Pickup
- Most of the user take time to fill in the form however, all of them managed to complete the task
- Only 1 user completed the task quickly and get high score
- Task 4: Recent Pickups
- All user completed the task quickly and get high score
- Task 5: Price Rate
- All user completed the task quickly and get high score
Conclusion based on subjective measurement:
- Based from the website, the user feels that without explanation beforehand it is difficult to understand the flow of our service
- Most of them like the design of the website and find it easy to use without the need of instruction
- Even though the website may look simple and boring, the users find it very nice because they could finish the task with ease
Improvement
- Add more engaging and fun features such as point system in the future
- Add information about company background and services
Conclusion
- Even though the website is working like how we expect it to be, there are certain elements that we overlook such as displaying information about our company and services.
- Most of the users like the presentation of the website in terms of design, usability and complexity.
- Even though the website is very simple, all the function are very direct and easy to understand, making it easier for the user to complete the tasks given.
Project Task 6: Low Fidelity Prototype
Briefing notes
We briefed the users about our service and application. We then ask the users to test our website and see if they are able to complete the task given to them.
Test plan
Scope: Describes a test plan for conducting a usability test during the development of Fly Wash website. The goals of usability testing include establishing a baseline of user performance, establishing and validating user performance measures, and identifying potential design concerns to be addressed in order to improve the efficiency, productivity, and end-user satisfaction.
Purpose: To determine design inconsistencies and usability problem areas within the user interface and content areas. Potential sources of error may include such as navigation errors, presentation errors and control usage problems.
Schedule & Location: We did not have specific schedule as the test will be held anytime when we found a possible tester. Location is anywhere inside UTM Skudai.
Sessions: It will be an informal session. It may take between 5-15 minutes of the session.
Equipment: We will provide a computer or phone to the tester and they just have to run it.
Participants: At least 4 users as Fly Wash website has 4 functions. We will choose any possible tester who is willingly to run the testing.
Scenarios: The usability test will show how the participant accomplishes a task and shows whether the interface facilitates completing the scenario. How the task will be accomplishes is recorded including the main pathway and any alternative pathways the participant may use to accomplish the scenario.
Subjective metrics: Subjective evaluations regarding ease of use and satisfaction will be collected after we interview the tester, and during debriefing at the conclusion of the session.
Quantitative metrics: The time to complete each scenario, successful completion rates and error rates will be recorded.
Roles:
- Muhammad Fitri bin Mohd Masaan – Facilitator who provides overview of study to participants, defines usability and purpose of usability testing to participants, assists in conduct of participant and observer debriefing sessions and responds to participant’s requests for assistance.
- Abdullah Anas bin Jaafar – Test observers that will assists the data logger in identifying problems, concerns, coding bugs, and procedural errors. Will be a note taker as well.
- Amirul Syafiq bin Ahmad Zulfikri – Data logger who will records participant’s actions and comments. Take a video of the testing session.
Testing with user
Pre-Test Questions:
- Are you familiar with online delivery service?
- Have you ever use a pickup/delivery service?
- First thoughts when using FlyWash?
Post-Test Questions:
- Do you think the GUI on this website is user friendly?
- What is your thought or opinion on this service?
- Any suggestion for us to improve our service?
- On the scale of 1 to 10, how would you rate us?
TASK 1 : Register
TASK 2 : Request pickup
Results from interview
Base from the interview, the users like the main interface of the website. All the task are easy to understand even without us to guide them. However, they feel the need for the website to have a popup message to display if the request and registration is successful or not.
Usability problems
- Simple function with confusing interface
- Bad design. Background and company logo is so disturbing
- Wrong function. User can get access to the page without have to login
Project Task 5: Design Sketches
Design Alternatives:
Design 1:
Design 2:
Design 3:
We choose Design 1 because the design is simple and minimalist.
Storyboard:
Project Task 4: Conceptual & Physical Design
Interaction Metaphors:
- Menu Selection
- Instruction
- Button Selection
Interface Design:
Task 1: Login
Task 2: Registration
Task 3: Request Pickup
Task 4: Recent Pickups
Task 5: Price Rate
Project Task 3: User & Task Analysis
Target User : Our target user for this application would be student of Universiti Teknologi Malaysia or any exchange students of any foreign countries all over the world. Our primary focus will be targeting this application towards university students who does not have time to wash their own laundries.
Users
Persona 1:
Name: Rahmat Megawijaya bin Muhammad Megawijaya
Age: 24
Occupation: Student
Extra info:
- Comes from a rich family.
- Does not like to wash his own laundries.
- Loves to do outdoor activities.
Persona 2:
Name: Ahmad Munir bin Kasim
Age: 23
Occupation: Student
Extra info:
- Loves music and poetry.
- Always busy with club activities.
- A food lover.
Persona 3:
Name: Syed Kamal bin Syed Mustafa Kamil
Age: 25
Occupation: Programmer
Extra info:
- Does not like outdoor activities.
- Have a part time job as video game tester.
- Dislike cats.
Scenario
Not used to do laundries by himself:
Rahmad Megawijaya is the only son in his family. Since he comes from a wealthy family, he is often spoiled by his parents. Therefore, he has never done his laundry by himself ever. Plus, since he loves to do outdoor activities, his dirty laundries has been piling up. He prefers to pay someone to do his laundries for him.
Have no time to do laundries:
Ahmad Munir is a very active man. He is the president of Debate and Poetry Club in UTM. Most of the his time are spent with his club members or preparation for a debate tournament. Therefore, he does not have the time to wash his laundries. Moreover, since he only owns a motorcycle, it is difficult for him to take his dirty laundries to a laundry shop.
Too lazy to do laundries:
Syed Kamal dislike doing something that he doesn’t have to. He has a motto, “I don’t do anything I don’t have to. What I have to do, I do it quickly.”. Moreover, being a programmer makes him a busy man. He prioritizes energy conservation above all else.
Does not own a washing machine:
Syed Kamal lives alone in his rented house. Even though he likes to conserve his energy by not doing what he doesn’t supposed to do, he would wash his on laundries if he has a washing machine of his own. Most of his salaries goes to paying his rent and food, making him unable to save money to buy a washing machine.
Hierarchical Task Analysis
1. Registration
Plan 0: Do steps 1, 2, 3, 4 to create new account.
Plan 3: Do steps 3.1, 3.2, 3.3, 3.4, 3.5 for register new account.
Plan 4: Do steps 4.1 and 4.2 to submit registration
– The web will display a form to fill in username, password, full name, phone number and e-mail.
– Users submit the information
– If the submission a successful, a successful message will be displayed.
– If the submission failed, users will need to re-fill the information.
2. Login
Plan 0: Do step 1, 2, 3 to login
Plan 3: Do steps 3.1 and 3.2 to submit login
– Users insert username and password
– If login successful, they can proceed to the website.
– If login failed, they have to re-enter their username and password.
3. Request pickup
Plan 0: Do steps 1, 2, 3 to request pickup
Plan 2: Do steps 2.1, 2.2, 2.3, 2.4 to fill in user information and services they want
– User need to fill in the form to submit their request.
– User insert their name, address, type of service they want and phone number.
– Click request pickup to send the request.
4. Recent pickups
Plan 0 : Do steps 1 and 2 to view recent services that user made before
– Users can view the history of service they made before.
– If they used the service before, their previous services will shown there.
5. Price rate
Plan 0: Do steps 1 and 2 to view price rate for all services provided
– Display price rate for all type of services provided.
Project Task 2: Project Proposal
PROBLEM:
In this project, we are trying to help solve the problem face by students in Universiti Teknologi Malaysia (UTM) on their laundry. Every block in UTM has only 1 or 2 washing machines. Most of the time, the washing machines are not working properly. Which forced the students to hand wash their laundries. Usually as a student, they were busy with their study and activities thus make them did not have enough time or lazy to do their own laundries.
SOLUTION:
Tokey and Co. will provide a Fly Wash service to UTM students that will help making a delivery for their laundry. Fly Wash service will ease the students’ burden and responsibility by saving their time and energy. Fly Wash is a web based system available to any internet users. Students just have to request for the service online and we will make sure their laundry washed and delivered successfully.
ROLES:
Amirul Syafiq bin Ahmad Zulfikri – Project Manager
Muhammad Fitri bin Mohd Masaan – Web Designer
Abdullah Anas bin Jaafar – Test Enginneer
Group Activity 3: Type of Interface
Interface Type : Web
- The interface is a fundamental part of making the site more successful, safe, useful, functional and, in the long run, more pleasurable for the user.
- Website design offers some interesting problems that are not present in the creation of traditional, stand-alone software products.
- Websites should be usable and safe, as well as functional, so that users can perform the task at hand without any obvious problems or usability errors.
Website design example
Interface Type : Tangible
- A tangible user interface (TUI) is a user interface in which a person interacts with digital information through the physical environment.
- The purpose of TUI development is to empower collaboration, learning, and design by giving physical forms to digital information, thus taking advantage of human abilities of grasp and manipulate physical objects and materials.
- Characteristics of TUI :
- Physical representations are computationally coupled to underlying digital information.
- Physical representations embody mechanisms for interactive control.
- Physical representations are perceptually coupled to actively mediated digital representations.
- Physical state of tangibles embodies key aspects of the digital state of a system.
Reactable
Topobo
Interface Type : Air-Based Gesture
- Computers or machine can interpret human gestures via mathematical system using the gestures where it can originate from human body especially our face or hands.
- Air-based gesture is a begin for computers to understand human body language.
Group Activity 2: Usable Interface
Good and Bad Usability of Padlock
GOOD :
- Effectiveness
- It is difficult to break/crack by someone else.
- More secure than using a key because a specific combination of numbers are required to unlock.
- Does not depend on only one master key. The password can be reset anytime.
- Efficiency
- Does not require a key to use the padlock. Therefore, does not require to bring key all the time.
BAD :
- Learnability
- Takes time to get to know how to use it.
- Memorability
- User must not forget the combination of numbers that they have set.
- Error prone
- Easy to make mistake in inserting the password because it has many numbers but not all numbers are displayed.
Tokey & Co. 