Portfolio
ESCULPTA
Responsive Design for Local Business - Desktop, Tablet, and Mobile
Create a responsive web design for small local business allowing user to learn about body sculpting procedures, book appointments, and review information for service provider.
My Role
UX / UI Designer
Tools Used
Scope
8 weeks
1 project
PROJECT OVERVIEW
Esculpta is a small business that opened just few months ago. They are offering body sculpting procedures with special equipment. Business works with small team of two professionals.
Goal is to create responsive design for desktop, tablet and mobile where potential client will be able to:
-
Learn about procedures and services provided
-
Book appointment
-
Find packages and promotions for services
-
Learn about business and providers
About Me.
PAIN POINTS
-
Esculpta is a very small business that needs easy way for people to book their appointments. With only two people they experience a challenge booking appointments and synchronizing calendars.
-
Potential clients should be able to easily go to Esculpta website or mobile application and get information on what services are offered and how they can benefit from it.
-
Existing or new clients should be able to see pricing and read about Esculpta to give them more clarity about business.
-
Booking appointment online with few clicks is essential for client and business. Synchronizing business and personal calendar will allow both client and service provider to keep track of their appointments.
-
Adding phone, address, and social media links will help client/user to reach out to provider fasted and determine if they are at best convenient location for them.
RESEARCH
COMPETITIVE ANALYSIS
USER INTERVIEWS
3 people interviewed
Ages 25-65
1 week research
Booking online is preferrable and showing phone and location is a must.
Expectations from provider is to be experiences and be able to explain procedure well.
Customers want to understand description of services when going online.
Most people prefer to call, and next to be able to book appointment online.
All of the participants want to look better and feel better.
Search for body sculpting performed mostly in Google and location near by is a priority.
All people interviewed showed interest in trying new technology for anti-cellulite treatment.
All ages expressed concerns with having cellulite.
Pricing and time commitment with this type of procedures are main concern.
Website or mobile application should allow customer to book appointment quickly at their convenience
How offered this procedure can be beneficial for customer and online feedback important.
Understand body sculpting procedures and view provider qualifications.
SURVEYS FINDINGS
8 people interviewed
Ages 25-65
People who have booked body sculpting treatment in the past have done it online. 25% of people are booking by calling business
When choosing business one of the main factors to consider it is location.
75% of users when going to business website are searching for services first. Videos showing services provided helps them understand procedures better.
When searching social media about body sculpting services 87.5% would go to Facebook first, then Instagram, followed by Twitter and LinkedIn.
100% of users will search for body sculpting services online first, before they consider social media.
In terms of what information user wants to see on a body sculpting page first 62.5% answered Pricing. This is followed by 3 other categories: video for services, book appointment online, and about us section.
In terms of what information user wants to see on a body sculpting page first 62.5% answered Pricing. This is followed by 3 other categories: video for services, book appointment online, and about us section.
12.5%of people who got surveyed mentioned that credentials about provider on About Us section is also important to consider business.
USER PERSONAS
THE SOLUTION
-
Responsive Website for desktop, tablet, and mobile describing all services provided by Esculpta.
-
Simple and easy to understand descriptions with videos to help user understand content and visualize what has been described as service.
-
Call to action for booking appointment.
-
Complete personal information - name, email, phone, and message.
-
Choose best day and time and book appointment on the spot.
-
Review rates for services provided as well as special promotions and packages. Transparent pricing for easy booking.
-
About Esculpta - providers information and qualifications, information about business.
-
Contact information for business - address, phone, and social media information. Will show on bottom of each screen.
PROJECT GOALS
-
Promote business and services provided.
-
Offer easy way to book appointment and send message to business.
-
Provide transparent pricing.
-
Attract more customers by offering different services.
ESCULPTA
Stay connected thru social media.
Give and receive feedback.
Keep track of appointments on calendar.
Transparent pricing and services.
COMMON
-
Search for services provided.
-
Learn more about Esculpta services and find pricing.
-
Book appointment - choose date and time.
-
Learn about professionals at this location.
USER
Responsive website for desktop, mobile and tablet.
Promote business and services provided.
Book appointment.
Connect thru social media.
Location, and contact information.
TECHNICAL
AFFINITY MAP
After interviewing my participants, I sorted through all my recordings and notes to make an affinity map and discover prevalent themes.
SITEMAP
Site Map helped to visualize the whole idea in prospective.
Site map became guideline on how to build the website and what categories to focus on.
USER FLOWS
The user flow below shows two paths:
1. User searching for information about services provided by Esculpta.
2. User booking appointment online.
TASK FLOWS
Task flow showing screens for Book appointment and Find pricing for services provided.
User should be able to easily perform this task and book appointment at day and time convenient for them.
LOW FIDELITY WIREFRAMES
STYLE TILE
HIGH FIDELITY WIREFRAMES
-
Landing page will show briefly what Esculpta is and what it has to offer with a call to action button to prompt user to book appointment.
-
Sections on the landing page will be divided by type of services provided with short explanation of each service.
-
One of the services will be supported with a short video about the procedure.
-
Footer will contain map with business location, phone, and email for contact and hours of operation.
-
Book appointment page will have two versions - one showing user successfully completing all fields and booking appointment.
-
And second one showing missing information prompting user to go back and complete missing information.
-
The Pricing page page showing Pricing for all services will be separated in boxes showing each service with picture and price next to it.
-
Staying in separate boxes will help visually user to distinguish between services and prices. Boxes and bubbles will be used for better visual presentation.
-
About us will have three separate sections. First one will show providers and their credentials.
-
Second one will be showing pictures of business.
-
Third one will be displaying business values and goals and will prompt user to book appointment with call to action button.
USABILITY TESTING
Testing Parameters
I conducted the usability testing with 10 participants who are customers using body sculpting procedures already. he goals for my usability testing were to:
Evaluate the user's ability to navigate through the website and be able to gather information needed for services provided
Is the website intuitive and simple to navigate? Does the navigational structure of the website align with customer/user expectations? Are the features easily findable?
​
Identify any confusion or problems users may encounter during usability testing
Is there any confusion or difficulty while completing the task flows?
​
Find out what users think of the website redesign and updated visual branding
What do users think of the visual design – the updated images, typography, and layout of the website?
USABILITY TEST RESULTS
01
What worked
1. Home page is most liked and users are leased with how it looks and information they can find.
2. Booking appointment is clear and easy with call to action button after each service.
3. More about business is easy to find and understand and learn about providers and business in general.
02
What didn't worked
1. Video not indicated well as such and more difficult to recognize from pictures.
2. Booking appointment does not specify type of service booked, but allows message to be send with appointment.
3. Back button on Appointment screen should change label and indicate Back to Services or Back to Shopping.
4. Contact us and Social Media more visible.
5. Possibly bottom Navigation bar for Mobile and Back button.
6. Menu button on top smaller.
03
Recommendations
1. Change Play/Pause button to a bigger size in middle of video.
2. Add option for services to be chosen.
3. Change labeling of Back Button on appointment page.
4. Create additional space on About Us page for contact.
5. Add Navigation Bar on bottom of mobile screen.
6. Adjust button size.
ITERATIONS
After analyzing my results and taking into consideration user recommendations, I made priority revisions to the design as follows:
-
Play Button on Video made bigger for better visibility.
-
On Book Appointment page Drop Down Menu for services to be chosen was changed from text to picture with text responding to service. Menu opens in separate page allowing user better viability when choosing service options.
-
Removed bubbles around text for better visibility and cleaner look.
-
Change labeling of Back Button on appointment page.
REFLECTION
Outcome
ESCULPTA responsive web design for desktop, laptop, and mobile was created as a pro-bono project for small startup local business. They are interested in considering design for the website. At this point they do not offer all services provided and business is too small they will need more time to determine type of machines and procedures that will be offered. Business struggled with starting and financing. They will contact me back when ready to start and offer services described above.
If I had more time
I would like to find out how website can support business by allowing appointments booked online to go directly to preferred calendar on mobile or email for business owner. This way business owners will have all of their calendars with appointments synchronized and make better planning of their days.