✦ SCROLL ✦ TO VIEW CASE STUDY
✦ SCROLL ✦ TO VIEW CASE STUDY
✦ SCROLL ✦ TO VIEW CASE STUDY

role

role

UX/UI Designer

time

time

80 hours

tools

tools

Figma, Figjam

project type

project type

Student Project

OVERVIEW

Community is a big part of tattoo society, however, despite being diverse, the ability to find artists that fit a customer’s criteria may be difficult to achieve without the proper elements to aid in their quest.


Inklink provides a social media aspect for users to book tattoo artists as well as provide a platform for both customers and artists to virtually design tattoos by integrating an AR system.

the challenge

Tattoo enthusiasts need a hub for both artists and customers to share and find ideas, design tattoos with one another, and have an easy booking system to fulfill their needs.

the solution


  • Design a platform that gives users ways to discover and book tattoo artists.


  • Provide tattoo artists an easy way to collaborate tattoo designs with customers.

  • Design a platform that gives users ways to discover and book tattoo artists.


  • Provide tattoo artists an easy way to collaborate tattoo designs with customers.

01 research

For business reasons, I've decided to do some research on both the customer and the tattoo artist user base in order to understand what each party prioritize during the tattoo process. Given that I only have my own tattoo experience to work off of, I opted for secondary research to fill in the gaps I would need to understand my demographic.

research 1 - competitive analysis

research 1 - competitive analysis

I’ve researched some top competitors in the marketplace in order to find similarities of how they display their app or website to Inklink. I then compared and contrasted each apps' similarities to find the most important aspects that could be potential elements to add onto Inklink.

Competitor analysis insights

Competitor analysis insights

Competitor analysis insights

Filtering system to accommodate user preferences quickly, which leads to great customer booking experiences and allow for ease of preference selection.

Filtering system to accommodate user preferences quickly, which leads to great customer booking experiences and allow for ease of preference selection.

Filtering system to accommodate user preferences quickly, which leads to great customer booking experiences and allow for ease of preference selection.

Viewing an artist’s profile should resemble a portfolio for easier viewing. Artist's style and abilities are important to display for customers to make decisions.

Different experience screens for both customer and artist. Design needs to accommodate for both the customer and artist user journey.

research 2 - user interviews

I conducted remote user interviews for two categories of users: tattoo customers and tattoo artists. The main aspects I wanted to discover were how artists are found by customers and what the design collaboration process is like for both parties. There were a total of 6 customers and 2 artists.

ENTIRE TATTOO PROCESS IS TIME-CONSUMING

40% of customers report that getting a tattoo is time-consuming and needs to be planned ahead of time.

COLLABORATION ISSUES

COLLABORATION ISSUES

50% of customers report that they do not prefer final design presentation/ collaborations/iterations to happen on the day of getting tattooed.

CONFIDENCE IN FINAL ITERATIONS

CONFIDENCE IN FINAL ITERATIONS

33% of users are unable to communicate efficiently about preferred design and report dissatisfaction for their final tattoo.

How might we help new or seasoned customers find new artists and have the ability to design tattoos together?

02 synthesis

SYNTHESIS 1 - PERSONAS

SYNTHESIS 1 - PERSONAS

Two personas emerged — Jamie, the tattoo artist and Peter, the customer. Each persona brought on their own perspectives of the tattoo journey while keeping in mind their demographics, experiences, and backgrounds. I wanted to pinpoint the major key points that both sides of the tattoo journey experience and could provide insight on creating solutions that addresses the problem statement.

persona findings

persona findings

Jamie and Peter both have similar challenges that can grouped into common themes: connecting reputable artist with client, the need for easy collaboration on tattoo designs, and lack of convenience. Keeping these findings in mind, I took into how the challenges can affect the design decisions.

CONNECTING REPUTABLE ARTIST WITH CLIENT

CONNECTING REPUTABLE ARTIST WITH CLIENT

Difficulty finding artists who comply with certain constraints client set up

Advertising needs to have a far reach to instill the perfect artist/client match

EASY DESIGN COLLABORATION

EASY DESIGN COLLABORATION

Iterations can be time-consuming and anxiety-inducing

Lack of confidence in communicating design ideas, which can cause unsatisfied outcomes

LACK OF CONVENIENCE

LACK OF CONVENIENCE

Tattoo resources, notes, communication, and inspiration comes from different places

Half-baked or abandoned plans occurring due to lack of set expectations

Implementation of a homepage full of curated images from artists that align with clients' tastes

Search function with specific filters

AR function that showcases changes and notes in real time

Virtual collaboration = time-saver, as iterations can be done anywhere

Implementation of communication, inspiration, resources to be all in one app

Development of a tattoo request form

SYNTHESIS 2: feature prioritization

SYNTHESIS 2: feature prioritization

I compiled features that were feasible to include without bloating the app. The features I wanted to focus on were the ones that would lend to a social media-esque outlook due to familiarity of navigation as well as any features that ensured easier tattoo collaboration between artists and customers. These included:


  • "For you page": Full of inspiration images for designing

  • Direct messaging: Keep in contact with artists

  • Booking page: Helps artists stay organized with their schedule

  • Search with filters: Narrow down searches for a streamlined experience

  • AR Collab tool: Despite being high effort, the impact is also high due to easy and fast collaboration between artist and customer as the tool is virtual.

project goals

project goals

Before moving onto the drafting phase, I wanted to cement the goals that I wanted to accomplish. At this point, it was necessary to create flows for both the customer and artist.

03 IDEATION

03 IDEATION

IDEATION 1: SITE MAPPING

IDEATION 1: SITE MAPPING

For the customer site map, I focused primarily on implementing features that ensured direct communication between artist and customer, connecting/finding artists, and quick collaboration of tattoos designs. I wanted to keep within the vision of Inklink — which was to craft a streamlined and user-friendly experience while providing familiar systems to use. My main goal for these features was to provide the customer an engaging way to find, book, and work with their chosen artist.

ideation 2: user flow

ideation 2: user flow

Keeping the features I wanted to implement in mind, I crafted a visual representation of a customer’s journey while navigating certain aspects of the app. These flows incorporate the process of booking artists, using an AR tool, completing the task, and using a filter function.

ideation 2: early concepts

ideation 2: early concepts

With the task flows in mind, I sketched out some ideas in order to understand the layout of the screens. I explored potential solutions that would keep the user’s goals in mind while implementing a familiar and user friendly interface. Because I wanted to implement an AR design collaboration system, a mobile app was chosen for its ease of camera capturing and accessibility.

ideation 3: digital wireframes

ideation 3: digital wireframes

In the perspective of the customer, there were 5 main elements on the navigation bar that lent to the aspect of community: location, search, collaboration AR function, chat, and profile. Artists have a slightly different navigation bar — replacing the location widget for a booking widget.


branding

branding

Once I have established the wireframes and user flows, I crafted a style tile complete with the brand’s color palette, font choices, buttons, and cards. Inklink’s overall vibe encapsulates the feeling of sophistication, classiness, and artistic abilities. Due to these values, I opted for a primary dark mode — emphasizing on grey monochromatism with bright red accent colors for visual interest.

ideation 4: high-fidelity screens

ideation 4: high-fidelity screens

I focused on creating high fidelity wireframes that emphasized greatly on easy navigation, given that tattoo planning is already a daunting cognitive load on a customer’s mind. In order to translate the digital wireframes to high fidelity in a refined way, I ensured that the interface was easy to navigate while keeping in mind the app’s individuality.

Homepage

Search with Filter

Search Results

Artist's portfolio/page

Basic Info Booking Form

Tattoo Specifics

Upload Inspiration

Set Date

Booking Receipt

AR tool

Upload Design

Customer POV AR Tool

Artist Collaboration

Direct Messaging

Message Artist

Booking

Booking Details

04 TESTING

testing 1: usability testing

testing 1: usability testing

To understand how users will use the app in a real-life setting, I set the following goals:

  • Accomplishing each flow in the shortest time possible

  • Minimal errors or roadblocks that prevent task completion (ensuring app is easy to navigate)

  • Build consciousness of missing or excess features that could be added or removed

priority revisions

priority revisions

In response to the feedback received from the usability testing, I took the most common and prominent pain points and reiterated them.

MISSING ZOOM FUNCTION

Users experienced issues with the Body Placement model as it was too small to see, which may cause accessibility issues. They suggested having a zoom-in element to enhance visibility.

CONFUSING FILTER ICON

It was not clear what the stylized filter icon meant. In order to locate the filtering aspect better, the icon was changed to something more familiar.

MEET INKLINK: AN ALL IN ONE APP FOR TATTOO ENTHUSIASTS

Booking an artist

Booking an artist

Customers are able to use the filtered search function to find an artist or studio to fit their tattoo needs. From here, users are able to browse the artists' portfolio and book them.

collaboration tool

collaboration tool

Both artists and customers can collaborate virtually in real time through a tattoo AR tool. This encourages both users to plan ahead of time and prevent mental cognitive load.

chatting function

chatting function

In order to communicate with artists and create a paper trail, customers and artists can access the chat function to send messages to one another as well as send payments.

Booking calendar

Booking calendar

As a business/artist exclusive function, artists can view their bookings and the details within the calendar. This helps artists keep their day organized.

REFLECTION

learnings

  • The creation process for an app on dark mode was a lengthy one — given that there were a lot of different factors that went into it compared to light mode. There were different rules and different ways elements were situated on the page which posed a challenge. In the end, I managed to mostly implement a AA ratio on the color palette chosen.

  • Building an AR system was a great learning curve for me; it made me explore different routes to seamlessly implement tattoos onto a real life person. I’ve taken inspiration from features from competitors such as the use of filters on a camera and phone editing software.

  • The feedback gained from testing was largely helpful in iterating the app. Even if it was concerning that there was quite a lot of users who couldn’t finish the task, it was an eye opener on what to include and what to remove from the prototype.


    I was previously unfamiliar about the process artists use to complete their job. Now I have a better understand on what artists usually prioritize for their work, and surprisingly, it wasn’t the tattoo session itself but more so the preparation it takes to get there.

if there was more time...

  • In order to streamline the process even more, I would have optimized Inklink for tablets because a large amount of artists use tablets to draw their tattoo designs.

  • Due to time constraints I only stuck to screens that were relevant to the goals I was trying to achieve. If given more time, I would have prototyped the location and profile tabs for the customer, and an image posting system for artists.

  • A lot of the solutions provided focused more so on the customer's POV, given that most of the user research participants were customers. Gathering a larger tattoo artist participant pool could have lent for a deeper understanding to the artists' user journey.

  • Community is one the key values of the app, therefore, direct messaging for artist to artist and customer to customer could be worth exploring.


where to next?

@ 2024 Estella Hoang

estella.designs@yahoo.com

where to next?

@ 2024 Estella Hoang

estella.designs@yahoo.com

where to next?

@ 2024 Estella Hoang

estella.designs@yahoo.com