Making a tattoo appointment

My role: UX/UI Designer
Timeline: January 2023 - April 2023
Team of: 3

Platforms & tools

  • iOS
  • aOS
  • Figma
  • Figjam
  • usertesting.com
  • Google Survey

Context

Context This project aimed to help new customers find a tattoo style or artist with the ability to schedule a session. Ink Tank is a web application that allows tattoo lovers to look for tattoos, share their tattoos, schedule sessions or consultations with a tattoo designer, or develop a project for a new tattoo. This project was from a UX project with Career Foundry.

Design Process

Rinse and repeat

Discovery

Discovery:

  • Competitive analysis
  • User flows
  • Personas
  • Card sorting
  • Desk research
  • Survey
  • User interviews
Ideate

Ideate:

  • Low fiedlty prototypes
  • High fidelity prototype
  • Content
Testing

Testing:

  • Moderate user testing
  • A/B testing
Development

Development:

  • Style Guide

Initial goal:

  • Design a calendar for customers
  • Ability to save and upload images
  • Give ways for customers and artists to communicate and collaborate

Discovery

I research mobile apps that focus on sharing and displaying content, organizing communication, and scheduling an appointment for the tattoo industry. Conducting a competitive analysis allows me to see what is out there for people, how easy it is for people who have experience getting a tattoo and are entirely new to the process. Tattoodo and Tattoomap were indirect competitors for Ink Tank. Those sites were the best indirect competitors due to some features accessible for finding an artist, displaying a post, communicating with another user, and visual proof on licensed tattoo artist compare to a regular user. By identifying the underserved opportunities in the market, I made possible solutions to fill the users' needs.

competivie-analsyis-inktank information as possible to the restaurant in advance. Wroked on a mid fiedtly prototypes More detail about the Competitive and UX analysis

Survey

I sent out user surveys and user interviews; I understand how people organize their projects. The user prefers setting an appointment, looking up ideas, and hiring a professional. I interviewed five users close to the market Ink Tank is reaching. With the data I analyzed, I learned that users want a place where they can communicate during the build of a design and view profiles and pieces of work. I have built personas for the ideal user and scenarios with the interview and survey information. Creating the personas and scenarios will show the user’s perspective on how Ink Tank will function within their life. I had difficulty finding a tattoo artist willing to talk to me about the tools and methods they use to promote their work and organize appointments and payments. Initially, the goal was to go to some tattoo shops, observe an artist during the day, and see their habits. Even though I could not observe and interview professional tattoo artists, it allowed me to focus on the client side of the app.

I had difficulty finding a tattoo artist willing to talk to me about the tools and methods they use to promote their work and organize appointments and payments. Initially, the goal was to go to some tattoo shops, observe an artist during the day, and see their habits. Even though I could not observe and interview professional tattoo artists, it allowed me to focus on the client side of the app.

survey-overview

Persona

From the data provided from understanding the user, I built a couple of personas, William and Danielle. To show how Ink Tank benedicts user’s day-to-day lives, I offered scenarios.

User flow

From the data provided from understanding the user, I built a couple of personas, William. I am making the scenarios to show how Ink Tank can benedict users day-to-day lives. Now that there is a better understanding of the users, I created a user flow that shows how a person navigates throughout the app.

William
userflow2

More detail about the user stories, user flow, and user journey

User survey and interviews overview More detail about the user stories, user flow, and user journey

Ideate

I created the sitemap with the user flow. To update the sitemap from a user perspective, I decided to do card sorting to see what users think where content will be organized. It was interesting to see the diverse mindset when it comes to going to specific pages and content.
After sketching a low-fidelity prototype, I tested it out with a couple of users to see if the flow was clear enough for them to get to the features. I analyze the feedback and update the sketch and flow from the majority of call-outs. Once I felt satisfied with what was on paper turned the design into a high-fidelity prototype and tested it again with some users.

Low-fidelity prototype

appt-consulation appt-session build-a-project
Finally able to do the fun part, prototyping! When I was styling the high-fidelity prototype, I had a challenge picking the colors. I knew I wanted to go with an orange-red color to translate creativity. I was able to find a shade that is not only WGAG AA friendly but met my expectations. I want to improve the vector images; they look simple and do not connect with the style of the app as much as I want.

Interactive prototype

Testing

With the testing for time purposes, I conduct a usability test and preference testing simultaneously.
I wanted to see if the user can navigate building a project, finding an artist, and booking an appointment with the usability testing. For the preference test A/B Testing, I tested out the style of buttons.
usuability-4
From the data that I've collected from the testing, I've adjusted the errors on the prototype. Some of the changes were pretty easy to change because they were styling issues, but the one feature was a challenge clarifying scheduling a session.
More detail about the testing.

Handoff

For the developers, I did provide the following infromation in the Figma file:

  • Components and elements
  • Clickable prototypes
  • Interaction notes

Takeaways

As a designer, I wanted to figure out the best way for different components to function and support the app's various features. I wanted to make sure that the elements had a flow that the users can recognize and navigate as much as possible with no assistance or confusion—building a layout that focuses on showing photos and building a project or doing a project in the same area.