OVERVIEW: Getting a tattoo is not like getting a pair of new shoes. It is an experience that stays with you for a lifetime. About 17% of people in the US who have tattoos regret getting them. People end up referring to a variety of trusted sites like Google, Instagram, and Yelp to learn more about artists, their work and designs but are not guaranteed an overall happy end result.
MY ROLE: UI/UX DESIGNER
This project was part of the Career Foundry UX Design Program that took place between October 2020- June 2021(Ongoing). I was responsible for Competitive analysis, User Research Analysis, defining actionable Mobile strategy, Persona Development, User Journey Map, User flows, articulation of the products Information Architecture, Wire-framing, Prototyping, Conducting Usability testing with test subjects, analyzing results and making future test improvements. Besides this, I also explored foundations of Visual Design, experimented with responsive frameworks and compiled all the design iterations and made final fixes to the design.
TOOLS USED: ADOBE XD, FIGMA, USABILITY HUB, OPTIMAL SORT, GOOGLE FORMS, PEN & PAPER, SKYPE, PAGES
THE PROBLEM: TATTOO INDUSTRY BY THE NUMBERS
To better understand the problem and the market place, I sent out a couple of surveys to get an idea about the motivations and goals for the tattoo community. From the data it was clear that about 20% of the adults in USA had at least 1 tattoo and they used a variety of online platforms like Instagram, Google, and Facebook to find artists and browse tattoo designs.
66% of the general public use Instagram and Google to discover artists & designs
66% of the general public spent at least 6 months researching tattoo styles and artists
58% said that they had difficulty finding artists they liked and trusted and 33% said that they had difficulty finding designs and artists they could afford.
THE CHALLENGE: BRIDGING THE GAP BETWEEN TATTOO ARTISTS AND THE CONSUMER
Getting a tattoo is a very personal experience. People usually look at a variety of different placed browsing and researching artists before booking their first appointment. Tattoo regrets are a thing and about 17% of the tattoo consumers regret getting a tattoo. The process of customization of a tattoo design is not transparent and streamlined. So users usually have to wait a long time to see them and doesn't usually guarantee an overall happy end result. In order to bridge this gap between tattoo artists, designs and the consumer it is important to take users on a personalized journey of tattoo discovery and streamline the processes from start to finish.
THE APPROACH: FOCUSING ON USER INSIGHTS
In order to view the product from the consumers perspective, I needed to get into the minds of the user. It was crucial to understand the motivations, frustrations and pain points of the target user. The analysis of the survey gave me a good understanding of my target group. Once I had this information, I started conducting user interviews to dive deeper into the user persona. I conducted about 5 user interviews and this helped me identify general patterns and underlying themes that led me to actionable insights about the target user.
Users seek out professional certification or third party certificates, read customer reviews and evaluate artist's work thoroughly. They usually look for safety, cleanliness, and transparency.
Efficiency: Users prefer streamlined booking process. They don't like to wait and like to see availability of artists and translate sizing and placements before booking an appointment
Expertise: Tattoo users prefer to work with artists who are consistent and good at their craft.They like to see before and after pictures of healed and not healed tattoos.
Predictability: Users would like to minimize buyer remorse. They would prefer to use an AR tool to test drive tattoo designs before booking an appointment.
DISCOVERY: Users need a better way to discover artists. Using filters that are relevant to their needs, and having comparison images and giving them the freedom to upload designs of their choice, they would be able to discover artists more easily.
DISCOVERY: WHAT DOES IT MEAN TO GET A TATTOO?
The user discovery phase allowed me to gather qualitative and quantitive insights about the user. During this phase I also audited existing work, review competitor landscape and the problem statement. Once I began researching the user, their needs, goals and motivations, it was clear to me that what's why's and when's of getting a tattoo differed for different users. Getting a tattoo meant different things to different users. This suggested that the apps requirements would have to change depending on the user type. So i divided my user type into categories and decided to focus on my primary personas - Kayla the tattoo collector and Allison the tattoo enthusiast.
Using experience mapping techniques we were able to chart users tattoo experience using a customer journey map. By visualizing the users end to end experience and focusing on users frustrations, and pain points, i was able to figure out reasons behind the negative experience and this also led to design customer journeys with an aspirational emotional state in mind.
THE VISION: AN INTERACTIVE, SAFE AND FUN WAY TO SHOP FOR TATTOOS
TATTOO DISCOVERY:I wanted to improve the experience of searching for a tattoo. So I decided to use similar design patterns that users were familiar with but added additional micro interactions and features that was not present in our competitor's app. Such as the photo search feature, Curated list of artists for the week as well as location based search.
EASY BOOKING: I wanted to bridge the gap between tattoo artists and the tattoo community. So I introduced the AR tool to test drive the designs and a means to communicate with artists before booking an appointment. They wouldn't have to rely on third party apps such as whatsapp, instagram or facebook. This i think would make it easier for the tattoo consumer to make an informed decision about the tattoo procedure and minimize any apprehension they might have about getting the tattoo.
ARTIST DISCOVERY:
Users of this app would be able to easily discover artists. features will be prioritized to make the app more convenient, predictable and trustworthy. Adding social proof such as reviews and testimonials will help improve factors such as trust, and expertise.
EXTRACTING REQUIREMENTS USING USER JOURNEY MAPPING:
By analyzing users behavior, I was able to define the basic requirements of the app. Extracting goals this way led me to design the app based on the users emotional states and not just by what our competitors were doing and what was technically feasible. By visualizing the users journey step by step , I was able to step into the life of the user and see how this app would fit into their life. I imagined how the user would think, feel and behave when using the app. Imagining their ideal experiences this way I was able to extract a broad range of tasks that would ultimately set the design direction for my project. I visualized how each persona would navigate through the app, the context with which they would use the app and the ideal experiences they would have while using the product. This led me create task analysis from which the first sitemap was born.
The next step in the process was to validate or invalidate the assumptions I made when creating the sitemap. I did this by performing a card sorting test with the target audience. Testing the products information architecture this way helped me visualize how the users preferred to group different content. There were some overlap between the way I chose to group content and how the what the users preferred to see it. The standardization grid and the similarity matrix were useful in determining what parts of the design were the easiest to navigate.By seeing how users chose to map the content, I was able to evaluate the original sitemap and generate new ideas for the products information architecture.
Task Analysis and User flow gave me an understanding of how the navigation should be laid out. I started to sketch out some wireframe ideas with pen and paper to flesh out interaction ideas rapidly. I created lo-fi wireframes for the three core features of my app keeping only the high level functionality in mind.Rapid prototyping is very useful to come up with new ideas and concepts. Paper prototypes are a quick to create, inexpensive and easy to modify but they have limited interactions and are not always self explanatory. I referenced some of the universal design patterns while structuring the content and functionality as this would ensure recognizability and ease of use among the users.
The next of the process was to convert lo-fi prototypes into mid fidelity prototypes.I didn't want to use paper prototypes for user testing because users would find it difficult to use these rough hand sketches. Creating these screens allowed to me to convey the form and function of the three core features of the app. I created the clickable prototype on Adobe XD which was later moved to Figma. The prototype allowed me assess the overall flow and functionality of my design. Once I was satisfied with the navigation and layout of the app, I moved on to the next step which was to conduct usability tests.
I conducted 6 rounds of usability tests with participants. The tests were conducted using moderated in person and remote methods. I created this document to communicate my test plan to both participants of my study and all the stakeholders involved in this project. The goal of this study was to measure the learnability, efficiency and ease with which users interacted with the app. Integrating users feedback allowed me to develop a product that matches their expectations and needs.
Tests revealed some major and minor errors of medium to high severity.One of the main problem I uncovered was that users found it hard to discover hidden features of the app and found some of the features like image search feature was hard to use because they didn’t follow familiar or conventional design patterns. By conducting affinity mapping exercises and grouping my observations, errors and pain points into a rainbow spreadsheet, I was able to extract issues that I thought needed attention.
After I uncovered the main issues, I was ready to implement all the changes to my prototype. This didn’t involve a complete redesign but it meant that I had to redesign specific parts of my prototype. These changes were made with the assumption that users would find these features easily accessible and would improve their overall efficiency and satisfaction rate. I would be conducting more usability tests to validate my assumptions.
Next step of the process was to create high fidelity mocks. I applied Gestalts principles such as Emphasis, Law of Proximity, Law of similarity and Balance to come up new visual aesthetics for the product. I also conducted preference tests for some of the screens to see if users preferred one design over the other. I also conducted more rounds of usability tests to see what my peers thought about my design. I got some valuable feedback on the design and performed some more iterations to improve the usability of the app.
DESIGN DOCUMENTATION
I created design documentation including styles guides, patterns and design language system to standardize my design and make it reusable. The design is on a dark background with minimalistic style. Bright colors are used on the CTA buttons and imagery is carefully chosen to indicate fresh and minimal feel.I created design documentation including styles guides, patterns and design language system to standardize my design and make it reusable. The design is on a dark background with minimalistic style. Bright colors are used on the CTA buttons and imagery is carefully chosen to indicate fresh and minimal feel.
FINAL DESIGN:
After conducting a few rounds of usability tests and iterations i created a polished version of the final design.
Click here to view the high fidelity prototype: https://www.figma.com/proto/Kgb0RoSKMB8qESR7Jr1n0v/InkMe?node-id=1%3A2&scaling=scale-down&page-id=0%3A1
Thank you
