Project 1

The Problem

Many tattoo artists rely on word of mouth or social media in order to be found, and clients usually rely on those same methods to find a tattoo artist. There has to be a service to help both tattoo artists, and potential clients, connect.

Potential clients need a service that helps them discover new tattoo artists, no matter where they are located. They should be able to search artists by location, style, and specialties all in one place.

They should also be able to search for inspiration to help them decide on their next tattoo. For example, first timer’s do not understand the endless possibilities when it comes to body art. Being able to view previous work by artists from around the world will help them in the process to find an artist that fits their needs.

‍

The Solution

In a world that's transitioning to 100% digital, I believe that creating an app with the ability for users to search for tattoo artists, and search for inspiration, will allow for a more tailored experience to find the best fit for their next tattoo. It will also benefit tattoo artists in advertising their work and expanding their clientele.

Design Process

Research

What are the goals and objectives?

Understand how potential clients currently search for and find their next tattoo artist.
Understand client pain points and frustrations when finding a tattoo artist.
Research the tattoo industry and understand what is important when searching for a tattoo artist.
Research what information first timers should know

Learning from potential clients.‍

A survey was created to better understand the process in which individuals who are currently looking for their next tattoo artist take, what pain points they have encountered, and what they think would improve their experience for future interactions with artists. ‍

Learning from competitors.

Along with the initial research I conducted a competitive analysis to understand current features & UI of companies with a similar purpose – such as Tattoodo, Instagram, and Private Studio websites. This allowed me to view gaps where INK’D can fill the void and provide a better service. ‍

To be successful, INK'D should learn from potential users.

Social Media: Allow tattoo artists to link their social media accounts to their INK’D profile (how clients currently find artists)
Sharing: Provide a feature that lets users share tattoo artist profiles with friends and family
Defined Styles: Provide a wide range of default keywords that users can choose from, in addition to a search function, for artists and inspiration. Many tattoos are based on a favorite movie, show, videogame, book, etc.
Chat feature: Ability for users to communicate with artists in a timely manner. This includes in person or video chat consultations, and the ability to chat about design (normally a very short conversation, but clients wish they had more time)
Transparent Pricing: Tattoo artists should provide an hourly rate and/or project price ranges to minimize confusion of how much a client might spend.

If you would like to view notes from my research and survey results please click here.

Information Architecture

How should the mobile app be structured?

Before creating the sitemap, I organized task flows and user flows to ensure I had all necessary pages that should be included in the Minimum Viable Product (MVP).

I then made rough sketches of each page before digitizing them for my low fidelity prototype. My goal was to sketch each page to ensure all elements needed to complete important tasks were included and could fit within the given parameters.

Interaction Design

Time for wireframes!

Before exploring the UI design of the app, I created low fidelity wireframes of all of the main pages in order to get a sense of how content should be structured without the distraction of pretty colors and vivid images.

I used these low fidelity wireframes to create the first prototype. I did this early on because I wanted to get critical feedback from users before adding all the visually distracting components.

‍View Prototype

Usability Testing & Iterations

I utilized Maze's usability testing feature in order to conduct my testing in a short amount of time and was able to gather feedback from 10 participants. They were instructed to complete three missions and provide feedback on each:

Mission #1: Create an account as a Client
Mission #2: Find an Artist using the Inspiration Tab
Mission #3: Find an Artist using the Find my Artist Tab

What did I learn from user testing?

The missions allowed me to get a sense of how users utilized the apps main functions, especially what path they took and if they were able to complete the task.

After reviewing the usability test findings, I found that, overall, participants found the app easy to use, but became confused as both mission 2 and 3 were very similar. I was shocked that a majority of participants had difficulty locating the inspiration tab and weren’t able to complete that mission.

However, I was pleased with the feedback, specifically regarding how the dropdown filter did not have a way to submit their choices, and that the flow for creating a client required them to scroll which made no sense. I later found out it was a glitch within Maze, but I am glad they brought it to my attention either way and made minor adjustments to improve the user experience.

Key changes for a better user experience.

Dropdown Filter: I added a large “Apply” button at the bottom of the filter list to execute the search, where previously it was a smaller “Save” button in the top right corner.
Create an Account: I changed the size of the frame and re-tested the prototype to ensure the user did not need to scroll in order to click the button to create their account as stated from user testing.
Artist Cards: users had a hard time clicking the "artist" card to see the profile, so I made the text and clickable area larger.
Back button: In the final app I want a back button to be able to take the user to the previous page from wherever they are at. The initial prototype was designed without it.

Branding & User Interface

I want the brand identity to be powerful and edgy, yet simple in design. The UI has a monochromatic color palette to allow the artist's work to be the star of the show. The goal is to keep the app aesthetic from being too flashy and distracting.

I created a style guide showcasing the chosen brand colors, typography & logo. I ultimately went with a black palette with blue toned charcoal grey and whites. I wanted the typography to match the aesthetic of the logo so I went with serif font, Habibi. I kept the logo as text and found a fun font to match the esthetic, and since the brand is called INK’D the font appears like ink dripping down the screen.

Designing the final iteration with high fidelity wireframes.

The final prototype included the app initial launch screen, on-boarding screen for clients, and all features that were included on the bottom navigation. In addition, I made all of the changes discovered in the usability test phase and added UI elements such as the logo and color scheme.

To view the high-fidelity prototype after the changes were made following usability testing, please click below.
‍
‍View Prototype.

Next Steps

Transfer the high-fidelity prototype to engineers to code
Conduct user testing on other user and task flows
Design the "Tattoo Artist" portal and dashboard for their end of the mobile app

INK'D Mobile App

About the Project

The Problem

The Solution

Design Process