User Experience Design | Case Study

Running head: USER EXPERIENCE DESIGN
User Experience Design
Name of the Student
Name of the University
Author’s note

USER EXPERIENCE DESIGN1
Table of Contents
1. Introduction:................................................................................................................................2
2. Strategy Plane Research:.............................................................................................................3
2.1 Product Objectives:................................................................................................................3
2.2 User Needs:............................................................................................................................3
2.3 Agile Methodology:...............................................................................................................3
2.4 Questionnaires:......................................................................................................................4
2.5 User Personas:.......................................................................................................................4
3. The Scope Plane:.........................................................................................................................7
3.1 User Stories and Storyboards:...............................................................................................7
4. The Structure Plane:....................................................................................................................9
5. The Skeleton Plane:...................................................................................................................10
5.1 Wireframes Implementation:...............................................................................................10
5.2 Wireframes Testing:............................................................................................................17
6. The Surface Plane:.....................................................................................................................18
6.1 The Colour Scheme:............................................................................................................19
6.2 The Site Logo:.....................................................................................................................19
6.3 Typography and Fonts:........................................................................................................20
6.4 Implementing UI Prototypes:..............................................................................................20
7. Conclusion:................................................................................................................................25
8. Recommendation:......................................................................................................................25
References:....................................................................................................................................26

USER EXPERIENCE DESIGN2
1. Introduction:
In the current context TreatWithCare is an online beauty parlour which is seeming a great
growth of their business. For this reason, it is important for them to manage their business in an
effective way. For management of the business in an effective way, the TreatWithCare has
decided to develop and design an up-to-date system which will be catering the growing business
needs of them. Customer satisfaction is one of the important aspects of a successful business and
due to this, the TreatWithCare is currently focused on the customer satisfaction. TreatWithCare
is already having an online booking system, but the current system is not capable of providing
proper service to all of the customers as the number of online booking has been increased
rapidly. Thus, to stay ahead against the market competitors TreatWithCare has decided to
improve their existing online booking system. Here, the layout of the existing system will be
improved so that online experience of the customers can be improved. In this online booking
system, there are several of online service and for each of the services the journey of the end
users will be improved.
Figure 1: Five Planes of UI/UX Design
(Source: Created by Author)

USER EXPERIENCE DESIGN3
By designing the user experience the user satisfaction will be improved as there will be
improvements in the product regarding accessibility, usability and pleasure while interaction
with the product will be done. For the user experience design purpose five plane of James
Garrett’s methodology will be used. As per Garrett there are several of decisions of variables
which influences how the overall site will be presented to the users at the end (Pan and Wang
2019). The five planes of the James Garrett are the surface, skeleton, structure, scope and
strategy (Webber 2016). In the following section a brief documentation will be provided reading
UX improving procedure of TreatWithCare.
2. Strategy Plane Research:
In the UX development process the strategy plane is an important part which
demonstrates business objectives and the user requirements (Chung and Ryoo 2017). The
strategy plane includes both of the demand of the organization and demand of the users from the
site.
2.1 Product Objectives:
The current objective of the product is providing online booking system for the users who
are interested to book and appointment in the TreatWithCare. Through this site the user will be
easily able to perform their booking. This website will be easily accessible from the major
devices including computer, iPad and mobile phones. The website will be capable of handling a
large number of users at any instance of time which will make the TreatWithCare more
competitive in the market.
2.2 User Needs:
The main users of this website will be the staffs of TreatWithCare and the peoples who
requires a beauty treatment from TreatWithCare. The staffs of TreatWithCare will be
administrating the available services where the customers will be using this system for booking
an appointment on TreatWithCare. All the services provided by the TreatWithCare will be easily
accessible by the customers and the presentation format of the services should be easily
accessible for the customers.

USER EXPERIENCE DESIGN4
2.3 Agile Methodology:
In the current aspect, agile approach will be utilized for the development of the UX of the
website. There are mainly two reason for using the agile approach. First is that various types of
users are associated with the project and secondly the scope of the project is perfect for the agile
methodology approach (Anand and Dinakaran 2016). In this case, all the requirement of the
project will not be designed and defined and very early of the project, rather than that the project
will be developed by following the iterative schedule. In this type of schedule project related
components will be developed and thereafter they will be deployed one after another (Campbell
et al. 2016). In this way, TreatWithCare will be able to achieve fast access to the market due to
the fact that some of the component of the final product will become functional before full
completion of the project. The agile development method provides another major benefit that is
the UX developers will be able to gather important feedback from the users for their next
iterations. In the agile methodology mainly the continuous loop of Build-Measure-Leann is used.
2.4 Questionnaires:
Customer Questionnaire
Why you use online online beauty parlour websites?
What issue you find most annoying when using online beauty parlour websites?
How much time do you need to complete your request?
What is the perfect online beauty parlour website as per you?
What online beauty parlour websites you are using?
Admin Questionnaire
Do you prefer working from home also?
What are the current drawbacks of processes that are currently being used in treat with care?
Do you prefer working in different desktops?
How would you like to reply to customer concerns?
How would you like to receive customer concerns

USER EXPERIENCE DESIGN5
2.5 User Personas:
Sophie Ashton – Customer
“I need a well-designed and good looking
website that will show me all the services and
products in few clicks”
Customer is the main income of source for an
organization. Customers pay organization for
the service they receive or product they
purchase.
Technical Experience:
- She does not like confusing websites
- She has good knowledge of using
websites
- She can pay through various payment
methods
Personal Information:
Sophie Ashton, 36
- Likes to go to parties
- Likes to photo shoot
- Loves to interact with followers on
Instagram
Responsibilities:
- Communicating with various people
- Doing product promotions on her
social media accounts
- Handling three to four social media
accounts
Values and Fears:
- Always try to look best
- Making new friends
- Gets confused when websites have
poor UX patterns
Goals:
- Be a social media star
- Performing in various events