Simona Shrayber's profile

Skindeep Tattoo App- UX Design case study

Skindeep
Bridging the gap between getting inspired and getting inked
Developed by UX Designer Simona Shrayber
The Project

During my training as a UX Designer, I was asked to explore the journey of getting tattooed by creating an application specifically catered for this process and its users.


What came to be of it? Skindeep. 

An app that puts our users directly in the center of the tattoo community. I offer users the tools to not only find what they like but also make it happen for them. 


How do I do this?

I wanted to create an app that doesn't simply function as a middle man service or some edgy tattoo-y version of Pinterest but rather something more integrated and immersive than anything else I've used in the past.
As a product that would consist of so many moving parts, I knew this process was going to be tough but before I could define what it does and why it does it, I first had to recognize what driving fundamental values Skindeep would stand for...

Trust, Interconnectivity, and Discovery.


Alright alright, now tell us what the app does already!

While navigating and exploring Skindeep, users might find themselves...

-Browsing through a wide variety of tattoos and artists 
-Booking an appointment with an artist they admire
-Getting connected with their tattooer via live chat
-Reading articles and helpful guides all pertaining to tattooing
-Sharing their experiences and opinions by rating and reviewing all published content
-Trying out design ideas with the AR Tattoo Tester
-Saving artists and tattoos they love to personal collection folders so they can be referenced back to later


My roles...(s)

In this project I had the opportunity to take on every role in the design process starting from conception and all the way to the final touches of my user interface.

-Conceptualization
-Paper Sketching
-User Research
-Information Architecture 
-Wireframing
-UX Design
-UX Writing
-Prototyping
-Usability Testing
-UI Design

Tools I used​​​​​​​

-Adobe XD
-Invision
-Balsamiq
-Coolors
-Overflow
-Usability Hub
-Slack
-Google Forms
-Optimal Workshop
-Pen and paper
The Problem

Up until recently the tattoo industry has lacked a sense of unity, at times making it seemingly out of reach for many people who struggle with issues of trust and not finding the artist who's right for them. Even now, with the few resources available, their capabilities are limited due to a dividence in this process; a process that should be seamless and absolute.
How can I offer users a way to obtain all the information they need to make knowledgable decisions regarding tattoos? What can I do to increase trust and decrease feelings of regret? 
The Solution

Put simply, Skindeep will be the answer to our problematic questions. Inspiring tattoo images will always be linked to an artist profile, from which our users have the ability to send them a message, save to check out later, write and reference honest testimonials or even book an appointment. Here we are...bridging the gaps that once hindered our opportunities to get the tattoos we want!
Competitive Analysis

During my research on the tattoo market, I identified 2 applications that I would consider main competitors to Skindeep:

InkHunter and Tattoodo

To conduct this analysis, I included the following:
-SWOT analysis
-UX Heuristics evaluation​​​​​​​
User Research Analysis

After analyzing competitor apps, I decided to begin researching Skindeep's demographic by interviewing a group of 3 people between the ages of 20-30 years old. I conducted these interviews to further understand the needs and behaviors of my potential users. Through affinity mapping, I was able to gain key insights into the 5 topics addressed in my user interviews. 
Check em' out!
User Personas and Journeys

Conducting user research allowed me to understand the motivations, needs, and goals of my target demographic as well as the frustrations of these individuals. Doing this allowed me to create my user personas and mental models which can work well to encapsulate the insights I obtained and further help my decision making throughout the design process. 

So, I'd like to introduce:

Alyssa and James
Creating a Sitemap

User journeys shed light on the highly specific needs of my personas and allowed me to move forward to create personalized user flows for each of their goals. This is where I was able to understand the complexity of the users tasks and create tangible solutions to pain points before entering the wireframing phase. ​​​​​​​
A card sorting activity was conducted where five participants placed content into pre-labeled categories to help validate and improve the IA of the Skindeep app. After conducting a closed card sort, the results revealed to confirm the content sorting of the original sitemap. The activity also brought great insight for incorporating certain information across multiple features such as ‘Top Cities’ and ‘Guides’ on the Discover page. ​​​​​​​
Wireframing

To start, I began sketching low fidelity wireframes with pen and paper, keeping details at a minimum by using rapid prototyping methods. I first wanted to hatch out any basic solutions I could identify before moving on to more detailed version in the mid and high fidelity phase.
Tool used: Adobe XD
Usability Testing

Before starting in-person testing, I wrote up a plan that outlines my goals, test objectives and additional detailed information on how the tests will be run. Errors were measured using the Jacob Neilson scale.
Notes, observations, quotes and errors were analyzed and compiled into a Rainbow Spreadsheet with possible solutions...
Design Iterations for Accessibility and Beyond!

After creating a style guide and design language, I began refining my app to adhere to WCAG Accessibility criteria.
I strongly believe it is absolutely crucial to produce products that can be used by everyone, so a few vital changes were made to Skindeep's design.

Adjustments were made for the following accessibility issues:

-Color contrast
-Assistive Technology
-Text size and form fields
-Labels and placeholders
-Cognitive load​​​​​​​​​​​​​​
(Now is when we start polishing the design) BOOYA!

Check how Skindeep has evolved through the design process! 
Final Design Mockups
Final Thoughts

I took on this project to better my design skills as well as have my hand at every role of the process. Building Skindeep from the ground up was definitely a challenge but the experience allowed me to learn the importance of taking feedback, testing and what it means to be a human-centred designer.

My goal for Skindeep was to make a product that unifies tattoo resources seamlessly into the palm of users hands. The links that were once detached are now chained together to instill
 trust, interconnectedness, and a sense of discovery amongst all Skindeep's potential users.

In the future, I hope to continue to work on projects that solve complex problems and provide resources for all people to access. I'm inspired by reliable, useful products that bring value to communities, industries and the lives of the people that use them.

Thank you!
Trust, Interconnectivity, and Discovery.

Skindeep
Skindeep Tattoo App- UX Design case study
Published:

Skindeep Tattoo App- UX Design case study

Published:

Tools

Creative Fields