CSE519 Human Computer Interaction

Project Final Report

Section - 2

Submitted to faculty: Prof. Anurag Lakhlani

2021-2022 (Winter Semester)

Team Name - Alpha beta designers

Roll No. Name of the Student

AU1940172 Aayushi Chauhan

AU1940146 Nimisha Patel

AU1940215 Raj Chauhan

AU1940212 Grishika Sharma

 TABLE OF CONTENTS
CHAPTERS

CHAPTER 1: INTRODUCTION 2
1.1 MOTIVATION 2
1.2 OVERVIEW OF PROJECT 2
1.3 MARKET SURVEY 2

CHAPTER 2: DETAILS OF TOOLS 7

2.1 BRIEF DESCRIPTION OF FACILITIES AVAILABLE 7
2.2 COMPARISON TABLE WITH OTHER TOOLS 8

CHAPTER 3: PROJECT PLANNING AND PREPARATION 9

3.1 PAPER-PEN DESIGNS OF THE SCREENS 9
3.2 PERSONA DEVELOPMENT 15
3.3 SCENARIO DESCRIPTION 22
3.4 USE CASE DESCRIPTION 23

CHAPTER 4: PROJECT FEATURES 27

4.1 DETAILS OF ALL FEATURES 27
4.2 SCREEN PHOTOS 47

CHAPTER 5: DIFFICULTIES ENCOUNTERED AND RESOLVED 69

5.1 DESCRIPTION OF DEBUGGING/TROUBLE-SHOOTING 69

CHAPTER 6: REAL LIFE IMPLEMENTATION PERSPECTIVES 71

6.1 DESCRIPTION OF DEBUGGING/TROUBLE-SHOOTING 71

CHAPTER 7: REFERENCES 73

1
 CHAPTER 1: INTRODUCTION

1.1 Motivation

At the present time, we have standard mobile app stores like Google Play Store for
Android and the Apple App store for iOS which offers global coverage to the huge
potential audience. But can we recall a web app store which has gained as much attention
as standard mobile app stores like Google Play Store? Not really, right? So the aim of this
project is to come up with a distribution channel for web apps/softwares.The user can
download and install any possible web app or software designed for operating systems
like Linux, Mac Os or windows.

1.2 Overview of Project

Using the website, developers or users can have a comprehensive overview of the entire
app landscape, along with statistics such as downloads, rankings, and similar apps.

Possible features of the website:

● Download web apps/softwares

● Search apps by category
● Get a quick preview of an app
● display features of app
● display total no. of downloads of an app from the website
● display review of app

1.3 Market Survey

1. Microsoft Store

2
The Microsoft store is primarily used to provide windows store apps to users.
Microsoft used to offer a software distribution system called Windows that allows
users to purchase software via the internet.

As we can see in the screen shot, there are options available for downloading the
apps or softwares in laptop or PC. We can also download games for our PCs and
laptops.

3
 Features:

● Provides features such as Microsoft cloud, Windows EG6 etc.

● Numerous softwares such as one drive, outlook, Skype, one note.
● There is also a feature known as surface, which allows us to easily upgrade
our Windows system generation.
2. Softonic

Softonic is a place where you can find the best app available in the market that
your computer needs which offers reviews, news, articles and free software
downloads.

As you can see in the first picture, the navigation bar differentiates Apps, Games,
Articles and best products for the user. You can also find top downloads
applications for all the devices. However, they have not categorized apps very
minutely and it can become tough to find the most desirable app.

4
 Features:

● Can easily download Apps for free.

● It provides list of Best apps to choose from
● It provides Articles and Reviews for the apps.

Points which make Softonic different from Microsoft Store and Google play is that
it provides all the applications for free even though it cannot be found for free
anywhere else , however there are less number of apps that are
available in its webpage.

3. Google Play

Google Play is an official digital platform where users can find all of their favorite
apps, games, movies, TV shows, and books. You can choose from a wide range of
categories and download it to your smartphone.

If a user does not have the information such as the name of the application or tool
then, he or she can utilize the Google Play Store's search feature, which will
display all of the related searches. For example, as we can in the screenshot, if a
user wants to download a note-taking app, he or she should search for notes, which
will provide all of the relevant note-taking apps.

5
Features:

● Users can download the apps for free.

● Choose among categories for kids and adults.
● Provides reviews and ratings of the apps.

Google play store differs from Microsoft store and Softonic in terms of wide range
of options for the users. In addition to downloading, users can purchase movies,
books, games on this portal.

6
 CHAPTER 2: DETAILS OF TOOLS

2.1 Brief Description of facilities available

Our Tool: Figma

Features of Figma:
1. Accessibility and collaboration

It's much easier to finish work quickly when other team members are
working on the same part of the file at the same time. Figma includes a
feature called "multiplayer." It allows multiple team members to
simultaneously open and work on a design file. Everyone working on the
file is visible on the top right corner of the page, and every member can
see each other's avatar’s name by clicking on them. It also supports
real-time updating. The updation in the file is smooth and it does not lag
the updation even when a large number of users are working on the file.

2. Versatility to be customized and improved:

Figma APIs and custom Plugins:

This feature makes it easy to interact with users. We can use the third
party applications or files into our website in figma. So figma makes it
easy to add APIs and custom plugins.

Using Real Data:

We can use real data in mockups and prototypes, We can do this with the
help of figma. Figma allows users to import content from others. We can
import images, text, icons from our device. We used many icons like
vector, arrow, search, voice etc for our project.

7
 Advanced workflows:

In figma users can view their integrated features. Like in our website we
can see Frames, Launch application, bank details etc in the left side. So it
will be easy for users to find something.

3. Ability to build prototypes and test

In figma, it is very easy to create interactive and innovative prototypes.

We can also easily change the mode of the file from editing to designing
to prototyping as per our needs. We can click on an element and make it
interactive whether from the stage or the layers sidebar. Clicking on the
small play icon on the top right launches the prototype, and with that a
URL gets Generated. We can share the URL, and open the link from
mobile, Computer or any device to test the prototype and how it works.

4. Fonts

As Figma is an online tool which is used on browsers, we can find every

type of font on the tool. Those Fonts make the life of the user easy, as
they don’t have to search for the fonts online, and can use every font
from the tool itself.

2.2 Comparison table with other tools

No. Features Figma WIX ADOBE XD

1 Platform Browser as well as Browser App, Desktop App (MAC

Desktop App(MAC, works on any and Windows)
Windows, Linux) browser

2 Live Collaboration Yes No Offers Real time

coediting feature

3 Prototyping Nice plugins are Satisfying as the Supports Voice

available to make designs look and Prototyping

8
 prototyping more feel just like the
real. real product

4 Fonts All fonts are All fonts are Only system fonts
available available are available.

CHAPTER 3: PROJECT PLANNING AND PREPARATION

3.1 Paper-pen designs of the screens

1. Registration Page

2. Sign In moodle

9
3. Sign Up moodle

10
4. Home Page

5. Categories Page

11
6. Search Page

7. App Overview

12
8. Update (My Applications)

9. Wishlist

13
10. Settings

11. Launch Application

14
 12. Bank Details (Developer Side)

3.2 Persona development

Persona - 1:
Persona Name: Shroud

Persona Image:

15
Quote: “Always play games and try finding new games (preferably free because i
am broke) so that we can play games eventually”

Bio:
Shroud is a proud gamer and he likes to play games day and night, however there
is an issue. He has limited pocket money and he uses most of it in hardware, he
wants to get games for free on the internet.

Behaviors: He is likely to be found in front of his desk playing video games.

However, He is not attached to a single game and always craves for new and latest
games available in the market.

Goals:
● To find new/latest games to play for free
● Not wasting too much money and time searching for games

Pain Points: He tries to search for games and softwares but mostly he could not
find them in a single platform and all the times he had to search for them at
multiple places.

Personality: More towards introverts as he is always in front of the desk and

doesn't like going out and socializing. He usually plays games that are relatable to
more perceiving and analytical.

Motivations: Major motivations of the personna is to get free software and games
that can be found in one place ( Website) and look cool in front of his friends by
playing games. So that is related to self-satisfaction and social recognition.

Persona - 2:

Persona Name: Prof. Dinesh Bhatt

Persona Image:

16
Quote: “Mathematics is not about numbers, equations, computations and
algorithms, it is about understanding.”

Bio: Dinesh is mathematics professor in delhi university. He is very good at

mathematics.Now he is teaching a few courses in the university. He can really see
how the learning contracts help some students to improve the way they learn. He
also found the online graph calculator app. It is available in the app store.

Behaviors: He pays attention not simply to the topic they are teaching but also to
their students. He shows concern for his students and is always willing to help
those who are having difficulties.

Goals:

● He wants to find the best graph plot app for all polynomial equations.
● He wants to Optimize time for calculating plots in the graph calculator app.

Pain Points:

● He is not able to calculate graphs for all kinds of equations. This app is able
to find only a single parameter graph.
● His app takes more time for plotting the graph.

17
Personality: He is quite an inquisitive and curious person that often likes to spend
time alone with their thoughts.

Motivations:

● He can advertise his app so the students can use this app and they can learn a
lot from this.
● He made the online graph calculator app. Some students and professors are
using this app for learning purposes.

Persona - 3:

Persona Name: Sheryl Jones

Persona Image:

Source

18
Quote: “Always strive to complete the work rather than getting it done. Focus on
the big picture but be flexible on the details.”

Bio: Keen in computing technology since childhood. Developed a game at an age

of 15 while in school. Currently working in a startup, her excellence in the service
could be predicted from the fact that it’s only been 3 years since she’s been
working in the technology industry and has received the best employee award for
consecutive 2 years. Being a part of a startup she has to deal with a variety of
clients and for the same she needs to work with different softwares and web
applications.

Behaviors: Always passionate to work anytime, anyday (except Sunday of

course!) to keep the startup up. Curious to solve any difficult real-life problems
which involve current technology as its solution. Hard working and always
structures her time to get the best out of it.

Goals:

● Manage wider range of clients

● Effective utilization of her time throughout the day
● Maintain work-life balance

Pain Points:

● Gets irritated in no time if couldn’t efficiently handle presentations and

communications with the client.
● Sometimes gets anxious when giving a demo of the product to users didn’t
go as planned due to malfunctioning in the software used for presentation.

Personality:

19
Always keen to learn new technologies ie perceiving, and strives for a possible
creative solution therefore, creative. Not really good at initiating a social convo
with a complete stranger but always up to begin a professional conversation
anywhere anytime! Therefore falls somewhere in between the introvert and
extrovert range.

Motivations:

Her passion is uplifting others in their technological journeys. Her motivation is to

spread knowledge about current market technologies to the underprivileged
population.

Persona - 4:

Persona Name: Adam

Persona Image:

Quote: “In order to be irreplaceable, one must always be different. That’s why I
need to keep myself updated with the latest softwares that are related to
programming.”

20
Bio: Adam is a college student. He is pursuing B.Tech in Computer Science and
Engineering. He learns a lot about different coding languages and gains experience
as much as he can. He enjoys working on complicated coding problems.

Behaviors: He works on a number of technologies at the same time. He, for

example, works on web development and AI projects at the same time, which
requires simultaneous access to multiple software applications.

Goals:

● Develop problem-solving skills

● Removing all syntax and format mistakes, as well as any logical errors,
should take less time.

Pain Points:

● Despite his coding skills, he finds it difficult to choose which software is

optimal for him.
● Handling academic requirements and coding at the same time is difficult for
him

Personality:

● His ability to be creative helps him in better problem solving

● Responsible
● Perceiving

Motivations:

● Successful compilation and run of his code makes him motivated. He is

putting in more and more effort to improve his coding skills.
● His achievements from participating and winning in various coding
challenges.

21
3.3 Scenario Description

Scenario 1:

For the person who is a part of a unicorn tech startup, developing and engineering
the product is the core part of their service but handling clients is also a crucial part
of their professional life. In simple terms, he/she has to manage the major fields of
engineering, economics, marketing and management at the same time. This often
becomes an overwhelming task. Thus, getting application/softwares catering a
huge range of fields at one destination/place seems to be quite difficult (not
impossible though!) Therefore something like a software hub where he/she can
find different categories of web applications or softwares can ease the life of a
startup employee.

Scenario 2:

The user has been exposed to a new course in his/her college. Javascript is a
programming language that is required for that course. If the user does not have
necessary software to write Javascript code, he or she must do so by downloading
it. The user can search for software applications on this website. The system will
provide appropriate searches based on the user's name, and the user may then
choose which software to download into their PC or laptop.

Scenario 3: This system will be helpful if the user wants to download new games
for free. Firstly, the user will have to sign in by entering email and password. User
will then search for a particular game which he wants to download and play. The
system will display multiple games including the searched game with the similar
suggestions of different games. Users will choose the game to install from the

22
suggestions and results of the searched game after selecting the path to install the
game in the Windows or any other OS. Downloads will stop if there is not enough
data space on the PC, and will suggest similar games. The game will directly open
if the game is already downloaded and installed on the PC.

Scenario 4:

If users want to upload their app on our website then they have to sign up with
their email ID, name and phone number. For launching the app on our website, the
user should have to give more information. So they have to give their address, state
information. Also they have to give the bank details for transferring money they
have earned, like if many people can download the app so according to the number
of downloads the user can earn money. Our website system will store all the
information of users, so they can launch their applications to our website. There is
an upload option for the user, users can launch their application free on our
website. So many people can download and use the applications from our website.

3.4 Use case description

Use case 1:

1. Users in the search of different domain web applications/software like

Canva, prezi, Apache Tomcat,etc land up at our software hub.
2. User is prompted with two options:1) sign up 2) login
3. First of all, user have to register/signup to software hub either with email id
or contact number
4. User enters an email-id or contact number.

23
 5. An One Time Password (OTP) will be generated and sent to the user to
confirm email id or password (depending on whether user chooses to signup
with email or contact number)
6. System asks the user to enter OTP
7. System checks the OTP if it is correct or not.
8. If it’s correct, logs in the user else jump to signup page again
9. Once the user logs in, a pop-up appears asking the user if he/she wants to
store his/her login credentials and if the user clicks yes, the system stores the
login information so that users don’t have to enter login credentials over and
over again every time he/she visits this software hub.
10. The user can now search for the required app/software directly from the
search bar or through different categories displayed on the home screen.
11. Now having found the target webapp/software, users can get an overview of
the app and click on the download button.
12. The web app/software will get downloaded within a few minutes (which can
vary depending on the size of software) and the user can now run it on
his/her PC/laptop.

Use Case 2:

1. User opens this website.

2. The system prompts the user to the Login/Sign up page.
3. If the user is new, he or she will select the “Sign up” option, otherwise the
user will log in using their credentials (that includes the user's email address
and password).
4. If the user selects the “Sign up” option then the system will direct the user to
the “Create a new account” page.
5. The user inputs their email address and password then clicks on next button

24
 6. The user inputs his/her First Name, Middle Name, and Last name then clicks
on next button
7. The user selects the country and enters the birth date then clicks on next
button
8. The user needs to verify the email address.
9. The system will send a verification code on the user’s email address.
10. After verification, the account will be created successfully.
11. The system prompts the user to the home page.
12. On the home page, the user selects “Programming Softwares” from the
categories.
13. The user inputs the name of the language on the search bar
14. The system prompts all the relevant softwares for the name entered by the
user.
15. Based on the rating and review, the user can filter out all of the results.
16. The user selects the software that he or she wants to download.
17. The user clicks on download option
18. The system checks whether the user’s device has sufficient storage to
download that software
➔ If not, a pop-up notification with the message "Insufficient space"
appears on the screen.
19. The software will begin to download.
20. The software will successfully download on the user’s device.

Use Cases 3: A use case to find a required game and installation would be:

1. Search the game in the search bar

2. Open the searched game’s profile

25
 3. Check the description and reviews
4. Press the Install button
5. System will check for prerequisites specifications
6. Define the path where you want to install game
7. Download and Installation is completed

Alternative courses:

1. Find the game by surfing in categories

1.1 Select any one category/genre of the game you want

1.2 The system returns to step - 2

6. The game already exists in the computer

6.1 Go to step - 1

Use case 4:

1. Users can sign up to our website.

2. User types email address
3. User types appropriate password.
4. System checks the password if it is correct or not.
5. User types his/her first name, last name and phone number.
6. User types address and state name information.
7. System stores all that information as a database.
8. If the users want to upload their app on our website then the system creates a
new page for bank details.
9. Users type their bank details for launching the app on our website.
10. System check if it exists or not.

26
11. System stores all those details to our database.
12. Now User shows the upload option on the website.
13. Users launch the app on our website.
14. System publishes this app on our website so that people can see the website.
15. Now people can download and open this app.

CHAPTER 4: PROJECT FEATURES

4.1 Details of all features

1. Website Statistics

Functionality: In this feature we take the information of our website and also we add
the information about how many users logged in into our website, how many users
launch their app and how many users download one or more apps using our website. So
users can know about our Software hub website.

Design Principles:

1. Affordance: In this feature the system will inform users about what our software
hub website is about. So this will guide the user to use this website.
2. Visibility: In this feature we show how many users download or upload the app
into our website so other users can see the views and they can decide. So users
can easily identify the steps.

Universal Usability:

1. Diverse Cognitive and Perceptual Abilities: Here users can see the views of how
many people have downloaded the app from our website so the system stores all
this data and they update the data regularly. So the system has long term
memory.

27
Interaction Style:

1. Direct Manipulation: Users can view the representation of the number of

people who downloaded the app from our website and also they can view
the number of users who have uploaded the application to our website.

Hierarchical Task Analysis:

1. 1.1 User can read the information about our website

1.2 System shows all information.

2. 2.1 System shows the data of how many users have downloaded the app from our
website and also shows the information of the number of people who have
uploaded the app on our website.

2.2 User can refer from this information.

2. Categories

Functionality: You can use categories to sort and group softwares/Apps into different
sections. If these categories are already provided to the users then they could utilize
the time to check their required product from the categories. Even if the user is
confused about the software to download, he/she can go through the categories and
find out the category that best describes the software they are looking for. For example,
if the user wants an application for video editing but they don’t know what application
is the best for their work, they can just search from the categories of video editing
apps, and the website will show them the best suitable apps.

Design Principles: Reduce Short Term Memory Load and Visibility. As all the categories
and types of Softwares are visible so they don’t need to remember the exact product to
use for, they can search the types of the categories of that software that they want.

Universal Usability: Diverse Cognitive and Perceptual Abilities. Decision making and
perceptual (mental load) will be mostly affected by this feature. As we know that by
having this type of categorical distribution, we will be making the use at ease for

28
decision making, and users will easily be able to select from the given options of
categories and types.

Interaction Style: Menu Selection. The selection from the categories is basically like
selecting from a menu. It is like we have been given a menu to select options from and
then using those menu we navigate through the medium and place of work.

Hierarchical Task Analysis:

1. To select the appropriate category.

1.1 User decides what categories to choose from
1.2 Selects the category in which the product belongs
2. Surf through the products of that category

2.1 Look at the apps shown for that particular category

2.2 Choose the most suitable product needed from the category

3. Filtering Contents

Functionality: Along with the categories function we might also need to use a filter, to
get the most visible contents for the user to see and use. We can filter the particular
products based on the size, liking rate, number of people downloaded, the amount of
price etc. This will help users to further narrow down the search option for the
particular type of application/software that they are looking for.

Design Principles:

● Visibility: If the user wants to search something particular then they can filter
some categories out to get the exact application they are searching for, this
works on the user’s visibility part as Users will know what to do next as many
options are available in front of them.

29
 ● Support Internal Locus of Control: Again same as categories, the user will feel
like everything is under their control and they can control the applications that
they want to search or they are looking for, which will make users feel more
confident and ease fullness to use the website.
● Cater for Universal Usability: All types of users can use this feature as it is
self-explanatory and it comes with every step to go through and experience, so
the third design principle that will go hand in hand in this one can be used as
this one.

Universal Usability:

Diverse Cognitive and Perceptual Abilities: Decision making and perceptual (mental
load) will be mostly affected by this feature. As we know that by having this type of
Filter distribution, we will be making the use at ease for decision making, and users
will easily be able to select from the given options of filters and types.

Interaction Style: Menu Selection. The selection from the categories is basically like
selecting from a menu. It is like we have been given a menu to select options from and
then using those menu we navigate through the medium and place of work.

Hierarchical Analysis:

1. To select the appropriate Filter options .

1.1 User decides what size of the app to choose from
1.2 Selects the Price range of the app in which the product belongs
1.3 Select the ratings for the app you want to see
1.4 Select number of downloads the app has

4. Search a Product

Functionality: As a very first step, users will search for a software or web app by its
name. Now, this product(software or web app) may be available on certain operating
systems like Windows, Linux, Macintosh or on all of them. Therefore, the search option
provides information regarding availability of that product on the respective operating

30
system. On the other hand, this option will also display related (similar products to be
precise) products which users can find useful.

Design Principles:

1. Visibility: Once a user searches for any product, he is provided with a wide range
of products related to his/her search. Thus, the user knows what to do next i.e.
according to the requirement, it becomes easy for the user to make a decision as
various choices are available to the user.
2. Reduce Short Term Memory Load: The search history will be stored in the
database and recent searches will be displayed every time a user searches for a
product. Users tend to research a product before actually installing it in their
computer and in this process users search the same product frequently in order
to get a gist of the product. So this visibility of recent search will drastically
reduce the short term memory load as the user doesn’t need to type in the
product everytime he/she wants to search for it.

Universal Usability:

Diverse Cognitive and Perceptual Abilities- As discussed above, by having this feature,
we will be making decision making easy as users have a lot of choice to choose from.
Also the display of recent searches uses the concept of knowledge of results and
feedback. In addition, users will learn about the related products they weren’t aware of.

Interaction Style:

1. Menu Selection: The search feature turns out to be very useful for novice and
intermediate users as it has a clear structure of decision making as all possible
options for given search are present at one time.
2. Natural Language: User searches in english language (usually) which will be
converted into machine understandable language. Therefore communication
between the user and the machine is done with the help of natural language.

Hierarchical Task Analysis:

1. To search for the appropriate product.

31
 1.1. User decides vivid range of products to choose from
1.2. Selects a particular product
2. Surf through the products
2.1. Look at the searched app or similar to the searched one
2.2. Choose the most suitable product needed from the given choices

5. App Overview

Functionality: To give users a brief introduction about the application/software and

help them to download the app. This will help the user to get a brief idea about the
software/application, what the app signifies and if the user needs to get the app or not.
Moreover, if the user feels like the app is useful for them from the overview then they
can download freely just by clicking the button Download.

Design Principles: Support Internal Locus of Control. Experienced users strongly desire
the sense that they are in charge of the interface and that the interface responds to
their action. If they know much about the software then they understand that the
situation is under their control and they can control the interface and decide if they
want to download the software or not.

Universal Usability: Cultural and International Diversity. Here, this functionality will
have icons, buttons with proper colors and designs. This will also depend on the
personality of the user, as the user will also get the overview of the app and with the
images of the software, so according to his/her personality the user will feel if it is
suitable for them or not.

Interaction Style: NA

Hierarchical Task Analysis:

1. Analyze the Overview of the application

1.1 Check the ratings descriptions
1.2 Check reviews from other users

32
 2. Download the App

2.1 Press at download button

3. Navigate the directory where you want to download the software

6. Download

Functionality: To download any software on their device, the user has to click on the
download button. After clicking on the “Download” button, the software will start to
download and in between the process the user can also cancel the downloading either
by directly clicking on the “Cancel” button or canceling from the “Downloads” in the
navigation bar of google chrome.

Design Principles:

● Cater for universal usability: The error message prompted by the system
includes the explanation of that message and what actions should be performed
in order to solve that error. This feature helps both the novice users and the
expert users.
● Permit easy reversal of actions: Suppose by any chance, if the user clicks on the
download button, then he/she can cancel the download by clicking on the cancel
button.

Universal Usability:

Diverse Cognitive and Perceptual Abilities: There are various reasons when a user is not
able to download the software on his/her device such as internet issues, insufficient
space issue, etc. But in the Software Hub website, if the user is trying to download any
software but not be able to because he/she has not sufficient space in their device then
the system will prompt the error message giving the reasoning behind that error
message.

Interaction Style: NA

Hierarchical Analysis:

1. Download an Application/Software

33
 6.1. The user clicks on the “Download” button.
6.2. If the space is insufficient, then the system will prompt the error message
otherwise it will start downloading the software.
6.3. After download is completed, navigate to the directory where you want to
store the software.

7. Help

Functionality: This feature is a documentation component of our website (“Software

Hub”) that explains the features of the website and helps the user understand its
capabilities and functionalities. It provides a detailed description of every feature that
a user needs to understand to use the website comfortably and effectively. It includes
documentation articles for how to install and uninstall the softwares? How to manage
accounts? How to get started with the website? How to ask for help from the
community? etc.

Design Principles:

1. Cater for Universal Usability: This feature is helpful for a diverse range of users.
It has a detailed explanation for novice users on how to use it. Users who are
new to our website or who are used to using it have different interface
preferences. Help feature clearly specifies the details according to what users
know and what they need to know about the website to use it.
2. Affordance: The Help feature clearly defines the website’s possible uses and how
it can or should be used. It prompts the user on what can be done with a specific
feature or option available in the website.

Universal Usability:

Diverse cognitive and perceptual abilities: The users will be able to identify and process
the information given in the Help feature with their prior knowledge and capabilities
and will be able to perform actions accordingly. It will also help the users to learn
every detail of the website through this feature.

Interaction Style: NA

34
Hierarchical Task Analysis:

1. A new user trying to install a software

1.1. The user creates an account or signs in to an existing account.
1.2. The user clicks on the navigation bar.
1.3. The user clicks on the option of “Help”.
1.4. The user selects the options of “Install and Manage Apps”.
1.5. The user reads the documentation with a step by step guide of how to
install software.
1.6. The user can follow the procedures to install the software he or she
wants.
1.7.
2. User is facing an issue and wants to contact the team.
2.1. The user creates an account or signs in to an existing account.
2.2. The user clicks on the navigation bar.
2.3. The user clicks on the option of “Contact us”.
2.4. The user fills in the details in the fields “First Name”, “Last Name”, and
“Email”.
2.5. The user writes the issue with an explanation in the box.
2.6. The user clicks on the “Submit” button.

8. Launch Application

Functionality:

In this page logged in users can view their updated apps. Also there is an option called
launch application. If a user wants to add more applications than the user can launch
their new application. If the user clicks on the launch application then the user can
view a new page then the user can upload a new app from their device and then they
can publish it. Now the system will store this application and now other users can
download this application.

35
Design Principles:

1. Reduce Short Term Memory Load- The user need not to memorize the no. of web
apps he/she Published. System shows all that information. So this feature
reduces short term memory load.
2. Support load focus of control: The user has full control over: what to publish in
the launch application page, what to remove, what to keep. So the users feel
more comfortable as they feel in control of the interaction.

Universal Usability:

1. Diverse cognitive and Perceptual Abilities: If the user does not remember which
application/software he or she has Uploaded. They can see all past uploaded
applications into the launch application page.
2. Personality Differences: The users with different personalities have different
likes and dislikes in terms of Publishing what software, games and applications.
They can launch their products on our website.

Interaction Style:

Direct Manipulation: Users can view the representation of the number of apps updated
in the past by users. Also users can launch their application from their device.

Hierarchical Task Analysis:

1. Launch Application

1.1 Check your Updated apps

1.2 View your number of apps below your profile

2. Click On Launch Application Button

2.1 System will allow the user to publish the app

2.2 Users have to select the application from their device.

2.3 User select publish button

36
9. Bank Details

Functionality: In Bank details we added the features like My wallet, Withdraw, Top up
wallet, Account setting and help. My wallet takes the information about our account
balance, User can check their available balance into that. With the help of the
Withdraw option, users can withdraw money from our account. Top up wallet shows
the information about our past balance history. In account settings users can set the
information of our bank account. Also users can update it. In the help option User can
search their problem and they can use the solution.

Design Principles:

1. Support Internal Locus of Control: Users can store the data of their accounts and
the system will store it in the database, And the Top up wallet page system will
show the details of users’ information.
2. Visibility: In the help center option users can search any problems in that
regarding the account and system will help for that. So here the system guides
users for account related information.

Universal Usability:

1. Cultural and International Diversity: In this feature there is the option of

amount in numeric digit so users know what amount they want to withdraw and
after that system will store this information.
2. Diverse Cognitive and Perceptual Abilities: Here User knows how much amount
they will achieve for uploading their apps. So the system will show the result in
the form of information in the top up wallet option.

Interaction Style:

1. Menu selection: Users can write the account information in account settings so
the system can show the data of the account into my wallet and top up the
wallet option.

Hierarchical Task Analysis:

37
 1. 1.1 In the Account settings option users can set the information about account
number name and phone number.

1.2 Now system will store into the database

2. 2.1 The top up wallet system shows the past history of the account so the user
can refer to it.
3. 3.1 Now users can withdraw money through the withdraw option.

3.2 If user get stuck somewhere then they can go to help option

3.3 User search the problem.

3.4 System will show the result.

10. Payment Option

Functionality: If some apps/software are paid then people can pay for the app/software
and they can install it on their device. Here in the dashboard there are some paid apps.
In the app there is category type and price of app/software. If the user clicks on the
Buy App option then the user will show the payment option. So users can pay for the
app using a bank account or credit card option. So users can install the app/software on
their device.

Design Principles:

1. Support load focus of control: The user has full control over: what to buy in the
payment option page, So the users feel more comfortable as they feel in control
of the interaction.
2. Visibility: so here the more the user installs, the more the user knows the review
of the apps/software. So ultimately prioritizing the user more on these aspects.

Universal Usability:

1. Personality Differences: The users with different personalities have different

likes and dislikes in terms of buying what software, games and applications.
They can buy their products from our website.

38
 2. Diverse cognitive and perceptual abilities: The users will be able to identify the
app/software they want to download from our website.It will also help the users
to learn every detail of the app/software through this feature.

Interaction Style:

Menu Selection: Users can select any apps/software from our website. And also there is
a facility to pay from credit card or bank account. So it is like a selection option.

Hierarchical Task Analysis:

1. Click on the dashboard.

1.1 User can see all software and apps

1.2 Users click on any app/software.

2. System shows the app/software price

3. Now user click on Buy app page
4. System shows payment page

4.1 user can pay with credit card or bank account option

4.2 users can close the page if they don’t want to buy this app/software.

11. Wishlist

Functionality: To allow the users to create their own personalized collections of

softwares and applications they want to download and save them in their user account
for future reference. If the user does not want to download the software currently or
immediately but he or she may want to do so in the future then they can keep those
softwares in their wishlist and can download it later from there.

Design Principles:

1. Support load focus of control: The user has full control over: what to add in the
wishlist, what not to add, what to remove, what to keep. So the users feel more
comfortable as they feel in control of the interaction.

39
 2. Design Dialogues to yield closure: When the user adds any item in the wishlist,
the system prompts the message of “Software Added to Wishlist”. This makes it
clear for the user whether the action has been completed successfully or not.

Universal Usability:

1. Diverse cognitive and Perceptual Abilities: If the user does not remember which
software he or she has to download i.e., cannot remember the name then, the
user can look into their wishlist if they had saved that software in their wishlist.
2. Personality Differences: The users with different personalities have different
likes and dislikes in terms of downloading what software, games and
applications. They can save the softwares as per their interest in the wishlist.

Hierarchical Task Analysis:

1. Adding and item in the wishlist

1.1. Searching for the software in the search bar
1.2. Clicking on any software will open its review
1.3. Click on Add to Wishlist
1.4. The system will prompt the message of “Item Added to Wishlist!”.
2. Downloading an item from the wishlist
2.1. The user opens “My wishlist”.
2.2. The user selects the software from the collection.
2.3. The system will redirect the user to the APP/Software review of the
selected software.
2.4. The user clicks on the Download button.
2.5. The system will start the download and install it once finished
downloading.
3. Removing an item from the wishlist
3.1. The user hover over the software that they want to remove
3.2. The user clicks on the close button that appear after hovering
3.3. The software will be removed from the wishlist.

12. Changing Appearance

40
Functionality: This feature is mostly used to have a great variety of designs that the
user can interact and play with like colors, font style, font size etc. This feature is great
for diversity as some of the people may like calm and light appearance and some may
like dark and bold themes for the site that they are used to with. People are generally
happy to use products in which they feel like they control the parameters and factors
in their hands.

Design Principles:

1. Support Internal Locus of control. Here, Experience users strongly desire the
sense that they are in charge of the interface and that the interface responds to
their action. So by letting them change the whole appearance of the site the user
may feel that the whole situation of the design is under their control and they
might feel empowered by that.
2. Another, Principle is Visibility so here the more the user sees, the more the user
knows what to do next in the context of this. So ultimately prioritizing the user
more on these aspects.

Universal Usability:

1. Cultural and International Diversity. In different countries and different

cultures different colors might be used to convey something different, not only
colors but also the font of the text and also its size. So giving users different
options to change the theme/style of the site, we can create cultural and
international diversities so everyone can adjust them according to their liking
and convenience.

Interaction Style: NA

Hierarchical Task Analysis:

1. Open the Options of Appearance

1.1 Go to Menu
1.2 Click on settings
2.2 Click on Appearance

41
 2. Change the Color

2.1 Choose the Specific color among all the colors

2.2 Click the color and press apply

3. Change the Font style and size

2.1 Choose the Specific Font style and size

2.2 Press apply

4. Save the changes

2.1 Press Save Changes

2.2 Exit Settings menu

13. Language Option

Functionality: To allow users to choose their preferred language using the multi
language support feature. It helps the user to use our website irrespective of the
language or location.

Design Principles:

Permit easy reversal of actions and Reduce short term memory load: Suppose the user
has changed the language to any other language which he or she may not know about.
For this case, there is an option of “Change to default language” (which will be written
in english) and clicking on this option will reverse the language settings to english
language.

Universal Usability:

Cultural and International Diversity: The users with different linguistic backgrounds
can use the website in their language. All languages have different character and
numbers format, they may have some special characters compared to other languages.

Diverse Cognitive and Perceptual Abilities: Language communication and

comprehension has been achieved here.

42
Interaction Style: Menu Selection: The user reads from the list of items, selects the
appropriate language and observes the effect of it. This style is helpful for the novice
users as they don’t have to add their preferred language by any other means, they just
have to choose from the list.

Hierarchical Task Analysis:

1. Changing to other language

1.1. Go to Settings
1.2. Click on Languages
1.3. Select the language you want to change to from the list given
1.4. Click on Change
2. Changing to default language (English)
2.1. Go to Settings
2.2. Click on Languages
2.3. Click on Change to default language

14. Notifications

Functionality: A notification is essentially a message that gets displayed outside the

app store’s UI to provide users timely information about the app. Users can tap the
notification directly to get an overview of the latest available feature of the app. If the
user chooses to push (close) this notification, then the user can view this notification
anytime by clicking on the active notification icon displayed on the top search bar of
the app store. By any means, users will land on the notifications page and will be able
to see how old the notification is and what actions can be taken accordingly.

Design Principles:

1. Strive for consistency: Notification feature of our app store resembles

notification feature of any other commonly used web application which makes it
easier for users to learn and use this feature. Also there’s consistency between
the notifications feature of current and previous versions of the app store.
2. Offer informative feedback: If a user has already read the notification by
clicking on a notification displayed outside of app’s UI then that particular

43
 notification won’t appear in the active notification section. Hence according to
the user action, the notification feature provides informative feedback and
updates the notification page.

Universal Usability:

Diverse Cognitive and Perceptual Abilities: Communication between user and the
application is efficiently managed and enhanced by notification features. Decision
making and perceptual (mental load) will also play a major role. For example, unless
the user decides to close the notification, it will remain there on the notification page
thus reducing the mental load on the user.

Interaction Style:

Natural Language: The basic function of Notification feature is to communicate with

users regarding app’s functionality using a language that user can understand well so
the essence of Natural Language interaction style can be seen.

Hierarchical Analysis:

1. User clicks on the notification pop-up (which will be displayed outside the app
store’s UI) or on the active notification icon.
1.1. User decides whether to take required action or ignore the notification or
push the notification.
1.2. User takes the required action.
1.3. Notification is cleared from the notification page.
2. User decided to push the notification
2.1. Notification remains on the notification page for user to have a look at it
anytime.
3. User decided to close/ignore the notification
3.1. Notification gets deleted and will not be displayed on the notification
page.
15. Profile Editing

Functionality: Many times there is a need to update the user profile. User profile
section of the application contains all the basic information about the user. Personal

44
Information like User name, Gender of the user, Email address, Mobile number etc are
some of the fields present on the user profile page. Now, if a user wants to edit/update
any of this information, he/she can do that with the help of the Profile option present
in the settings.

Design Principles:

Prevent Errors: In order to make changes in personal information, users need to click
on the respective “Edit” button otherwise, the user is not allowed to make any changes
to any data field without clicking “Edit”. Note the red(prohibition) sign gets displayed
whenever the user hovers over a particular field which means the user is prohibited to
make direct changes to any of the entry data fields. That first user has to click on
“Edit” then only the user will be allowed to update the data fields and consequently
save the updated fields.

Universal Usability:

Cultural and International Diversity: As visible in the profile page, all the data fields
are culturally diverse in the sense that their input values format is such that users
from any continent could get an idea of what information actually the profile page
requires. For example, in the mobile number field, first of all the user is prompted to
enter their country dial code and accordingly the user’s country is determined.

Interaction Style:

Form fill-in: On the profile page, the user needs to fill-in the details into the blank
space when required. Here all the fields except (gender which is a general field) is more
or less specific to the user like first and last name of user, email address, contact no
and so on. So using menu-selection will come out to be a bad choice. Thus form fill-in
is the most appropriate interaction style for the profile editing page.

Hierarchical Task Analysis:

1. Open the Options of Profile.

1.1. Go to Menu
1.2. Click on settings

45
 1.3. Click on Profile
2. Edit the Username
2.1. Update first name or last name or both
2.2. Click the save button
3. Edit Gender field
3.1. Choose the Specific gender with the help of radio button
3.2. Press save button
4. Edit the email address
4.1. Update existing email address
4.2. Click the save button
5. Edit the mobile number
5.1. Update existing email address
5.2. Click the save button
5.3. Enter Updated mobile number
5.4. Click the save button
6. Edit the residential address
6.1. Update address field wherever needed
6.2. Click the save button
7. Save the changes
7.1. Press Save Button or press Cancel Button
7.2. Exit Settings menu

16. Update/My Softwares(Apps)

Functionality: Lists all the installed web apps and softwares. Shows how many of those
installed web apps or softwares are upto-date and how many of them require an update.
The user can also sort apps/softwares by recently updated category. The user can
update multiple apps/softwares at the same time with the help of available multi select
options.

Design Principles:

46
 1. Consistency: Consistency can be seen in terms of options available on update
pages like “Updated”, “Updates Available”, “Sort by Recently Updated”. This
option ribbons with the options available on the update page of other app stores
like play store and apple store.
2. Reduce Short Term Memory Load: The user need not to memorize the no. of web
apps he/she installed. Therefore this feature reduces short term memory load.
3. Offer Informative Feedback: As soon as a user chooses to update specific apps
and it gets updated, the update page is updated with the latest information. It's
kind of real time update feedback for the user.

Universal Usability:

Diverse Cognitive and Perceptual Abilities: Perceptual (mental) load is reduced as

installed apps are listed to help users make decisions like whether to update or
uninstall the app/software. Sort by recently updated takes in feedback from the user
and outputs the result accordingly.

Interaction Style:

Menu Selection: This feature is useful for users of all types (novice, intermediate,
expert) as it has a clear structure of decision making as all installed web apps/
softwares are present on the same page simultaneously.

Hierarchical Task Analysis:

1. Search for the list of installed web apps/softwares.

1.1. User gets gist of whether the installed app is latest version or update is
required
1.2. Sort installed web apps by recently updated category
2. List of web apps/softwares with updates available.
2.1. Choose to update app
2.2. Choose to uninstall the apps if not of user’s need anymore

4.2 Screen photos

47
1. Website Statistics

2. Categories

48
3. Filtering Contents

49
4. Search a Product

50
5. App Overview

6. Download

51
 [If storage is sufficient]

[If storage is not sufficient]

52
7. Help

53
54
55
8. Launch Application

56
9. Bank Details

57
58
10. Payment Option

59
11.Wishlist

60
61
12. Changing Appearance

62
63
13. Language Option

64
14. Notifications

65
15. Profile Editing

66
67
68
 16. Update/My Softwares(Apps)

CHAPTER 5: DIFFICULTIES ENCOUNTERED AND

RESOLVED

5.1 Description of debugging/trouble-shooting

Past transaction error: when a paid transaction is forgotten by a user or an operator or

an institution the history of the payment helps the user to remember its paid
transaction. It gives better facility to the user for getting the memory of the
payments. The issues of forgetting or losing the memory of the payment could be
easily solved by this feature.

69
Device Maintenance stopped: When there are too many background apps generating
cache files, the phone's performance is affected. For this issue, google play store
provides the functionality of device maintenance where the user can clear the
unnecessary cache and data. The play store sends error messages of “Storage is full”
due to this problem of cache files. Similar errors are faced in laptops and PC’s too.
When a user’s device has not sufficient storage then he or she cannot further download
any software/application and their device performance gets also affected. In this case,
they have to delete some data in order to create space for new softwares. It may be
possible that the user does not know which softwares is too large in size and that takes
up most of the space of the device. To resolve this difficulty, we have provided the
“Device Maintenance” option under “Settings”, where the user will be able to choose
the option of “Clear up the Storage”. Clicking on this option will show the list of all
the installed softwares and applications with their sizes. The user will be able to sort
them by their date of installation and by their sizes as per choosing from the following
options:

● Newest on top
● Oldest on Top
● Sort by size - ascending
● Sort by size - descending.

Search Optimization:

Sometimes users would not know about the exact product so they would search the
description of what the application is needed to do. However, if they write a description
and search they are not able to find the application, these difficulties can be resolved
by adding all the contexts of the descriptions and reviews of the application in the
search menu. So if the searched item is available from any app’s description or review
given by any other user, then the search results will show that particular app which
would fit the criterias of what users are looking for.

Efficient updates:

70
Many times, an app notification pops up regarding the latest updates or some offers for
the user and if the user fails to click on that notification popup then that notification
is lost forever, it will not be displayed again. Sometimes due to this kind of app setting
users lose the opportunity to get the latest updates. So the notification feature of this
app store is such that even if somehow the user fails to click on the notification popup
in the moment, the user will find that particular notification on the notification page
and thus updates are managed efficiently.

CHAPTER 6: REAL LIFE IMPLEMENTATION

PERSPECTIVES

6.1 Details of problems you may encounter for real life

implementation and its proposed solutions

Clickbait Problem: Whenever a person tries to download any app or game from the
website, there is always a fear of clickbait. All the people are getting very much
disturbed by this problem. To give a solution to this problem we could give
verification symbols to the application, so that the user never gets disturbed by the
problem of clickbait.

Issues sent to the help community: When the user faces any issue while using the
website, he or she can ask the help community regarding the issue. The user will write
the issue in the description box after finishing all the steps of “Ask the help
community” and the system will give some troubleshooting steps and guide to resolve
the issue. In this case, it will be difficult for the system to show a specific
troubleshooting guide based on the description. At the same time, it will also be
difficult for the users to find the particular guide that will be helpful to them. To
resolve this issue, we can add the functionality that will provide the guide based on the

71
keywords from the description of the problem. That is, the system will show all the
troubleshoot guides that include that keyword for the problem.

Lack of New Applications:

If users want to download the new latest versions of the application, then they would
have to wait for sometime in order to physically update the apps by the owner. As from
the admin side, the apps are not automatically uploaded and updated, they are done
manually so there would be some delay to upload an application which is new in the
market or the new updates of the existing application. So for this reason, users would
have to wait for a few times, even a few days to get the latest features of the
application available officially. So to resolve this issue, what we can do is that we can
link our website to google play’s dataset for all the applications we have from there.
Similarly, we will link all the websites from which we have taken our application’s. As
soon as the original website updates, we can automatically upload the newest version
of the application and that would be very quick and instant.

All solutions at one place : It’s commonly observed that particular

applications/softwares which is available on one app store won’t be available on other
and so users have to go through more than one app store in order to find that one
application he/she wants to download and this consumes a lot of time of the user. We
have tried to resolve this problem by accumulating all the available applications at one
place (ie, at Software Hub). For example, any Mac software and any Linux software will
be available at the same place to download so that users don’t need to traverse through
one application store to find a Mac app and another application store to find Linux
app/software.

72
 CHAPTER 7: REFERENCES

Shneiderman, B., & Plaisant, C. (2010). Designing the user interface: Strategies
for effective human-computer interaction. Boston: Addison-Wesley.

Preece, J., Rogers, Y., & Preece, J. (2007). Interaction design: Beyond
human-computer interaction. Chichester: Wiley.

Olmstead, K., & Atkinson, M. (2015, November 10). An Analysis of Apps in the
Google Play Store | Pew Research Center. Pew Research Center: Internet, Science
& Tech; www.pewresearch.org.
https://www.pewresearch.org/internet/2015/11/10/an-analysis-of-apps-in-the-goo
gle-play-store/

73