Tattoo Artist Website Design
Initial Goals
Client's Goals for Their Website:
Increases in
tattoo appointments
client's reaching out for consultations/general inquiries
flash sheet design usage for appointment bookings and tattoos
personal design style tattoos with clients (ideally having seen their work before via website, Instagram, or other platforms)
guest spot appointments
merchandise and artwork purchases
Things that the client wanted users to be able to do on the website
Schedule a tattoo consultation
See her schedule of shops/ conventions she’s (guest) tattooing at
Places to see her previous work, and read reviews from her clients
Buy her physical art pieces (+merch)
Find her on social media, Instagram, Etsy, X, Snapchat, etc.
Contact her with any questions or find answers to questions she commonly gets (FAQ)
First Steps and Initial SiteMap
To accomplish all of these things, I needed to make sure that there was an intuitive place for all of these things to go.
First comes the creation of the navigation bar that hosts all of the title pages. The first step for me is grouping things from the objective list that usually go together, so:
Schedule a tattoo consult is on its own (one-stop-shop and the main objective of the website)
Schedule/ Calendar of guest tattooing and conventions (separate)
Buying her physical work (widget/ drop shipping site that is looped in for merch designs- Etsy section for paintings, stickers, etc that is physically made)
To me, this becomes two child pages under the same parent label
See previous work new and healed, AND incorporation of social media can live under the same umbrella
I also included an “About Me” section that would be applicable to be here
A contact form and FAQ can also live under the same parent page
The process of grouping these pages helps me create initial titles for the navigation of the website.
The first iteration of that list looked like this: Home, Schedule, Previous Work, Sales, and Contact.
To completely flesh out the child pages that would be residing under the titles in the navigation bar, I used the client's objectives and the grouping exercise I did above and came up with a first round of child pages that would hold all of the client's desired information while not crowding one landing page with too much information at once. To visualize the layout of this process I created the first sitemap wireframe:
User Testing 1: Card Sorting
The first User Test that I chose to use was a card sorting activity, and I gave them the instructions of “using the headers and subpages given, arrange them in groups or headers that you think would be good for a website navigation bar. You are allowed to add other page names if you would like with the blank cards, and take cards out however you would like. AKA you do not need to use every card if you dont feel like they are useful. The website is for a tattoo artist, but you don’t get any more information than that.”
This was the list of cards that were provided: Home, Schedule, Calendar, Flash Art, Book a Consultation, Previous Work, Merch and Art, Etsy Storefront, Contact, Contact Me, and FAQs
Abbreviated User Talk-Through:
Interviewee: Home: “This seems like a good starting point for general information about the tattoo artist, their studio, and maybe some past work. It's a common starting spot for people and I think exists on every website.”
Schedule: “Since this is a website for a tattoo artist, I'd assume this section would have information related to the artist's schedule. I might choose to keep the subpages "Calendar," "Flash Art," and "Book a Consultation" under this category.”
Calendar: “This could be where the artist shows their availability, upcoming events, or maybe a schedule of where they'll be for guest spots.”
Flash Art: “This might be a gallery or section showcasing their flash art or flash sheets.”
Book a Consultation: “This seems like a page under Schedule for clients to ask about and schedule consultation appointments”
Previous Work: “This is a section to show the tattoo artist's portfolio and their previous tattoo works.”
Merch and Art: “This section seems to involve both merchandise and additional artwork. I'd choose to separate it into "Merch" and "Art" as main categories.”
Etsy Storefront: “If the artist has an Etsy store specifically for selling artwork or merchandise, I'd include it under the "Art." header”
Contact: “A page where you can get in touch with the tattoo artist. I'd keep the subpages "Contact Me" and "FAQs" under this category.”
Me: “Are there any changes to page or subpage names that you would include or edit?”
Interviewee: "With the fact that this is a tattoo artist's website, the initial page and subpage names seem generally fine. But, the effectiveness of these names can depend on the specific branding, style, and preferences of the tattoo artist. If I was to change anything I might name “Flash Art" something like "Flash Designs" or "Flash Gallery."
The names of "Book a Consultation" are pretty straight to the point, but if the artist wants to sound more personable or casual, it could be something like "Get Inked" or "Let's Talk Tattoos."
Another personal touch thing could be for the "Contact Me" page, they could make it "Get in Touch" or "Reach Out."
Overall I think that the names of the pages are fine but that the artist might want to make the language a little more personal or fun."
User Testing 2: Site Walkthrough
User Testing 2. Walkthrough
The second kind of User Testing that I conducted was a walkthrough of the website site map that I had created with the objective of "please show me where you would go to look at more of the artist's previous work, and then where you would go to book a tattoo consultation".
“Ok, here's how I would do that.
1. Visit the Home Page: When getting to the website, I would start by visiting the Home page. This is usually the default starting point
2. Explore the "Previous Work" Section: Since I'm interested in viewing more of the artist's previous work, I would look for a section or link labeled something that indicates "Previous Work." This could be a direct link on the main navigation menu or a prominent section on the Home page. And there's a spot right here that says previous work.
3. Navigate to the Portfolio or Gallery: Within the "Previous Work" section, I'd expect to find a portfolio or gallery showcasing the artist's tattoos. I would explore this area to get a better sense of the artist's style, skill, and range of work.
4. Decide to Book a Tattoo Consultation: After exploring the previous work, I'd be interested in moving forward with a tattoo consultation. I would then go back to the main navigation menu and look for a section labeled "Schedule" or similar.
5. Access the "Book a Consultation" Subpage: In the "Schedule" section, I would expect to find a link to "Book a Consultation" or a similar option. I assume that clicking on this link would take me to a page where I can learn about the consultation process and possibly initiate the booking.
6. Follow the Consultation Booking Process: Once on the "Book a Consultation" page, I would follow the instructions provided by the artist."
(See the labeled steps on the sitemap below)
After conducting this portion of the walk through, I asked my interviewee to look over the proposed other titles from my "User Test 1 Card Sorting" participant, and tell me if they would change any of the names that were on the sitemap to the ones proposed.
As a reminder, this was what my previous participant had said about potential name changes:
"If I was to change anything I might name “Flash Art" something like "Flash Designs" or "Flash Gallery." The names of "Book a Consultation" is pretty straight to the point, but if the artist wants to sound more personable or casual, it could be something like "Get Inked" or "Let's Talk Tattoos. Another personal touch thing could be for the "Contact Me" page, they could make it "Get in Touch" or "Reach Out."
My second participant said:
"If I were to change anything, here's what I may change:
"Flash Art": I prefer the proposed alternatives like "Flash Designs" or "Flash Gallery." These options provide a clearer indication of what visitors can expect in this section, making it more explicit and potentially improving user understanding.
"Book a Consultation": Both "Get Inked" and "Let's Talk Tattoos" have a more casual and inviting tone, which could resonate well with users. I slightly lean towards "Get Inked" as it communicates the action users are taking, aligning with the tattooing process.
"Contact Me": I appreciate the personal touch conveyed by "Get in Touch" or "Reach Out." These alternatives can make the page feel more inviting and less formal, potentially encouraging users to reach out more comfortably.
"FAQs": Both "Common Questions" and "Help Center" are clear and concise. "Common Questions" is straightforward and aligns with user expectations for finding answers to commonly asked queries, making it a good choice."
User Testing 3: Survey
After going through the first two iterations of user testing, I figured to get to the bottom of the naming conventions I would conduct a survey to get unbiased data on what the end names of the headers should be. The survey looked like this:
Survey: Website Naming Preferences
Flash Art Section:
Which name do you prefer for the section showcasing the artist's flash art?
Flash Art
Flash Designs
Flash Gallery
Other
Tattoo Consultation:
Which name do you find more appealing for the page where you can book a tattoo consultation?
Book a Consultation
Get Inked
Let's Talk Tattoos
Other
Merchandise and Art Section:
If the artist has both an Etsy storefront and their own online shop, which name do you think is clearer for this section?
Merch and Art
Merch
Online Shop
Other
Contact Section:
Which name do you find more inviting for the section where you can get in touch with the artist?
Contact Me
Get in Touch
Reach Out
Other
Frequently Asked Questions:
For the section containing common queries, which name do you think is more suitable?
FAQs
Common Questions
Help Center
Other
Objective of the Website:
After reviewing the suggested names for different sections, what do you think is the primary objective of the website? Choose one:
Showcase the artist's work
Book tattoo appointments
Purchase merchandise or artwork
Get in touch with the artist
Find answers to common questions
I got a total of 15 responses and these were the results:
To make going through all of this data easier, I coded everything with this code key:
- Flash Art: 1: Flash Art, 2: Flash Design, 3: Flash Gallery, and 4: Other
- Tattoo Consultation: 1: Book a Consultation, 2: Get Inked, 3: Let's Talk Tattoos, and 4: Other
- Merchandise and Art: 1: Merch and Art, 2: Merch, 3: Online Shop, and 4: Other
- Contact: 1: Contact Me, 2: Get in Touch, 3: Reach Out, and 4: Other
- FAQs: 1: FAQs, 2: Common Questions, 3: Help Center, 4: Other
and these were the coded results:
Survey Data Analysis and Outcomes
Below is the total amounts of responses for each of the responses derived from the survey results. A more concise breakdown of the "winning" answers would be a tie between "Flash Designs (2), and Flash Gallery (3)", "Merch and Art (1)", FAQs (1), and a three-way tie between: "Showcase the artist's work (1)", "Book tattoo appointments (2)", and "Get in touch with the artist (4)".
To make this data meaningful to me, the answers need to be thought out a little bit more.
With two answers tied for Question #1, as a researcher, they both have some merit as an option. My solution to this would be to conduct an A/B test upon the completion of the final website design and get a better understanding of which option garnered more interest in the Flash sheet designs that the artist has available to view.
For the Website Objective answers for survey Question #4, don't apply the same logic of my solution to Question #1's tie. Due to Question #4 looking to get a pulse on the respondent's view on the website objectives, the only thing that I want to do is make sure that those things align with the original goals set by the client at the first step of this process. As a refresher, the goals that the client had wanted for their website were to:
Increases in
tattoo appointments
client's reaching out for consultations/general inquiries
flash sheet design usage for appointment bookings and tattoos
personal design style tattoos with clients (ideally having seen their work before via website, Instagram, or other platforms)
guest spot appointments
merchandise and artwork purchases
Via these bullet points, we can see the 3-way tie that occurred in the survey results ("Showcase the artist's work", "Book tattoo appointments", and "Get in touch with the artist". ), addressed three of the client goals in terms of the website's objectives:
Increases in
tattoo appointments
client's reaching out for consultations/general inquiries
AND
personal design style tattoos with clients (ideally having seen their work before via website, Instagram, or other platforms)
Survey Side Note
The survey conducted for this project was mainly done to get a better understanding of the naming conventions for the website to resonate with new and returning clients to get them where they wanted to go with ease. Had this been a redesign rather than a fully new website from the ground up, it is likely that I would've conducted a survey that revolved more around the preferences of a user in the effectiveness of new naming conventions or the usability of the website as a whole, which would've led to more statistically suitable data analysis to be done (ex. using a Correlation Coefficient Test to determine if viewing a link to the artist work on the homepage was correlated to visitors viewing the previous work page, or if it wasn't related, etc.)