Case study that addresses all the aspects from the contextualization of the problem, the initial exploratory research, benchmarking analysis, information architecture and usability testing.
Category: Case Study
Although it has always been Thomas*'s dream, owning his own tattoo studio, that always seemed out of reach for him. However, something changed when, through common friendships, Thomas met Emma and Michael, both also tattoo artists and enthusiastic about their work.
After a considerable time of conversations, doubts, and research, the three decided to join forces and open a studio together. But financial problems led them to question whether the venture had been the best decision. The friends, despite the difficulties, agreed to continue with the business and try to make it profitable after an established period.
The end seemed close when the financial situation did not improve and one of the friends had to deal with a family tragedy. However, mutual support led to a last effort for the studio's survival, they went after a professional orientation.
With the help of an agency, the three friends were able to prospect more customers using social media and an incipient website. The growth in the profitability of the business was enough for them to decide to proceed with the studio. A misunderstanding caused by the managerial aspect of the business, however, almost put an end to the partnership. But finally, taking into account everything they've been through, the support of each other in times of difficulty and the realization of being able to have their own business and do what they love, made it possible to overcome one more obstacle.
So, after a period of growth and constant improvement of the brand using the digital medium, the friends decided to reformulate their visual identity and improve the studio's website.
* Due to privacy, personal details and confidential information in the project have been altered or omitted.
Creation of a website for a tattoo studio with the objective of prospecting more clients, clearly exposing the work done by them, and answering questions that potential users might have.
Source of research: books, articles, reports, and advice from professionals.
Information #1: Tattoos can represent much more than something symbolic and personal for the individual, but a culture and way of life.
Insight: The studio can be seen as an integration center for customers and enthusiasts. Whether through the creation of groups or communities on the main social networks, holding events and physical meetings, or other interactive aspects, the studio will be able to provide this feeling of belonging and fraternization.
Information #2: Pre and post tattoo care is important and should be made available to everyone and easy to understand. In addition, it is necessary to have the proper care provided by professionals in the area and other specialists, such as dermatologists.
Insight #1: The creation of e-books or care guides can be developed taking into account the context of the client. That is, an e-book developed for those who do not yet have a tattoo and are researching about it, for example, can be made available in order to solve the main doubts and generate a qualified lead for the studio. After the first tattoo, the client can receive a more comprehensive version of the e-book with current and future care recommendations.
Insight #2: skin care should not be restricted to tattoos. Therefore, a partnership with health clinics or professionals in the field, such as dermatologists, can be a fruitful collaboration both socially and economically for all involved.
Information #3: prejudice against tattooed people must be fought in all areas of society. An article by Khan e Pandey (2020), showed that candidates with tattoos and piercings felt discriminated against in selection processes.
Insights: the studio will be able to use its authority and knowledge of the tattoo culture to serve as an open space for dialogue and denunciation of prejudices suffered by people. In addition, partnerships with news outlets and social researchers are recommended to study and categorically expose any prejudiced biases that may exist.
The CSD Matrix can be maintained throughout the project to structure certainties, assumptions and doubts – hence the name CSD. It is most often used at the beginning of a project to dynamically obtain information about the context of the challenge (LIVEWORK, 2018).
CSD Matrix Image pre-interview
Technique for collecting information on a given subject in order to learn what people think, know, represent, do, and argue (SEVERINO, 2017).
In addition to seeking to understand the managerial part of the studio, the CSD Matrix served as a basis for the elaboration of questions that sought to confirm or reject the assumptions raised and resolve the main doubts. The interview was conducted with one of the studio owners.
A doubt raised about the demographic issue showed that despite the male public being more prevalent, the difference was not considered significant and, as a recommendation, a more specific mapping of customers was recommended and, if possible, the application of CRM software (Customer Relationship Management) for future confirmation.
Another highlight is the fact that the studio doesn’t have a proper post-sale strategy structured. Thus, customer loyalty may be being undermined.
Post-interview CSD Matrix
Persona is a portrait of the target audience that highlights demographics, behaviors, needs and motivations through the creation of a fictional character, based on data extracted from research (TEIXEIRA, 2014). Personas enable designers and developers to empathize with consumers during the design process.
That is, after understanding the profile of the studio's clients through the previous research stages, mainly through the in-depth interview, it was possible to develop a character that could represent the demographic and psychographic aspects of the target audience.
Thus, it will be possible to use it as a base in the posterior stages of the project and, consequently, build a website in a more empathetic way. Furthermore, the persona will be useful in future marketing efforts.
Persona created after analyzing demographic and psychographic data.
Benchmarking is the process of comparing a company's key business metrics with those of its competitors. This helps organizations identify areas where they can improve their own performance by reducing costs, optimizing the sales funnel, and improving the product. Therefore, companies can deliver more value to users (LEVY, 2015).
As a research method, it was chosen the indexation by search engines with a criterion of relevant results. Ads were not considered. Geographic segmentation was used and based on four variants: 3 local tattoo studios (same state), 3 national tattoo studios, 3 local overseas tattoo studios, and 3 national overseas tattoo studios. Examples of keywords used:
In order to get an organic result from the search engine, a VPN server based in Brazil and USA was used in conjunction with an Incognito Window in the browser.
With this, it was possible to obtain results with a greater visual and technological variation of the sites, which can provide different insights compared to a search without segmentation.
Using as a basis the method proposed by Joyce (2020), metrics were elaborated with the objective of identifying the main business choices made by sites with similar proposals. The method consists of four steps:
For the choice of what should be measured, accessibility metrics were chosen using the online tool WebAIM and for performance, best practices, and SEO using the tool Web.dev. On how to measure, different scores were prepared based on the chosen analysis metrics and presented in the final report of each website.
Result of performance metrics, best practices, and SEO of the first and second site analyzed.
Technologies used by one of the sites analyzed.
Report of each analyzed site documented in the software Notion.
Through the analysis of each website, it was possible to compare the information architecture, the platforms or frameworks used in the development of the website, different ways of visually presenting the content, and benefits or information offered on the website of the tattoo studios that can be adapted in the context of our project.
Despite being similar, a Site Map and a User Flow are used for different purposes, and each has its specificity. Documentation through a Site Map organizes a system into main groups, categories or sections, and other pertinent information (BULEY,2013). While a User Flow portrays a series of operations performed by the user to achieve a goal (TAKAHASHI,2016). These actions include clicking (or tapping, when it comes to the mobile universe), entering text in a specific field, scrolling an item, etc. (AUER; LANGMANN, 2019).
Therefore, a mixed approach of the aforementioned methods was chosen in this first phase of information architecture, since it is not a complex system, with many variations of flows, but that allows small choices by the user during navigation, such as the search for pricing or not on the home page.
Site Map.
Wireframe is a basic design of a project’s structure. That is, it can be characterized as a “skeleton” of the system, as it visually exposes how its interconnected parts form the final project (BULEY, 2013).
While a low fidelity wireframe provides agility and creates a base model for the navigation structure of the layout, a high-fidelity wireframe has more details (SILVA, 2020).
Thus, the wireframe in low fidelity was used at first to validate the structured navigation developed in the Site Map and, after the necessary corrections and approval of the concept, the wireframe in high fidelity was developed.
Wireframe in low and high fidelity.
Prototypes are designed with the aim of testing the product so that possible errors can be discovered and corrected (RAJESHKUMAR et al., 2013). That is, it is a simulation of how the main interactions in a digital product will work (PEREIRA, 2018).
The prototype was built for both the web and mobile versions of the site.
Prototype designed for both web and mobile versions.
In 1998, the International Organization for Standardization (ISO), “an independent, non-governmental international organization with a membership of 167 national standards bodies.”, defined “usability” as:
The efficiency, effectiveness, and satisfaction in which specific users achieve specific goals in a specific context of use (ISO 9241 apud DASH, 2014). In the new version of ISO 9241-11, the 1998 concepts of the standard are maintained and elaborated, with the original definition of usability extended to application in systems and services (BEVAN et al., 2016).
The model prescribed by ISO follows three criteria as the components of usability:
In usability testing, users are selected because they correspond to a previously defined profile type, perform specific tasks on a system, website, or any other type of product (FOX, 2016).
Despite the famous phrase in the research area that states:
“Five participants are enough to identify 85% of usability problems.”
This is not corroborated by some authors and can be considered a myth. The correct way of reasoning, according to Travis e Hodgson (2019) would be:
“Five participants are enough to identify 85% of the usability problems that affect one in three users.”
Therefore, for software or websites, the probability of encountering a problem can be closer to 10% to 5%. According to Sauro (2010), to reach 85% certainty that a problem that affects 10% of users is detected at least once, up to 18 people or less may be required.
The number of 18 users was chosen based on the aforementioned information and the choice of participants considered the demographic and psychographic profile prepared in Persona. The screening form was made available in groups and websites of tattoo artists and enthusiasts and developed through Google Forms.
For recruitment, there was a specific effort so that at least one participant did not have a high level of dexterity with technology, because in addition to the importance of considering the fact that many people are still starting to use cell phones and computers, it is possible that the user generate insights in the usability test that might not happen to those who already have experience with the digital universe, both web and mobile.
Tasks are actions performed by the user with the purpose of achieving a specific goal. Different users can use different approaches to accomplish a given task (PEREIRA, 2018). Therefore, according to the main objectives and metrics of the project, examples of elaborated tasks include:
1- Look for pricing information from the home page (h.p.)
1.1- Look for pricing information from the blog page, to simulate the user starting the journey through the site through search engines (b)
2- Check if the site has photos of tattoos already done on other people (h.p.)
2.1- Check if the site has photos of tattoos already done on other people (b)
3- Look for the studio address (h.p.)
3.1- Look for the studio address (b)
4- Solve the question: what documents do I need to take with me on the day of the tattoo? (h.p.)
4.1- Solve the question: what documents do I need to take with me on the day of the tattoo? (b)
5- Schedule a tattoo for next week. (h.p.)
5.1- Schedule a tattoo for next week. (b)
6- Meet the team of tattoo artists at the studio (h.p.)
6.1- Meet the team of tattoo artists at the studio (b)
Considering the variation of each elaborated task, that is, it can be started on the home page or on the blog page of the site, they were divided into two groups of equal proportion. While one group started the test on the home page and performed the tasks in sequence, participants in the other group were asked to return to the blog page after they had already completed the task.
Observations:
In the case of tasks elaborated in a more open way, such as:
“Imagine you would like to meet the team of tattoo artists at the studio, how would you do it?”
It can cause users to get into a tangent and, even though he/she is aware of the initial instructions passed, and verbally exposing, for example, what he would do in a given situation instead of showing it through the prototype. Therefore, I use verbs in the imperative.
Unlike an in-depth interview, in which we could seek to understand more deeply about the way of thinking and ask the user to elaborate more on what he meant, usability testing is used to evaluate the efficiency and effectiveness of the task. Therefore, there was not much interaction with the users.
Each task obtained a result considering the metrics of efficiency, effectiveness, and satisfaction, in which:
- Efficiency: was the task performed in a time consistent with the average? Did the user have any kind of difficulty?
- Effectiveness: Was the main objective of the task accomplished?
- Satisfaction: did the user demonstrate dissatisfaction in performing the task?
Thus, it was possible to establish possible points of improvement according to the information obtained. As an example, in the report for task 5.1 (b):
Task: 5.1- Schedule a tattoo for next week. (b)
Information: Convoluted, as the user must perform a considerable set of steps to achieve the objective and, consequently, the time spent on the task was not ideal.
Insight: A floating WhatsApp button on the lower right side of every page can make the user achieve the appointment conversion more efficiently.
Conclusion: The seriousness found is accentuated by the fact that, after a search on the site, the user decided on the studio and wanted to set an appointment. Thus, a qualified lead should have a fluid navigation experience with the least amount of friction possible.
In addition to the deliverables and the documentation of the entire process carried out, an incipient Design System was developed for the tattoo studio. Thus, if the need arises for the creation of a new web page, marketing strategies, or services by a contracted designer, the organization will be properly equipped with a branding guide, guidelines, and recommendations for the use of the main components.
The importance of each stage performed is highlighted, since all have an important interconnection during and at the end of the project. In this way, an objective that is not clearly defined or a user profile prepared without proper data, for example, can compromise the remaining phases.
Ultimately, the project was considered a success by the tattoo studio. Not just for the visual and structural result of the site, but for the focus on users and insights generated during the research. I thank those involved for their time and consideration, for the trust, and for sharing the philosophy of empathy with each person, regardless of the social, political, or economic aspect.
Horti - Concept of a Grocery App
A fruit and vegetable chain would like to develop an application. Follow the initial research process to the concept presentation.
© 2022 Belisiario. All Rights Reserved.
Connect
