You are on page 1of 55

BAKERY APP DESIGN (UX/UI RESEARCH)

PROJECT REPORT

Submitted by

NIKHILESH PP (201ME162)
ADHITYA R (201ME102)
AJAY N (201ME103)

In partial fulfilment for the award of the degree


of

BACHELOR OF ENGINEERING

in

MECHANICAL ENGINEERING

BANNARI AMMAN INSTITUTE OF TECHNOLOGY


(An Autonomous Institution Affiliated to Anna University, Chennai)
SATHYAMANGALAM-638401

ANNA UNIVERSITY: CHENNAI 600 025

APRIL 2024
BAKERY APP DESIGN (UX/UI RESEARCH)

PROJECT REPORT

Submitted by

NIKHILESH PP (201ME162)
ADHITYA R (201ME102)
AJAY N (201ME103)

In partial fulfilment for the award of the degree


of

BACHELOR OF ENGINEERING

in

MECHANICAL ENGINEERING

BANNARI AMMAN INSTITUTE OF TECHNOLOGY


(An Autonomous Institution Affiliated to Anna University, Chennai)
SATHYAMANGALAM-638401

ANNA UNIVERSITY: CHENNAI 600 025

APRIL 2024
BONAFIDE CERTIFICATE

Certified that this project report “Bakery App Design (UX/UI Research)”

is the bonafide work of “NIKHILESH PP (201ME162) and ADHITYA

R (201ME102) and AJAY N (201ME103)” who carried out the project

work under my supervision.

Dr. Kumaresan G Mr. Santhosh Kumar S

HEAD OF THE DEPARTMENT SUPERVISOR

Professor Assistant Professor Level III

Department of Mechanical Department of Automobile

Bannari Amman Institute Of Technology Bannari Amman Institute Of Technology

Submitted for Project Viva Voce examination held on ………………

Internal Examiner I Internal Examiner II


DECLARATION

We affirm that the project work titled “Bakery App Design (UX/UI
Research)” being submitted in partial fulfilment for the award of the degree
of Bachelor of Engineering in Mechanical Engineering is the record of
original work done by us under the guidance of Mr. Santhosh Kumar S,
Assistant Professor Level III, Department of Automobile Engineering. It has
not formed a part of any other project work(s) submitted for the award of any
degree or diploma, either in this or any other University.

NIKHILESH PP ADHITYA R AJAY N


(201ME162) (201ME102) (201ME103)

I certify that the declaration made above by the candidates is true.

(Signature of the Guide)


MR. SANTHOSH KUMAR S
ACKNOWLEDGEMENT

We would like to enunciate heartfelt thanks to our esteemed Chairman


Dr.S.V. Balasubramaniam, and the respected Director Dr. M.P. Vijaykumar,
and the respected Principal Dr. C. Palanisamy for providing excellent facilities
and support during the course of study in this institute.

We are grateful to Dr. Kumaresan G, Head Of the Department,


Department of Mechanical Engineering, for his valuable suggestions to carry
out the project work successfully.

We wish to express our sincere thanks to Mr. SanthoshKumar S ,


Assistant Professor Level III, Department of Automobile Engineering, for
his constructive ideas, inspirations, encouragement, excellent guidance and
much needed technical support extended to complete our project work.

We would like to thank our friends, faculty and non-teaching staff who
have directly and indirectly contributed to the success of this project.

NIKHILESH PP (201ME162)

ADHITYA R (201ME102)
AJAY N (201ME103)

I
ABSTRACT

Our purpose is to create the best and efficient user interface for a vehicle
selling application through our study and research in UI - User interface, UX -
User experience. One of the main features in this application is to be used by
various people without any age restriction varying from age 20-70 approximately.

This abstract provides a concise overview of the UI/UX research conducted


for the development of a mobile application aimed at facilitating vehicle selling
transactions. The study explores the user interface and user experience aspects of
the application to ensure its effectiveness, ease of use, and overall satisfaction for
both sellers and buyers.

The research focuses on gathering insights from potential users, analyzing


their preferences, and incorporating them into the design process. By employing
a user- centered approach, the study aims to create an intuitive, visually appealing,
and efficient mobile application that enhances the vehicle selling experience.

To conduct the research, a combination of qualitative and quantitative


methods was employed. User interviews, surveys, and usability testing were
conducted to gather data on user preferences, expectations, pain points, and
desired features. The collected data was analyzed to identify common patterns,
challenges, and opportunities for improvement in the existing vehicle selling
process.

II
Through the research, several key findings were identified, including the
importance of clear and comprehensive vehicle information, intuitive search and
filtering options, user-friendly navigation, and a seamless communication system
between buyers and sellers.

The UI/UX research conducted for the mobile application for vehicle
selling app serves as a foundation for creating an optimized platform. The
application meets user expectations, maximizes user satisfaction, and facilitates
successful vehicle transactions in an efficient and user-friendly manner.

Keywords: UX/UI research , Mobile application’s effectiveness, User -centered


approach, User friendly navigation.

III
TABLE OF CONTENTS
CHAPTER TITLE PAGE
NO NO
ABSTRACT II
LIST OF FIGURES VI
1. INTRODUCTION 1

1.1 BACKGROUND OF THE WORK 1

1.2 MOTIVATION 2
1.2.1 IMPROVEMENT OF USER EXPERIENCE 2

1.2.2 SECURED MESSAGE AND COMMUNICATION 3

1.2.3 TRUST OF CONSUMER 3


1.2.4 PERSONAL BUYING RECOMMENDATION 3

1.2.5 THE DEALER AND SELLER PROMOTION 4

2. LITERATURE SURVEY 5

3. OBJECTIVES
3.1 PROBLEM IDENTIFICATION AND OBJECTIVE 10

3.1.1 SIMPLIFIED VEHICLE SELLING USING UX 10

3.1.2 ENHANCING UX USING USER RESEARCH 11


PROCESS
3.1.3 THE DEVELOPMENT OF THE UI 11

3.2 FLOW DIAGRAM OF THE PROPOSED WORK 12

3.2.1 USER EXPERIENCE 13

3.3 SELECTION OF THE COMPONENTS OR TOOLS 13

3.4 METHODOLOGY 14

3.4.1 COMPETITOR ANALYSIS 14

3.4.2 USER PERSONAS 16

3.4.3 EMPATHY MAP 17

3.4.4 USER JOURNEY MAP 18

3.4.5 USER FLOW 19

IV
3.4.6 INFORMATION ARCHITECTURE 20

3.4.7 WIREFRAMES 21

3.4.8 LOW& HIGH-FIDELITY PROTOTYPE 21

3.4.9 USER TESTING 23

3.4.10 IDEATE PROCESS 24

4 PROPOSED WORK MODULES

4.1 USER REGISTRATION AND AUTHENTICATION 25

4.2 THE LISTING MODULE 25

4.3 PERSONA DEVELOPMENT 26

4.4 THE PROFILE MODULE 26

4.5 INFORMATION ARCHITECTURE 27

4.6 THE SEARCH AND FILTERS 27

4.7 REVIEWS AND RATINGS MODULE 27

4.8 THE VEHICLE DETAILS 28

4.9 USER TESTING ITERATIONS 28

5 RESULTS AND DISCUSSION

5.1 RESULTS 30

5.2 SIGNIFICANCE OF THE WORK 35

5.3 COST BENEFIT ANALYSIS 36

6 6.1 CONCLUSION 37

6.2 SUGGESTIONS FOR THE FUTURE WORK 37

REFERENCES 38

APPENDICES 40

V
LIST OF FIGURES

S. NO TABLE OF CONTENTS PAGE


NO

1. FIG 1. THE FLOW DIAGRAM OF THE WORK 12

2. FIG 2. THE LOW FIDELITY PROTOTYPE 31

3. FIG 3. THE MEDIUM FIDELITY PROTOTYPE 32

4. FIG 4. HOME PAGE 33

5. FIG 5. BUY PAGE 33

6. FIG 6. WISHLIST PAGE 34

7. FIG 7. SELL PAGE 34

8. FIG 8. ACCOUNT PAGE 35

9. FIG 9. INFOEMATION ARCHITECTURE 41

10. FIG 10. USER FLOW 42

VI
CHAPTER - I
INTRODUCTION

The goal of the mobile app for a bakery app is to develop a simple and
approachable platform that connects customers with bakery products. The objective
is to make the purchase and selling of vehicles more convenient and effective for
all parties. To create an app that offers the best user experience possible for
consumers, UX/UI research looks deeply into the needs, preferences, and pain
areas of users.

1.1 Background of the Work:


Thorough research as well as consideration for the user experience (UX)
and user interface (UI) design are required when developing a mobile application
for a bakery app. Understanding the target audience, researching the competition,
mapping user journeys, and developing prototypes for testing and iteration are all
part of this process. The objective is to provide an intuitiveand effective platform
that supports seamless transactions between customers and the bakery by
focusing on usability, visual appeal, mobile responsiveness, and security. To
create a successful mobile application that satisfies the requirementsof both users
and the bakery industry, we will investigate the essential facetsof UX/UI research
in this project.

In this stage, we thoroughly research the target audience to understand their


behaviors, motives, and pain points. Important research techniques include:

• Surveys are compiling numerical information on consumer preferences,


characteristics, and usage trends.

1
• Interviews are to better understand the needs and challenges of potential
customers, one-on-one interviews with them are conducted.

• Analyzing rival applications for the sale of pastry to determine advantages and
disadvantages.

• Persona development is the process of creating fictitious user profiles to


represent various user groups.

To provide straightforward navigation and a clear user flow, a well-


organized Information Architecture must be created. This stage contains:
Specifying the app's structure includes grouping user profiles, search filters, and
vehicle listings. Creating low-fidelity prototypes of an app's interface and user
interactions is known as wire framing. User Flows: Outlining the detailed
workflows users will utilize to execute tasks. The thorough user testing with actual
users is carried out to validate the final design and address any lingering problems.
This stage contains: A/B testing: comparing different interfaces for the software
to see which works best. Qualitative user feedback is gathered through surveys or
interviews. Performance testing: Making sure the app runs effectively and
smoothly on different devices.

1.2 Motivation:
1.2.1 The improvement of user experience:
In recent years, the advent of mobile applications has revolutionized various
industries, including the food industry. Bakery food ordering apps, designed with
a focus on user experience (UX) and user interface (UI) principles, have emerged
as a popular choice for both consumers and businesses. These apps offer
numerous benefits and advantages, making them a valuable tool for bakeries
looking to enhance their customer experience and streamline their operations.

2
In order to ensure happiness, trust, and a higher possibility of successful
transactions for all parties involved, it is essential to improve the user experience.

1.2.2 Convenience and Accessibility:


Bakery food ordering apps provide customers with the convenience of
placing orders anytime, anywhere, using their smartphones or tablets. This
accessibility eliminates the need to visit the bakery in person, saving customers
time and effort. The app's intuitive UI makes it easy for customers to browse the
bakery's menu, select items, customize their orders, and make payments, all within
a few taps. This convenience enhances the overall user experience and encourages
repeat business.

1.2.3 Enhanced Customer Engagement:

Bakery food ordering apps enable bakeries to engage with their customers
more effectively. Through push notifications and personalized offers, bakeries can
keep customers informed about new products, promotions, and discounts,
increasing customer engagement and loyalty. The app's UI can be designed to
showcase the bakery's brand identity, creating a memorable and immersive
experience for customers. This branding helps to strengthen the bakery's
relationship with its customers and differentiate it from competitors.

1.2.4 Improved Order Accuracy and Efficiency:

By using a bakery food ordering app, customers can ensure the accuracy of
their orders. The app allows customers to review their orders before finalizing
them, reducing the likelihood of errors. For bakeries, the app streamlines the order
management process, reducing the time and resources required to process orders
manually. This efficiency not only improves the bakery's operations but also
enhances the overall customer experience by ensuring timely delivery of orders.

3
1.2.5 Data-driven Insights and Analytics:
Bakery food ordering apps collect valuable data about customer preferences,
order history, and behavior. This data can be used to gain insights into customer
preferences, identify trends, and tailor offerings to meet customer needs. By
analyzing this data, bakeries can make informed decisions about product
offerings, pricing, and marketing strategies, leading to increased sales and
profitability.

1.2.6 Data-driven Insights and Analytics:


Bakery food ordering apps provide a cost-effective platform for marketing
and promotions. Through the app, bakeries can promote special offers, discounts,
and loyalty programs, attracting new customers and encouraging repeat business.
Compared to traditional marketing channels, such as print or broadcast media,
app-based promotions are more targeted and measurable, allowing bakeries to
track the effectiveness of their marketing efforts and adjust strategies accordingly.

4
CHAPTER – II

LITERATURE SURVEY

2.1 A Systematic Review on user Experience in Mobile Application Design


Among Senior Citizens
Xu Chen et al presents a review of user experience (UX) in mobile
application design among senior citizens. Mobile applications are not always
adapted to the special needs of senior citizens. Studies have also found that a good
UX design can better promote the physical and mental health of senior citizens,
however, more research needs to be conducted about what senior citizensneed and
expect from the UX elements in mobile application design. The results of the
study show, there are many types of mobile applications designed for enhancing
senior citizens’ well-being, and the most used application among seniors is
“Health”. It also identified “Usability” as the most frequently used UX element
based on the findings in the SLR analysis, and the commonly used tool for testing
mobile applications is “SUS.”

Mobile applications can be used as an effective instrument in different


user groups. It also has some key benefits for senior citizens such as providing
safety and security, healthcare, socializing, and entertainment, improvement of
the quality of life of elderly people. However, research also indicated that limited
attention has been given by the designer to develop mobile applications for
seniors, and the specific needs of senior citizens with mobile applications are not
satisfied.

5
2.2 User Interface Design & Evaluation of Mobile Applications

Najwa Samrgandi addressed in this paper is the evaluation of user interface


(UI) design for mobile application prototypes. The authors recognize that user
interface evaluation is essential for creating user-friendly and effective interactive
systems. However, there are challenges in conducting human experimentation for
UI evaluation, and there is a need to find alternative methods that are more
accessible and cost- effective. The solution proposed in the paper is to explore the
use of game development as a platform for teaching UI validation. Game testing
is like UI evaluation in that it assesses the user experience and enjoyment of the
game. By leveraging the cross- disciplinary nature of game development courses,
the authors suggest that the structure of these courses can be described and
teachers can be instructed to incorporate user testing into their curriculum. This
approach provides a way to teach students how to evaluate UIs and improve
usability in a wide range of fields. Overall, the paper aims to answer the question
of how to evaluate user interface design for mobile application prototypes by
considering game development as a teaching platform for UI validation and
exploring various UX evaluation methods. The research emphasizes the
importance of usability and user experience in interface design to create effective
and user-friendly applications.

2.3 UI/UX design prototype for mobile community-based course

Yanfi Y et al investigated the design of a mobile prototype for a community-


based non-profit organization, particularly the Personal Evangelism course at the
Catholic Church of Mary Mother of Carmel in Jakarta. The prototype aims to
manage communication and course activities between members.

6
The study utilizes the Task- centered User Interface design method, which
involves four phases: user identification, requirements, design solution, and
walkthrough evaluations.
The evaluation is conducted in natural settings with users, using the use
questionnaire to measure usability aspects. The results show high levels of
satisfaction, with usability aspects for usefulness, ease of use, ease of learning and
for Satisfaction. The study highlights the importance of user interface and user
experience for non-profit organizations and emphasizes the need for better UI/UX
design in this context.

2.4 UX work in software startups: A thematic analysis of the terature


Jullia Saad et al explored how User Experience (UX) is adopted in software
startups, considering the unique challenges and opportunities they face. The
objective is to investigate the relationship between software development
practices and UX in startups. The methodology involves mapping relevant
literature on UX work, software engineering and startups.

Thematic analysis is performed on this literature, identifying seven themes


related to challenges, opportunities, and practices associated with UX in startups.
The findings suggest that startups need a UX approach that aligns with their
dynamic and disruptive nature. Additionally, the paper proposes open research
questions to further explore the adoption of UX in software startups and promote
its evolution in this context. Startups are young, rapidly expanding businesses that
offer cutting-edge goods or services. They are crucial to the growth of a nation,
and many of them work in the software industry.

7
Despite the acknowledged importance of User Experience (UX) in software
development, companies frequently struggle to embrace UX approaches due to a
lack of funding. The purpose of the study is to examine the connection between
UX in startups and software development techniques. It conducts a review of the
literature and a thematic analysis to find possibilities and problems for UX in
software startups. According to the findings, startups need UX strategies that
reflect their dynamic nature. Along with bridging the gap between UX and
software startup literature, the report also poses open research issues.

2.5 Effect of User Interface and User Experience on Application


M A T Pratama et al investigated UI is a link that connects human and
computer interaction, where users will interact with computers or machines to
complete tasks. It stated that the User Interface (UI) is part of a system that acts
as an intermediary between users and systems that facilitate users to interact with
the system efficiently. End-users when using the system physically, perceptually,
and conceptually contact the user interface. The purpose of the User Interface is
to make users effectively control the computer or machine that interacts with
them.
To deal with this complexity, good interaction between the user and the
system is needed. When playing games, it is said that the interaction of a player
affects the psychological of the players. The development of the user interface is
an important task for the design and development of the system. The development
of a user interface is difficult to be process because it is difficult to understand the
characteristics of users and the tasks they do with the system. Besides, the use of
icons on the user interface influences the delivery of information.

8
Hence, the good nature of UX is that it is contextual and subjective. The
purpose of this study is to determine how much influence the User Interface and
User Experience have on the sale of the application by observing the editor's note
two applications and compare it objectively. This research used a descriptive
method.

2.6 Evaluating on User Experience and User Interface (UX/UI) of a app


which is Mobile Web Energy Monitoring System
Kristine Mae P.Escanillan et al investigated mobile web application
prototype was designed and developed where consumers can monitor the energy
consumption of the home appliance using their smartphones through the mobile
website of the system. The prototype was implemented and the mobile web
application user interface of the prototype was evaluated through usability testing
to asses for its effectivity, efficiency and user satisfaction.

From the analysis of the data, it was found out that EnerTrApp mobile web
application user interface is effective as all tasks were completed by all
participants. It is efficient based on the time-base efficiency measure and overall
relative efficiency. Statistical data shows that testers as satisfied with the user
mobile web app user interface. Based on the results consumers and will likely use
and recommend the mobile web application as a tool to help reduce energy
consumption in their household.
The paper discusses the development of a mobile web application called
EnerTrApp, designed to help consumers monitor their home appliance's energy
consumption. The study aimed to evaluate the usability of the application's user
interface through usability testing and assess its efficiency, effectiveness, and user
satisfaction. The goal was to determine if the application would be effective in
reducing energy consumption in households. The research focused on addressing
the problem of high energy consumption in the Philippines and aimed to provide
a solution through the EnerTrApp mobile web application.

9
CHAPTER - III

OBJECTIVES

3.1 PROBLEM IDENTIFICATION AND OBJECTIVE:


The goal of our Bakery mobile application's is to improve the user interface
and user experience (UX). On doing, it makes the simplified process of ordering
the bakery products and it will enhance the user experience while using it. The
Survey proposed that the application will not convenient for the senior citizens
for using and to overcome that our application is designed in a way with the
implementation of user research. Our application will be focusing on the end users
with irrespective of the ages and then the enhanced UI part of the application is
designed in a way to enhance the usage of the application. The integration of user
feedback system is introduced within the application to improve the user interface
and the research for the enhancement of user satisfaction.

3.1.1 Simplified Ordering Process Using UX:


The manner that bakery products are purchased has been transformed
through user experience (UX) design, which has made the procedure easier and
more effective. The creation of user-friendly mobile applications and internet
platforms is a crucial component of this streamlined bakery process. These online
marketplaces make it simple for sellers to connect their products by including
details like Kitchen name, mail, mobile num, address and FSSAI License Number.
Easy uploading of excellent images and thorough descriptions improves the user
experience overall. These platforms provide consumers with robust search and
filter options, making it simple to choose snack that fit their needs.

10
3.1.2 Enhancing User Experience using User research Process:
The organization success can be determined mainly with the customer
satisfaction in every point and here in this sector it can be achieved by conducting
the user research and several process. In that we can able to identify the need of
the customer in every aspect. The filters for Veg and Non-Veg, Price range and
Home kitchen all were given to enhance the smooth experience. The UX of selling
pastry items now routinely integrates with outside services. The platform can
easily add tools that help customers make informed selections, such as previous
orders and it’s data. The platform's enhanced communication features have also
made it easier to negotiate and complete transactions. Owners may simply get in
touch with consumers with inquiries or offers, and consumers can anticipate
responses quickly. Systems for secure messaging and notifications keep all parties
updated and involved during the process.

3.1.3 Focusing on the development of the UI:

The UI is the important factor while designing an application and so it can


able to create a direct impact on the User experience and the application successin
the market. An appealing user interface encourages consumers to explore ads and
communicate with vendors for longer periods of time. More successful orders and
improved conversion rates may result from this increased interaction.

The ability to iteratively improve the user interface allows developers to


continuously collect user feedback. Regular updates can take care of problems,
eliminate bugs, and offer new features that suit user preferences. By classifying
listings of bakery, making filters available, and offering a clear hierarchy of
information,

11
may make the app's navigation simpler. To assist users in finding the bakery items
they want fast, provide robust search facilities with filters and sorting choices,
including location-based search.

To successfully exhibit their products, dealers should be encouraged to


provide high-resolution pictures. The necessity to provide a user- friendly,
competitive, and reliable platform is what motivates the advancement of UI in apps
that sell bakery items. Increased user engagement, higher conversion rates,and a
stronger market position can result from routinely improving the user interface
based on user feedback and market developments in the food sector.

3.2 FLOW DIAGRAM OF THE PROPOSED WORK:

The Flow diagram for the work to be carried out in the development of the
project,

Fig 1. The Flow Diagram of the Work

12
3.2.1 User Experience:
We included all facets of user engagement, such as feelings, perceptions,
and reactions. An efficient job completion rate, a smooth and intuitive user
interface, and a feeling of satisfaction and joy are the hallmarks of a good UX.
User research, user interface (UI) design, usability testing, and ongoing
improvement are essential elements of a good UX. To effectively develop
solutions that address user demands, UX designers strive to understand user needs,
behaviors, and pain spots. They concentrate on creating user-friendly, aesthetically
pleasing, and simple to use interfaces. User-centered design is given priority in a
successful UX, ensuring that the product or service is in line with user expectations
and goals. In the end, a strong UX results in greater user pleasure, customer loyalty,
and the accomplishment of corporate objectives.

3.3 THE SELECTION OF THE COMPONENTS OR TOOLS:


The Range of tools are required for Designing our application for both the
process of the UX and then the UI parts. The tools which have been used in our
UX part are the Sketching Tools, Wire-framing Tools, Prototype tools and User
testing tools. All of these are open-source software with free version and the
premium version is also available which consists of the additional features.

The Sketching Tools are early idea generation and short concept sketches,
tools like pen and paper or digital sketching programs like Sketch or Adobe XD
are frequently utilized. The Tools for wireframing are Software for wireframing,
the look and feel of an app. Prototyping Tools where we constructed interactive
prototypes to evaluate user flows and interactions using prototyping tools such as
Figma.

13
We have tools for User Testing and the Websites like Usability Hub and user
testing make it easier to conduct remote user testing and get user feedback for our
application. The tools which have been used for the UI process consists of the UI
Design Software, Icon Design Tools, Collaboration and Prototyping Tools,
Animation tools and Color, Typography Tools and then the UI component libraries
and with the Version control Tools were used in the industry.

Here the High-fidelity UI designs are made with the aid of graphic design
software, such as Adobe XD, Sketch, Figma, Adobe Photoshop, and Adobe
Illustrator. The Icon Design Tools are to create unique icons or to access icon
collections, specialized tools like Adobe Illustrator are employed. The
Collaboration Tools are Real-time collaboration between designers and team
members and stakeholders is made possible through collaboration platforms like
Figma and Sketch Cloud. Prototyping and animation functions are also available
in some UI design tools for the creation of dynamic UI elements and transitions.

The Tools for choosing and managing color palettes and typography such as
Google Fonts and Adobe Fonts. The UI Component Libraries are for quicker
development, pre-designed UI components and patterns are made available by
libraries like wire frame kit in Figma.

3.4 METHODOLOGY:

3.4.1 Competitor analysis:


Competitor analysis evaluates a company's competitors strategically in the
marketplace. It includes determining and assessing competitors' advantages and
disadvantages, market share, pricing tactics, line of business, and customer base.

In our application we took several brands for the analysis and derived the
solutions with certain factors and in that the advantages and dis-advantages of the
competitor were analyzed.

14
Businesses can obtain a competitive edge by understanding their competitive
environment, spotting chances for difference, and making wise decisions. It is
essential for product creation, market positioning, and overall business strategy.
The process where the user experience will begin from finding competitors and
we can start this process by locating both direct and indirect market rivals. While
direct rivals provide comparable goods or services, indirect rivals could utilize
alternative strategies to meet the same customer needs.

The Benchmarking process we analyzed of websites, mobile apps, and user


interfaces of rivals to learn about their design decisions, features, and user
experiences. The User Experience Assessment evaluate the usability, navigation,
content presentation, and overall aesthetics of rival products to determine how
well they meet user needs. Pay close attention to the information architecture, user
flows, and user interface components. We need to compare our product's features
and functionality to those of your competitors' offerings. Determine any product
differentiation opportunities or gaps in your current offering. Analyze the content
on rival sites to determine the value and caliber of the information.

On implementing it we can have the benefits and the rise in the organization’s
business. The User-Centered Design is what rivals are doing well or poorly
enables designers to rank user preferences and demands. The Inspiration in
examining the designs of rival products can spark original concepts and
inventive solutions for your own creation. On finding best practices in the
research for the business or market that you may implement into your UX design.

15
The Competitive Advantage always look for ways to set your product apart
from that of competitors by addressing their weaknesses. The Risk Reduction on
Avoiding potential dangers by studying the errors and user complaints of your
rivals. On Validation process we can benchmark your design choices against those
of successful rivals to ensure their validity. It will Gain understanding of how your
product stacks up in terms of user experience to assist you better define your
market positioning.

3.4.2 User Personas:

The User personas we implemented have the following major functions like
Humanizing people means personas which will give your target audience a face,
which helps design teams relate to and comprehend people on a more intimate
level. The next thing was the Focus and Alignment they ensure that team members
have a common understanding and are working to address the needs of the same
user groups.

User Personas which we derived serves as a representation of the priorities


and preferences of distinct user groups, which aids in the informed decision-
making process throughout design and development.

The Problem-solving assist in pinpointing potential user annoyances and


difficulties so that teams can proactively solve them during the design phase.
The Solutions is Personas make it possible to develop user-centered designs by
customizing features, information, and interactions to satisfy the individual
requirements of various user groups.

In this process we collected the details with the data and this plays a major
role in determining each process and with this we can able to make many things
in the development of the application.

16
3.4.3 Empathy Map:
In our User Experience (UX) design process, an empathy map which we
derived is a useful tool for developing a deeper knowledge of the feelings,
thoughts, and actions of the target audience. Usually, it takes the form of four
things, namely “Says, Thinks, Does, and Feels.” The “Says” focuses on the user's
spoken expressions of requirements, ambitions, and so forth.

This aids designers in recognizing specific user feedback. The “Thinks”


reveals their worries, drives, and aspirations and almost like their inner thoughts.
This helps to comprehend the user's perspective. To get insight into how a user
interacts with a product or service, “Does” analyzes the user's activities, including
their behaviors, habits, and routines. The "Feels" is the user emotions, such as their
annoyances, joys, concerns, and desires, assisting designers in understanding state.
The Benefits of using the Empathy map in the Designing of the application were
Empathy maps ground the design process in the viewpoint of the user, promoting
a more user-centric approach.

We promote empathy and a closer bond with the target market by


encouraging designers and stakeholders to put themselves in the position of the
user. Empathy maps are a useful visual tool for bringing teams and stakeholders
together to develop a common understanding of the wants and needs of users. The
feature of Problem-Solving in Empathy maps assists design teams in coming up
with solutions that specifically address user issues by identifying places of delight
and areas of pain.
In our application the empathy map phase contains the certain points or
questions for accessing the feelings and other things in the mapping journey and
that provides the ideas to depict the several user emotion and that will help in
designing of frames in the application.

17
3.4.4 User journey Map:
To visually portray a user's interactions and experiences with a product or
service across numerous touchpoints, our user journey map is an essential tool in
our User Experience design process. It offers a thorough account of the user's
experience, highlighting their behaviors, feelings, and problem areas as they
interacted.

Our user journey map includes, the stages of the user's user journey, are
awareness, research, purchase, and post-purchase, are represented by these forms.

The Touchpoints are the times or platforms when a user interacts with a
product or service, like a website, an app, or customer care. The User Actions
describes the duties, objectives, and decisions that the user makes at each
touchpoint. Finally, the user emotions are the documents of user's attitudes,
feelings, and perceptions at each stage. There are some positive cases on using the
user journey maps are User journey maps make ensuring that the design process
centers on the user's point of view, producing more user-centric solutions.

Building Empathy thing gives the visualizing user's experience, they


encourage empathy among us and the stakeholders, resulting in more empathetic
and user-centered decisions. The Problem identification in user journey maps
highlight bottlenecks and pain points, giving designers a clear direction for design
improvements.

The Journey map phase in our application are the Login and snack page and
connect and schedule process and also logout page where assessed the points of
the customer thoughtsand what does the customer do and their feelings and the
needed ideas for the improvement of the application.

18
3.4.5 User Flow:
Our user flow is the one which depicts the path a person takes while
navigating through a digital product or service, is an essential part of the User
Experience (UX) design process. It gives a step-by-step breakdown of how a user
interacts with a system, outlining their options, actions, and answers from the
system.

There are several things which we will need to be known while using the
user flow and they are the Representation, Navigation, Decision Points,
Validation and Optimization. The User flows are often Represented as diagrams
or flowcharts, where each action or interaction is related to the one before it
visually, forming a logical flow. From the user's entry point (such as a landing
page) to their end point (such as ordering snack), they lay out the user's path using
Navigation. The User flows Decision points, such as when users click links,
buttons, or enter information, and display the several directions they can go in the
app.

In our application user flow is carried out from the user personas from that
we can depict the imaginary data and the flow of the user as per the application
needs. Here it starts from the login page and then it moves to the homepage after
the successful login. In this we can able to predict the flow of the common user
throughout the application and then it flows to the other features as per the choice
of the user. The others features and details of the user flow were shown in the
Fig.10.

19
3.4.6 Information Architecture:
A key component of our User Experience (UX) process, Information
architecture (IA) focuses on how information is organized and structured within a
digital product or website to improve user understanding and navigation. It
contains of several divisions namely Content Organization, Navigation Design,
Search Functionality and Hierarchies and then User Centered Design, Scalability.
To make information easily available and logically organized, we categorized,
sorted, and labeled using a system called content organization.

Navigation Design is the one where we choose the menus, links, and
navigational pathways that lead users through the features and information,
making it simple and effective. In our app the simplicity plays a major role.

In our application the IA implemented with the welcome and login page and
then the flow moves to the landing page after the completion of login and security
process. In the home page we can able to see main features and from that we can
access anywhere in the application as per the user needs. Each of the menus and
the options has the separate functionalities and that are clearly shown in Fig 10.

The flexibility to scale up or down as material expands or user needs


change. By facilitating users' ability to easily discover what they need and
complete their tasks, a well-executed information architecture offers a user-
friendly and effective digital environment. This improves user experience and the
entire flow of the IA shown in Fig 10. In the snack page where we can able to
explore the snacks by the search and filter option and the bakery listings with the
previous snack recommendation system. It has a location feature and then the
connect screen provides the preferences of using as Consumers or shops and then
the Schedule screen provides the option to schedule the snack items for a week
and then the payment confirmation is followed by it.

20
3.4.7 Wireframes:
Our Wireframes are the Visual blueprints which gives the Structure and
Layout of the application which helps the Designers and the organization an idea
about it while building the application. There are several facilities where the
wireframes are made with the changes like Structural Framework and Functional
Planning, Iterative Design, Communication Tool and then User- centered design.
Wireframes provide a structural framework for a digital product by indicating
where important components such as buttons, text, graphics, and navigation menus
should be placed.

The Functionality Planning are concentrated on usability and user flow issues
by focusing on functionality and layout rather than aesthetics. The Iterative Design
in Wireframes make quick revisions and iterations possible, enabling designers to
test ideas and improve user interfaces without spending money on high-fidelity
images.

Our wireframes are a communication tool that, by giving a clear visual


representation of the planned layout and functionality, assist close the gap between
us and development teams as well as stakeholders. A positive user experience is
supported by the product's structure and flow thanks to user- centered design,
which uses wireframes to match the design with user requirements.

3.4.8 Low& High-Fidelity Prototype:


In our design process we created visual representation of our app’s
interface and interactions at the names called fidelity. There are two types of
fidelity namely, Low and High-Fidelity Prototype.

21
Our low-fidelity design are the ones with simplistic, rudimentary depictions
of the app's interactions and user interface. They are mainly employed for concept
development and preliminary idea research.

These are Simple sketches, wireframes, or digital mockups with little to no


detail are frequently used in low-fidelity designs. Without using specific colors,
fonts, or images, they concentrate on layout, content arrangement, and rough
shapes. In the end, Low-fidelity designs are simple to make, encourage creativity
and brainstorming, and make it simple to adjust depending on user input.

Our High-Fidelity Prototype are the app's UI is more perfected and detailed
in high-fidelity designs. They are utilized for testing, development, and
stakeholder presentations because they closely resemble the final product. The
Specific colors, fonts, graphics, and interactive features are all part of hi-fidelity
designs.

The visual identity and user interactions of our app are realistically
portrayed by us. The Hi-fidelity designs assist stakeholders and developers in
visualizing the finished product, ensuring design of our app and conducting user
testing to obtain accurate feedback.

We frequently begin the UI design process for mobile apps with low-
fidelity sketches or wireframes to explore concepts before eventually moving to
high-fidelity designs as the project develops. The flexibility, early user testing,
and easier transfer from concept to development are all made possible by this
iterative methodology.

22
3.4.9 User Testing:
We tested the final and foremost process of our application and making
it into the market and it is an essential phase in the UX/UI design process that
assesses the usability and overall user experience of a digital product by
incorporating actual users in the evaluation. The Purpose of this process is to gain
direct feedback from the target market about how well our mobile app works and
how our targeted users liked it.

It can able to Find flaws and discover any flaws with the app’s usability,
navigation, or other aspects of the user experience. It can verify if our design
complies with user expectations and needs by validating design assumptions. On
gathering Information, we can learn more about the preferences, behaviors, and
pain points of our targeted users as they related to the app we made.

We Re-Designed some of the wireframes iteratively by using user


feedback, we changed to that design which improved the user experience. There
are some key steps in which it needs to followed while user testing and they are
Planning, Recruitment, Test Execution, Analysis, and Iterative Design. The
Planning establish the goals and decide who the target demographic is and develop
user scenarios or tasks that test subjects will complete. The Recruitment process
will select participants who are representative of the target market for the product.
We tested 5–10 participants are enough to identify significant usability problems.
Execution of the test involves assigning users to carry out predetermined tasks
while a moderator monitors and makes notes.

23
Actions, remarks, and suggestions made by participants are noted. Analyze the
data gathered during testing to find recurring problems, usability problems, and
areas of success. The Iterative Design make changes to the design based on the
findings. This can entail alterations to the design, navigation, content, or
functionality.

The Advantages of user testing will be using user comments and preferences
to inform design decisions is known as user-centered design. The Issue
Identification in the Early design phase, difficulties with usability and possible
barriers are discovered. The Improved User Satisfaction, Engagement, and
Retention and Enhanced usability and the Cost savings on preventing issues from
arising during product development and support will save money.

3.4.10 Ideate process


In this process the solution for the problem is identified through the
proposed modules features and understanding the user’s behavior and needs,
psychologically through conducting research and we provide minimalist design
by following the design patterns in the application. The implementation of the
features for the application is discussed in modules sections.

24
CHAPTER-IV

PROPOSED WORK MODULES

INTRODUCTION:
The primary goal of our suggested work module is to undertake in-depth
UI/UX research for a mobile application created for ordering bakery items.
Mobile applications are essential in today's digital age for simplifying the process
of ordering food. To draw in and keep people, an interface must be both user-
friendly and aesthetically pleasing. To assist in the design and creation of a
successful and user- centric mobile app for bakery item sales, this module will
examine consumer demands, preferences, and pain areas. The modules are into
several components and they follow.

4.1 USER REGISTRATION AND AUTHENTICATION:


The platform like vehicle selling, user registration and authentication are
essential parts of our mobile application. User registration entails the construction
of unique profiles where users can enter their preferences, contact information,
and other vital personal data. We provided protection of user data depends heavily
on secure authentication techniques. This includes choices for logging in with
their email address and password, which offer a conventional yet secure method
of accessing the app. The onboarding process of our app is also made simpler by
integrating social network logins, which enables people to join up fast using their
pre-existing social profiles. In addition to improving user ease, this registration
and authentication combination creates a secure and reliable environment for both
bakery owners and consumers within the app.

4.2 THE LISTING MODULE:


Our application's one of the feature is bakery listings module, which
enables users to efficiently create, amend, and maintain listings. Owners may
highlight their bakery by uploading images, writing in-depth descriptions, and
adding crucial details like price, ratings, time to make the order.

25
This not only makes listings clearer and more detailed, but it also stimulates
consumer confidence. Our module has robust filter and search features that let
customers narrow their search results based on factors like price range, location,
and more to improve user experience and also it turns into the application's core
by providing a user-friendly platform for both consumers and bakery owners,
delivering a smooth and effective bakery food ordering experience.

4.3 PERSONA DEVELOPMENT:


The User personas we used are fictional characters used to represent different
user segments. It says the initiatives to comprehend and address user groups, such
as car Consumers, Individual shop owners, or home kitchen makers. Building user
personas for these user categories requires creating complete profiles. User
persona development enables the development of detailed user profiles that
represent diverse user segments. Several user personas were developed using
information about actual users that was gathered throughout our research stage.
Each user persona is filled with information such as demographics, goals, pain
points, and behaviors. Our user personas are a crucial tool that mean to create
empathy for our app's targeted audience and make user-centered decisions.

4.4 THE PROFILE MODULE:


On improving the interpersonal dynamics of our application, the user
Profiles module is essential to build a sense of community and trust within the
app, it enables users to establish and manage their profiles by supplying personal
information such names, profile photographs, and contact information.

The module also provides a platform for credibility and transparency by


presenting user ratings and reviews. These evaluations and comments help
potential buyers and sellers make wise judgments by giving important information
about a user's standing, dependability, and previous transactions. Thus, user
profiles play a crucial role in fostering responsible interactions, increasing user
trust, and enhancing the overall experience within the app's ecosystem.

26
4.5 INFORMATION ARCHITECTURE:
To make it simple for users to explore and discover what they need, our
information architecture involves structuring the app's content and structure. The
relationships and hierarchy between the app's various sections are described. It
focuses on creating a logical and user-friendly structure for the app's content and
interface. During this procedure, our app's navigation hierarchy, content
categorization, and information access methods are all defined. Users can quickly
access and interact with bakery and item listings, pricing information, contact
details, and other crucial content thanks to a well- planned information
architecture.

4.6 THE SEARCH AND FILTERS:


Our app’s foundational Search and Filters module enables users to quickly
find their suitable snacks. With the help of important factors like ratings and price
range, location, veg and non-veg and others, this function provides sophisticated
search alternatives. Finding the ideal bakery is quick and precise to the ability of
users to fine-tune their search to focus on preferences.
It also has powerful sorting and filtering features that let users group search
results according to relevancy, cost, cloud kitchen, or other factors, further
optimizing the user experience. This module makes sure that customers can
quickly and easily navigate through the enormous selection of snack, saving time
and increasing the likelihood that they will find the one that suits their needs and
preferences.

4.7 REVIEWS AND RATINGS MODULE:


The Reviews and Ratings module in our app acts as the foundation for trust.
It provides a transparent forum for exchanging experiences by enabling users to
post and access reviews and ratings for both consumers and owners. Users are
given the option to assess the dependability and trustworthiness of possible
business partners thanks to this feedback system.

27
Positive feedback can assist establish a user's reputation and inspire trust in
potential consumers or individual owners or bakery. On the other hand, it also
serves as a precaution because users can make wise choices based on the opinions
of others, encouragingethical and secure transactions. This module is essential for
trust and accountability within the app, which improves user safety and
dependability.

4.8 THE CONNECT AND SCHEDULE MODULE:


In this section the Connect provides the access to register their own shops
promoting the cloud kitchen-business and the individual shops to showcase their
snack items with the required details in it. Next it navigates to the details to register
their shop with the clear-cut details after that details are to be added and the process
is done. Moving onto next the Schedule process provides the option to make our
snack schedule up to certain dates. We need to add and enter the needed baker and
then snack for that day and our address for the delivery and then we can pay that
using the several payment options. This acts a time saving thing for the working
professionals and they can also cancel the day if they want and it significantly
boosting the accuracy of the data offered. This module builds user confidence and
trust by providing a thorough overview of a bakery details and condition,
encouraging secure and well-informed transactions.

4.9 USER TESTING ITERATIONS:


After our initial designs are created, user testing sessions are undertaken.
Based on user feedback and the outcomes of usability testing, we activelyenhance
the app's usability and overall user experience. User testing iterations entail
collecting user feedback while iteratively updating the app's design. After the
initial design concepts are made, usability testing sessions with actual users are
undertaken. The design updates and enhancements made because of the input
from these sessions led to a more user-friendly and effective app.

28
The program is improved repeatedly until it has a high level of usefulness
and user satisfaction. These stands for important stages and actions in the UI/UX
research process for creating a mobile application for ordering bakery items.
Every stage contributes to the creation of software that is user-friendly,
aesthetically beautiful, and simple to access while meeting the needs and
expectations of its intended users. If these specific activities are incorporated into
the UI/UX research module, designing a mobile application for ordering snack
and promoting the business of the shops will be done completely and with the user
in mind. This meticulous method aims to create an app that meets user needs while
also standing out in a crowded market and providing a superior user experience.

The takeaway from the Modules:


The module's objective is to create a user-centered, efficient, and
aesthetically appealing mobile application for the ordering the bakery items and
connecting the cloud-kitchen business and scheduling the snack. We understood
user’s expectations and preferences, evaluating previous experiences, and
continuously refining design, this session will assist in the establishment of our
mobile application in the competitive food sector.
A few activities make up the suggested work module, which aims to create
our mobile app for ordering the items and that meets user expectations, is easy to
use, and stands out in the crowded market. These phases will assist the development
team in producing an app that is not only functional but also appealing to the eye
and usable by a range of users. This all-encompassing approach will help the app
succeed in the very competitive food sector business.

29
CHAPTER-V
5.1 RESULTS AND DISCUSSION :
Thus, the qualitative and quantitative analysis of data from our UX research
which includes competitor analysis, user personas, empathy map, journey map
provided the significant way to derive the low fidelity prototype shown in fig 2
and from the low fidelity prototype it will be helpful to design the final high
fidelity prototype where the main screens are home page shown in fig 6, connect
page shown in fig 7, schedule page shown in fig 8 and profile page and end screen
shown in fig 9.

The below low fidelity prototype shown in the Fig 2 has the free hand sketch
of the screens. In that it starts from the welcome screen of the application where
it moves to the login page and then it has several screens for the login page to
build. It has the voice note icon to know the location of the delivery person and
so the account icon to know the details of the users. It also has the
recommendation system in the below and then it moves to the connect where we
can able to connect with the kitchens directly and schedule page to put the snack
for the several dates.

The High-fidelity prototype shown in the Fig 3-Fig 8 which is implemented


using the Figma Software with limited functionality but has the responsive areas
which gives the interactions and navigation possibilities of our app. Before the
color selection of our app, we implemented grey scale and set of geometric shapes
in medium fidelity prototype which helped us to make right decision in high
fidelity prototype which is shown below,

30
Fig 2. The Low FidelityPrototype

31
Fig 3. Welcome Screen Fig 4. Sign-In Screen

Fig 5. Register Screen

32
Fig 6. Home Screen

In the home page we can able to get our snack and then the filter and search
bar provides the items to get quickly and in below the recommendation is given
based on the previous orders of the consumers. The voice activation icon is given
to know the distance of their ordered items and it helps the aged citizens to know
the arrival time of their orders. The account icon is given in the top where we can
able to know the user details and then the settings and many other options. In the
home screen where the most of the options were placed for the smooth user
experience of the application.

33
Fig 7. Connect Screen

34
The connect screen shown in fig 7 is the page of the app where we can able
to connect the cloud-kitchen based snack and also the individual shops for the
ordering purposes and also they can able to register their shops with the required
details in it and after all the verification the shop is listed to sell their products to
the customers. In that it navigates to the sequence of easy process to list their foods
and other things.

35
Fig 8. The Schedule Screens

The schedule screen shown in fig 8 where we can able to schedule our snacks
for needed dates and if we want to schedule, we need to enter the required details
in that to proceed further and then we can choose the payment method in it and then
we can able to cancel the scheduled snack in the option given below. This screen
will make an impact on the working professional to manage their time and many
things. After this process if we need to logout, it navigates and shows the options
for the end process which is shown in the fig 9 and in that the profile and the logout
screen has been shown.

36
Fig 9. Profile &Logout Screens

5.2 SIGNIFICANCE OF THE WORK:

A mobile application for selling vehicles that is supported by a strong UX/UI


design provides a wide range of important benefits. It offers consumers a very
user-friendly and effective platform, streamlining the listing of bakery and
ordering the bakery items. Features like user reviews, ratings, and thorough recent
ordered items of the user data help to promote transparency and confidence. The
app’s visually appealing UI attracts users and improves the perception of the
brand. It appeals to a wide range of users because to customizable features,
responsive design, and an emphasis onaccessibility.

Additionally, a strong UX/UI positions the app for success by encouraging


user loyalty, offering priceless data-driven insights, and facilitating scalability in
a fiercely competitive market.

37
5.3 COST BENEFIT ANALYSIS:

A thorough assessment of project expenses and potential returns is required


for a cost-benefit analysis for a mobile application intended to promote ordering
of bakery items and its business through an improved user experience and user
interface. The expenses cover hosting, marketing, UX/UI design, maintenance,
and legal compliance. The income, a larger client base, individual bakery and the
cloud-kitchen makers recognition, user pleasure, and competitive advantages are
some of the perks. You can calculate measures like return on investment (ROI)
by estimating expenses, computing present values, and applying discount rates.
The financial viability of the project is indicated by a high ROI, but it is crucial to
take non-financial aspects into account and conduct risk analyses to make an
informed conclusion.

Increased User Engagement will happen due to the enhanced UX/UI can
lead to higher user engagement, more time spent on the app, and increased user
retention. The user-friendly app can improve their reputation of the bakery and
home-kitchen makers and trustworthiness, resulting in attracting more users.

38
CHAPTER-VI
6.1 CONCLUSION :
In this project, throughout the entire process of UX/UI the Interface for the
Mobile Application has been built successfully. This app’s interface is not only
built for ordering the bakery items but also to give a wonderful experience while
using the Application. The creation of a mobile app for ordering a bakery items
and business with a heavy emphasis on user experience (UX) and user interface
(UI) design is more than just developing a website where snack can be bought and
sold by the owners. It is about meeting consumers’ requirements and expectations
while creating a seamless and engaging experience for them. A well-designed
software will increase userpleasure, foster trust, and ultimately help the platform
succeed. This will establisha new benchmark for excellence in the food sector,
becoming the go-to platform for people looking to order the snack and food items
in online.

6.2 SUGGESTIONS FOR THE FUTURE WORK:


On taking this project to another dimension in the real world we can able
to implement the Future Technologies like Chatbot Helpline in the application.
The Chatbots will use AI-driven chatbots and commands to improve user
interactions, making it simpler for users to interact with the app and access
information.

39
REFERENCES

1). Krisnanik E, Rahayu T. UI/UX integrated holistic monitoring of PAUDusing


the TCSD method. Bull Electr Eng Informatics [Internet]. 2021 Aug 1[cited 2021
Sep 26];10(4):2273–84.

2). Nikam M, Gawali I, Khollam V, Lokhande A, Mante J. Online


UI/UXPlatform (Crafter). Int J Sci Res Comput Sci Eng Inf Technol. 2021
May31;483–6.
3). Soumen Chakrabarti, Byron E Dom, S Ravi Kumar, Raghavan, Sridhar
Rajagopalan, Andrew Tomkins, David Gibson, and Jon Kleinberg. Mining the
web’s link structure. Computer, 32(8):60–67, 2021
4).Ying Ding. Applying weighted page rank to author citation networks. Journal of
the American Society for Information Science and Technology, 62(2):236– 245,
2022.
5).Lewis C, Rieman J. Task-Centered User Interface Design: A Practical
Introduction [Internet]. Text. 1993. 190 p. Available from:
http://hcibib.org/tcuid/tcuid.pdf.
6).Loeffler S, Roth RE, Goring S, Myrbo A. Mobile UX design: learning from the
Flyover Country mobile app.
https://www.tandfonline.com/doi/abs/10.1080/17445647.2020.1867247
7). Permana AA, Taufiq R, Ramadhina S. Prototype design of mobile application
‘hydrolite’ for hydroponics marketplace. Int Conf Electr EngComput Sci
Informatics. 2020;2020- Octob(October):45–8.
8).Hariyanto D, Triyono MB, Köhler T. Usability evaluation of personalized
adaptive e- learning system using USE questionnaire. Knowl Manag E-
Learning.2020;12(1):85–105.
9).Karnawan G, Andryana S, Komalasari RT. Implementasi User Experience
Menggunakan Metode Design Thinking Pada Prototype Aplikasi Cleanstic. J
Teknol dan Manaj Inform [Internet]. 2020 Mar 19 [cited 2021 Sep 26];6(1):10–7.
40
10).Setiawan A, Handojo A, Hadi R. Indonesian Culture Learning Application
based on Android. Int J Electr Comput Eng [Internet]. 2017 Feb 1 [cited 2021 Sep
26];7(1):526–35 Available from:
http://ijece.iaescore.com/index.php/IJECE/article/view/6307 Helia VN, Asri VI,
Kusrini E, Miranda S.

11).Modified technology acceptance model for hospital information system


evaluation – a case study. MATEC WebConf [Internet]. 2018 Feb 28 [cited 2021
Sep 26];154:01101.

12). Design Guidelines for Mobile Car Dealership Apps: A User-


Centered Approach”,Authors,”Maria Garcia, David Lee”. 2018 Feb 28 [cited
2021 Oct26].

13). ”Usability Evaluation of Mobile Vehicle Listing Interfaces: A Comparative


Study” is the study’s title. Authors: “James D. Brown and Laura M. White”.

14).Lubis BO, Salim A, Jefi J. Evaluasi Usability Sistem Aplikasi Mobile


JKN Menggunakan Use Questionnaire. J SAINTEKOM. 2020 Mar.

15).Ergonomics of human-system interaction — Part 210: Human-centred design


for interactive systems [Internet]. [cited 2021 Sep 26]. Available from:
https://www.iso.org/obp/ui/#iso:std:iso:9241:-210:ed-2:v1:en.

41
APPENDICES

1. WORK CONTRIBUTION

BATCH MEMBER 1: NIKHILESH PP (201ME162)


• User Research implementation

• Analysis of the User Data

• UI Design with the creation of Prototype

• Creation of the User Flow and the User Testing

BATCH MEMBER 2: ADHITYA R (201ME102)


• User Research implementation

• Implementing Competitor Analysis

• Mapping creation and User personas creation

• User Testing

BATCH MEMBER 3: AJAY N (201ME103)

• Creation of the Information Architecture

• Creating wireframes using Figma

• Low-Fidelity prototype

• High-Fidelity prototype

42
INFORMATION ARCHITECTURE FLOW

Fig 10. Information architecture flowchart

43
USER FLOW

Fig 11. User flow chart

44
CONFERENCE ACCEPTANCE

PUBLICATION PROOF

45

You might also like