www.davoranic.com Open in urlscan Pro
34.249.200.254  Public Scan

URL: https://www.davoranic.com/work/ink-tank-app
Submission: On June 26 via api from US — Scanned from DE

Form analysis 0 forms found in the DOM

Text Content

DAVOR ANIC 
WorkAboutContact




IOS | CASE STUDY


INK TANK APP

Your new way to find tattoo and connect with an artist in your area.


Project type

Solo project - Concept

Duration/time

Six month - Summer / Fall 2018

Role

It's a solo project that I researched, ideated and prototyped the entire user
flow and interface


THE CHALLENGE


FIND THE PERFECT TATTOO

Create a user-friendly web app that offers professional guidance to help tattoo
hunters find the perfect tattoo while comfortably exploring a range of
possibilities.




POTENTIAL SOLUTION


CONNECT WITH THE COMMUNITY

The app should provide the complete experience for every tattoo hunter in their
search for a new tattoo. The flexibility of connecting and communicating
directly with the right tattoo artist helps ensure that the user chooses a
tattoo that suits their personality and needs.


DESIGN PROCESS


UCD FOR A BETTER PRODUCT

Ink tank app is a solo project from my Carrerfoundry UX Designer course. By
infusing a user-centered design framework into my creative process, I was active
at every level of creation, from research to the last iteration.


RESEARCH


IDENTIFYING POTENTIAL 26M USERS

To better understand the user and create a product that suits user needs, I
began my journey with solid research and a competitive analysis to learn more
about the tattoo community and to understand the current market. Highlighting
the following data, we get the scope of the market.

36%
18-25-year-olds in the US have at least one tattoo
40%
26-40-year-olds in the US have at least one tattoo
32%
of tattooed people believe they are tattoo addicts
17%
partially regrets getting a tattoo
$ 1.65 billion
annually on tattoos in the United States alone
18-40
year-olds is our target audience
26M
potentional users just in the US


COMPETITIVE ANALYSIS


CAN WE TALK?

In my competitive studies, I focused on two companies that are currently on the
market: Tattoodo and Ink Hunter.  While Tattoodo is a well-oiled business that
is rapidly expanding, Ink Hunter is a startup company with big ambitions and an
unclear business plan. They both share a common deficit that can lead to user
frustration: They both lack an easy way to communicate with tattoo artists.

Tattoodo UI
Tattoodo
S.W.A.T Profile

Ink Hunter UI
Ink Hunter
S.W.A.T Profile
Ink Hunter
UX Analysis
Click to see more:


The next step was to conduct the in-person user interviews to gain a better
understanding of their behavior and needs with a focus on:


 * • Discovering why users desire tattoos.
 * • Understanding users fears and doubts when it comes to using online services
 * Uncovering user search habits when seeking general inspiration and when
   looking for a specific tattoo design
 * • Discovering users communication habits. What is the most useful way of
   communicating with strangers and business?


USERS INTERVIEWS + AFFINITY MAPPING


FEARS, INSPIRATIONS AND TRUSTING

Using an affinity mapping process, I analyzed the data and identified findings
and dived into a user inside:


 * Users want to see a straightforward, step-by-step process of tattooing
   detailing all necessary information to help manage possible fears and
   misunderstandings.
 * Artist portfolio and presence on the Internet in forms of blog posts, videos,
   and multiple communication channels to artists so that they can build trust
   with users.
 * • Setting a health standard in an understandable format can help users
   overcome the fear of disease and infections.
 * • Users requer at least 2-3 type of communication channels to reach tattoo
   shops.
 * Users need to be able to locate the app and all related blog posts via a
   Google search.


USER PERSONAS


MEET ALEX AND ASHLEY

The challenge was to identify the user needs and to build my personas. The
tattoo hunter was missing focus for inspiration,
and an app accommodates his lifestyle.
After consulting with my tutor and mentor, I reviewed interview notes and found
the missing links to a successful tattoo search: collecting and showcasing
tattoo images and sharing photos with a tattoo artist during communication.
Later, those findings helped me craft the main features of the app.

Click on images to see more.



USER JOURNEY MAP


STARTING A CONVERSATION

After revealing users’ needs and goals, I wanted to create a more substantial
narrative.

Whit Alex, I tried to lay down the most critical scenario for Alex: make his
online communication with the artists flexible and what actions he needs to take
to get to the right artist. For Alex, I laid down the most critical scenario:
Make his online communication with artists flexible and tell him what actions he
needs to take in order to reach the right artist.

For Alex to start chatting with Ashley, we had to step back and allow Ashley to
create an account and showcase her works within the app. As a content provider,
Ashley's role is essential for the sustainability of the project. The most
significant friction I noted in this first step was creating and presenting her
work.
‍

Click on images to see more.


USER FLOW


CREATING AN INVITING ENVIRONMENT



The fundamental issues I wanted to tackle within Alex's first flow was to create
an inviting environment that allowed him to explore the app without signing in.
By crafting his collection of images, Alex was able to form a starting point for
communication with the artist that may help them mover forward to booking an
appointment.

Using AR technology as an assistant, we can give users the option to visualize
the end product and experience its impact. With the second flow, I wanted to
eliminate potential fears and regrets that we noticed in user research.

View Flow 1
View Flow 2
User Flow 3 - Tattoo Artist

The last user flow was reserved for Ashley to create an account and showcase her
work. Acknowledging the pain points of a sign-in process, I wanted to create an
easy-to-follow, step-by-step experience that accommodates­­­­­­­­­­­­­­ artists
of all digital literacy. Sharing the profile on social media, I intended to
create an emotional stage of gratification by bringing the process to
completion.

View Flow 3
User Flow 1 - Tattoo Hunter
User Flow 2 - Tattoo Hunter


SITEMAP


STRUCTURING THE ENVIRONMENT

The initial idea for constructing the app's IA derived from Alex's flow to reach
the tattoo artist and schedule the appointment. To do this, he needed to go
through the following steps: look for, search, connect and confirm. Those four
steps that can intersect in action or can work independently. Keeping these
thoughts in mind, I realized that the first three steps needed to represent the
app's first tier as they will be functions that Alex will use the most.

Card sorting method helped me refine the initial version of the sitemap. Using
the merge method, I analyzed the first and second tiers of the sitemap using
clusters with more than 60 %. The title of the “Tattoo” category changed to
“Search;” and “Connect” became a more-coherent “Messages.”




LOW-FIDELITY PROTOTYPING


SHAPING UP STRUCTURE

Even though I focused on structuring the app's navigation system, I laid down
four features: checking daily feed and saving images to My Boards; searching for
an artist; connecting with the artist; scheduling the appointment + onboard and
signing in as the app's starting point.

The app's navigation structure ended up becoming an easy-to-use nav bar at the
bottom of the screen with four main categories for the first tier.





MID-FIDELITY PROTOTYPING


OPTIMIZING PERFORMANCES

Optimizing performances Having a conceptual framework, I switched from pen and
pencil to mouse and trackpad to start to shaping each screen into a functional
action chain, keeping in mind my four main features. This iteration brought
screen number reduction by optimizing performance.  As always, I try to use a
three-click rule when refining each function in this iteration.




USABILITY TESTS


FINDING FRICTIONS

After updating the mid-fidelity prototype with images and creating a usability
plan and a script it was time for the moment of truth! I tested the mobile
version of the app with 6 participants in person. I had a problem with
scheduling the appoitments in the short timeframe. To solve the problem I set up
a mobile testing lab and conducted tests in participants’ homes and offices.
With this action, I created a comfortable environment allowing participants to
relax and engage in the study.

The goal was for first-time users to evaluate the app’s main functions and to
determine frictions that can affect the app’s usability.  

I used the Jakob Nielsen scale to determine flaws within the experience and
product.





REFINING THE DESIGN


APP’S UI

With knowledge of usability testing and collected feedback from my fellow
designer, I stepped into the last phase of creating the design language system
to be in-line with the iOS Human Interface Design and iterate the app's UI.



You can find the app’s complete design language document on the link below.





FINAL ITERATION


INTERACTIVE PROTOTYPE

By cliking on the screen and following the blue fields you can test 4 main app
feature :
• Login
• Save a image to a new board
• Find the artist near you and send him/her a message
• Schedule the appointment from them message


What do you think?

Would like to hear your feedback!


davor@davoranic.com
or connect via



© 2021 Davor Anic All rights reserved