(PDF) Usability of Interfaces Assignment

Subject Code
Interface Usability Group
Name
1
Interface Usability
Group Name
Local Farm Shop
Group Name:
Student Id:
Student Name:
Date:
Student ID Student Name

Subject Code
Interface Usability Group
Name
2
Table of Contents
For Interface Design 1.....................................................................................................................3
For Interface Design 2.....................................................................................................................4
For Interface Design 3.....................................................................................................................6
For Interface Design 4.....................................................................................................................8
For Interface Design 5...................................................................................................................10
For Interface Design 6...................................................................................................................12
For Interface Design 7...................................................................................................................14
For Interface Design 8...................................................................................................................16
For Interface Design 9...................................................................................................................18
For Interface Design 10.................................................................................................................20
Bibliography..................................................................................................................................23
Student ID Student Name

Subject Code
Interface Usability Group
Name
3
For Interface Design 1
1. Name of Wireframe: Home Page
2. Screenshot of updated Wireframe:
3. Design Decisions: The home page is mainly designed as one master page to be mainly
incorporated with other available pages. This particular page is only linked and connected with
Student ID Student Name

Subject Code
Interface Usability Group
Name
4
all various pages available in the Local Farm Shop application. The module of this particular
page is all same whereas there will be easy travelling to other pages from this particular page. All
pages updates and important information will be visible on the home page along all exiting offers
and different flash deals messages which helps to attract more customers in this particular page.
4. Recommendations of the Design: Some of the recommendations from the updated design of
Local Farm Shop app are discussed below:
 From this updated design, it becomes easy to operate all available pages as all the pages
are inter-linked with home page.
 In this updated design of home page, the less detail of all pages are available so that it
gives the clear idea of all pages which helps the visitor to get clear idea and navigation as
per their needs.
5. Justification of the recommendations: It is identified that the above design of this home
page will be accepted as it is clearly serving all options of home page. From the home page, any
customer can create/login their account, access their cart, set their exact location and also get to
know about the options of available item varieties.
For Interface Design 2
1. Name of Wireframe: Login Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
5
3. Design Decisions: Login page is the second content page re-directed from the master page
‘Home Page’. Here, the customer able to login their own account by using Google+ or Face book
also. In case of password forget, they can retrieve the account by following forgot password step.
In addition to this, this page also has the option to create account also by entering any registered
e-mail address. From this page, we will able to access both the ‘my cart’ and ‘delivery location’
page also.
Student ID Student Name

Subject Code
Interface Usability Group
Name
6
4. Recommendations of the Design: The recommendations from this updated login page of
Local Farm Shop Design are listed below:
 From the other groups, it is recommended that the cart page should not be accessible
before doing sign up/registration of a new account. One can also only surf the products
but cannot store and proceed further after viewing any products.
 From your group, the login page should have more options to login like to login using
customer’s valid phone number except any e-mail address.
5. Justification of the recommendations: After analyzing the above recommendations based on
the above updated interface design; it is identified that these recommendations should be
accepted for better co-operation with visiting customers from our end.
For Interface Design 3
1. Name of Wireframe: Registration Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
7
3. Design Decisions: Registration page is the first content page after the creation of master page
‘Home Page’. In this page, customer needs to create their account by putting all valid details of
full name, address details, contact numbers, proper password which will be used for further
login. Customers also get the option to direct register by using face book and Google + where
they can skip the mentioned steps of registration.
Student ID Student Name

Subject Code
Interface Usability Group
Name
8
4. Recommendations of the Design: Some of recommendations for the above mentioned
registration design page are given below:
 From other group, in address details space, there should be the limit of putting details so
that customers just put their exact address in short and proper way. In addition, in contact
number, there should be the option to choose the country before entering the number so
that country code gets automatically generated.
 From my own group, the full terms and condition should require to be viewed to the
customer before signing up so that they have clear idea about the website and its
accessibility.
5. Justification of the recommendations: From the above recommendations of the modified
design, it analyzed that all these needed to be implemented then this will surely helps in the
better performance of this mobile app.
For Interface Design 4
1. Name of Wireframe: User Profile Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
9
3. Design Decisions: In this page, customer can view their whole created account with registered
email address, registered contact number, full address details along with all available loyalty
discounts and special offers in the person’s account. They also get the option to edit the previous
registered details in case required.
Student ID Student Name

Subject Code
Interface Usability Group
Name
10
4. Recommendations of the Design: Following of the recommendations based on the above
design of profile page is given below:
 From the other group, there should be the option of subscribe of any special prime
membership and wish list from where customer get some more facilities and stored any
selected items in wish list for future assistance .
 From my own group, the delivery location should be connected with the GPS system so
that real-time location details can be fetched.
5. Justification of the recommendations: From the above recommendations, it is identified
that all these are needed to be implement in the modified interface design. It will really helps to
make the mobile app more convenient to use and user-friendly.
For Interface Design 5
1. Name of Wireframe: Product Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
11
3. Design Decisions: In this product page, it shows the clear details of all available items of
foods, gifts, wines etc along with the larger view of selected items and price details. They also
getting the direct link to add the selected products on cart in own desired quantity. They also can
access ‘My Cart’ directly from this page as it has that button available.
4. Recommendations of the Design: Some of the recommendations based on the above
interface design are mentioned below:
Student ID Student Name

Subject Code
Interface Usability Group
Name
12
 From the other group, under the each selected items there should the option of direct
payment ‘Buy Now’ option so that customer need not required to visit cart page incase of
one item at a time.
 From my own group, there should be an option of quantity number option of all items
after selection. There should be the option of buying any products using prime
membership which reduces any types of available extra changes like delivery charge,
route-assistance, and delayed delivery.
5. Justification of the recommendations: From the above all recommendations, it is getting
clear by implementing all these points, it will surely improve the customer satisfaction and
customer visit.
For Interface Design 6
1. Name of Wireframe: Order Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
13
3. Design Decisions: In this order page, it provides the option to select quantity of selected items
and then add it to cart. It also provides the access of both delivery location and full view of cart
from where anyone checks what exactly he is going to order and also the total payment required
to pay.
4. Recommendations of the Design: The recommendations based on the above design are listed
below:
Student ID Student Name

Subject Code
Interface Usability Group
Name
14
 From the other group, there should be the automatic calculation option along with
quantity selection of total price for each item.
 From my own group, not only kg parameters of products other parameters also needed to
be there so that, customers can select those if they required to buy from less than 1 kg.
5. Justification of the recommendations: From the above recommendations based of modified
Local Farm Shop app, it is clear that all these should be implemented for better customer service
and increase of customer numbers.
For Interface Design 7
1. Name of Wireframe: Cart Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
15
3. Design Decisions: In this content page, the customers get the clear idea about total amount
and also any additional charges in case required to pay. From this particular page, the customers
can un-check any items if they do not want to buy. This page allows the customers to show the
full information of purchase along with items, quantity etc.
4. Recommendations of the Design: Some of the recommendations based on the above updated
design of cart page are listed below:
Student ID Student Name

Subject Code
Interface Usability Group
Name
16
 From other groups, in this page, before the full payment there should be the option to
show any available discount offers of the selected items or any previous money available
in Local Farm Shop pay account.
 From my own group, there should be the update regarding the maximum purchase
amount above of which there will be no delivery charges required.
5. Justification of the recommendations: After analyzing the above recommendations of
updated wireframe design it is identified that all these recommendations needed to be
implemented for the better customer service facility.
For Interface Design 8
1. Name of Wireframe: Payment Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
17
3. Design Decisions: In this payment content page, it has the option select the mode of payment.
From all the available options, customers can select one based on their ease of use. In case of
card option, they need to put the card details. After that, they also required to enter their shipping
address in case of different from registered address.
4. Recommendations of the Design: Following are the recommendations based on the above
updated interface design mentioned below:
Student ID Student Name

Subject Code
Interface Usability Group
Name
18
 From the other group, there should be the option to save card details if anyone want
except CVV number and also the maximum amount of purchase in case of getting COD
(Cash On Delivery) option.
 From my own group, there should be the time limit to enter the OTP received in
registered contact number if not received then to re-generation option of OTP.
5. Justification of the recommendations: From the all above recommendations, it is deduced
that all these needed to be implemented for the better customer facilities which helps to attract
more customers.
For Interface Design 9
1. Name of Wireframe: Location Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
19
3. Design Decisions: This particular page shows the real-time location access in this app. From
this page, customers can set their own location and also after delivery can track the location
distance if the requested order is out for delivery.
4. Recommendations of the Design: The recommendations based on the above updated
interface page are:
Student ID Student Name

Subject Code
Interface Usability Group
Name
20
 From other groups, in this location track page there should be the option to set near
famous landmark of the shipping address for better accessibility.
 From my own group, customer needs to see the real time view of the moving delivery
and also the estimated time to reach on the address. In case of the unavailability to
receive order, there should be the option to update the modified time.
5. Justification of the recommendations: All the above recommendations are viable as per the
updated wireframe design so all these need to be implemented for better customer facility and
admin facility also.
For Interface Design 10
1. Name of Wireframe: Restaurant Booking Page
2. Screenshot of updated Wireframe:
Student ID Student Name

Subject Code
Interface Usability Group
Name
21
3. Design Decisions: the above mentioned page is of the restaurant booking page from where it
gives the facility to do online booking of the restaurant for any surprise or party planning. From
this page, customers get the facility to select own table from available option, preferred date,
preferred timing also.
4. Recommendations of the Design: Some of the recommendations from the modified interface
design of restaurant design are listed below:
Student ID Student Name

Subject Code
Interface Usability Group
Name
22
 From other group, there should be the option of payment before re-directing to the
booking page.
 From my own group, there should be the notification generate or reminder call option on
registered contact number on the booking date.
5. Justification of the recommendations: From the above modified design, it is identified that
all these should be implemented on this updated interface for better accessibility and better user
interface.
Student ID Student Name

Subject Code
Interface Usability Group
Name
23
Bibliography
Bakshi, R. (2015). A Comparison Between User Interface Design for Different Kinds of Mobile
Applications. IJEECSE. Special Issue-TeLMISR, 91-96.
Kantorowitz, E. (2016, September). Two Step User Interface Design. In Proceedings of the
European Conference on Cognitive Ergonomics (p. 41). ACM.
Louridas, P., Tsoukalas, G., & Mitropoulos, D. (2016). Requirements and User Interface Design.
Martinez, J., Sottet, J. S., Frey, A. G., Ziadi, T., Bissyandé, T., Vanderdonckt, J., ...& Le Traon,
Y. (2017). Variability Management and Assessment for User Interface Design. In Human
Centered Software Product Lines (pp. 81-106). Springer, Cham.
Shneiderman, B., Plaisant, C., Cohen, M., Jacobs, S., Elmqvist, N., &Diakopoulos, N.
(2016). Designing the user interface: strategies for effective human-computer interaction.
Pearson.
Student ID Student Name