AN ARTIST-LED TATTOO STUDIO
end-to-end
10 min read
Role: Product Designer
Responsibilities: User Research, Branding, Wireframing, Prototyping, Testing
Timeframe: 3 weeks
OVERVIEW
Note: This project focused primarily on the mobile experience as it's the way in which the majority of visitors would be accessing the website.
INK;BLOT PROJECT is a new tattoo studio in London. They want to setup a website ahead of the opening to allow Instagram followers to book tattoo appointments in advance.
Their team consists of skilled artists with a lot of experience who want the site's interface to reflect that. The branding needs to be professional and modern.
Another focus they highlighted is the process of visiting the website to book an appointment being seamless and easy. They want to maximise conversion through making sure that visitors successfully book and turn into long term customers.
Objective: To create a strong and confident brand presence that immediately lets visitors know they are in the right place. The website must be a pleasant experience for the user, be easily scannable, build trust from the first interaction, and set high expectations for the in-person appointment through showcasing the artists' previous work.
RESEARCH
The research focused on what influences people when choosing a tattoo studio.
Competitive Analysis: Tattoo studio reviews, competitor websites, and social media interactions revealed that people mainly value visual hierarchy, clarity around the booking process and what to expect afterwards. I researched both successful and unsuccessful competitors to get a clear understanding of what their strengths are, as well as where they came short. The results were as follows.
The good: On average, websites that balanced user experience and visual clarity belonged much bigger and more successful tattoo studios. They made the visitor feel at home and guided them through every step of the way in a clearly designed yet subtle manner, leading to more successful bookings.
The bad: While visually strong, many sites lacked clear guidance, often sacrificing the user's experience to pack more features — this explains why many users said they feel overwhelmed.
Many visitors who would've have a good tattooing experience if they decided to book were likely turned away very early on which is the exact opposite of the desired effect.
The ugly: Some sites lacked a spark on the design side that would keep the visitor engaged and entice them to learn more. Some of them didn't showcase their artists' work on their site at all, instead trying to redirect visitors via external links. The lack of available information confuses the user and fails to build their trust. This is likely to make them leave and go to a competitor instead.
User Research: I used Google Forms to interview the target audience (customers) themselves to get a better understanding of their needs.
User research consisted of people who:
Have never gotten a tattoo before
Have experience getting tattooed at a tattoo studio
Key questions:
What concerns do you usually have before booking an appointment at a new tattoo studio?
(Surfaces fears, hesitations, and emotional barriers.)
What information do you need to feel confident enough to book?
(Reveals trust signals, content gaps, and clarity issues.)
How would you expect the booking process to work from start to finish?
(Uncovers mental models, friction points, and expectations.)
There was a lot of overlap in the responses and I condensed them into the following insights which will help me optimise the user experience when designing the website.
confusion
overwhelm
stress
first impression
guidance
clarity
PERSONAS
WIREFRAMES
Creating good the low fidelity wireframes was a key part of the design process.
The primary user flow (visiting to book an appointment) and visual clarity took priority over implementing obsolete features that would overwhelm visitors. By prioritising these aspects at the beginning I reduced the need to go back and reiterate later on.
This is what allowed me to create a truly enjoyable, yet professional experience for the user — increasing their trust with every interaction.
Key design choices:
Clear calls to action to help with guidance.
Good use of negative space to make the experience feel premium and calming.
Clear visual hierarchy through the use of typography to let the user know where they are with one quick scan of the page.
USER FLOW
Below is the user flow describing how users will interact with the product. It's very linear and simple, leaving no room for mistakes on the user's side. The small amount of available pages maximises the likelihood of users being able to successfully complete the booking process without getting lost or overwhelmed.
Note: The "happy" path is the first row of the diagram.
DESIGN SYSTEM
PROTOTYPING
USER TESTING
After completing the high fidelity prototypes I moved to unmoderated usability testing with two groups consisting of four users each. They were grouped based on which of the personas they resembled more.
Group A: People who want to book their first tattoo appointment
Group B: People who have booked tattoo appointments before
Both groups were presented with the following scenario.
Scenario: You came across the website of a tattoo studio. Explore the site to see if it's a good match for you, then navigate through the site to book your appointment.
The results of testing were measured by the metrics.
Success Rate: How many participants were able to complete the task without outside assistance.
Satisfaction: The measurement of participant satisfaction in the form of a post-task questionnaire.
Ease of Use: How easy was it for participants to complete the task on a scale of 1 to 5.
Completion time: The amount of time taken to complete the task by each participant.
Hypothesis: Both groups should be able to navigate through the site and complete the booking process
Results:
GROUP A
100%
TASK COMPLETION
SUCCESS
GROUP B
100%
TASK COMPLETION
SUCCESS
The hypothesis was correct as all users in both groups were able to successfully complete the task without any friction. The following feedback was given by participants after the test.
Participant 2 — Group A
The site felt intuitive and everything
was laid out clearly. It was easy to find
all the information I needed.
Participant 3 — Group A
I felt warm safe while navigating the
website. I liked how each page clearly
described where I am.
Participant 4 — Group A
My pre-existing fears and uncertainty
disappeared after finding all the answers
I need in the FAQ section.
Participant 2 — Group B
I felt like my expectations will be positively
matched and the whole process was
quick and easy.
ITERATIONS
Even though testing the prototype went well, users revealed a few further pain points that caused friction during the process. After receiving their feedback I made the following adjustments.
Accessibility: I increased the height of input fields in the booking section to make them easier to tap.
Before
After
Clarity: I added an icon to the SEE MORE buttons on the Gallery page, some users were unsure where they would be redirected after pressing the button.
Before
After
REFLECTIONS
I think that the project was a success — the new website will allow INK;BLOT PROJECT to grow and convert more visitors into long term customers. It's a strong and scalable foundation that allows for easy implementation of new features in the future.
The project allowed me to better understand the importance of creating a pleasant experience for the user through designing a well balanced and thoughtful interface.
User research and subsequent testing allowed me to better understand the needs and concerns of potential users with varying levels of experience. It showed me how important those insights are when creating the actual product and building trust between the brand and the user.
For future iterations I would consider integrating AI in the FAQ section, allowing users to ask their specific question and getting an instant answer before having to message the studio. This would drastically reduce the wait time as users would be able to get answers anytime during the day.
