top of page
tiptapp header.png

A semiotic study of Tiptapp

A study of signification systems designer-to-user

Project background

This project focused on the semiotic study of digital services. The main idea was to choose a system that we were familiar with and we could analyze from a semiotic perspective. This was part of an individual assignment in a course called 'Human Science in human-computer interaction'. I chose a service called Tiptapp, which is a Swedish marketplace that democratizes the circular economy. The user can post ads on items such as a couch that they want to recycle, donate, or transport. Other people can then request to help out with those tasks.

A semiotic inspection examines different signs the user is exposed to while interacting with computing artifacts. Designers use signs of one or more signification systems, to communicate with the user. The most common signs used in computer system interfaces are: widgets, images, words, colors, dialog, structures, and graphic layouts, etc (Souza, et al., 2006).          

Tools

Pen, Paper, Figma 

Team size

only me

Goals

  • Analyze the metacommunication between designer and user.
  • Come up with some proposals for changes.

My role

Project leader, Research, Visual design 

Timeline

2 weeks

I began by doing background research on Tiptapp and their target group. Then I applied this Semiotic Inspection method by Souza et al. (2006), where you analyze the signs to which users are exposed in the interaction. I wanted to determine if the designers of Tiptapp succeeded to communicate the required actions for the users to achieve their goals. The steps were:
  1. An analysis of metalinguistic signs
  2. An analysis of static signs
  3. An analysis of dynamic signs
  4. A comparison of the designer’s metacommunications from previous steps
  5. An evaluation of the inspected system communicability           

Process

Figure 1: Tiptapps home page 2019
tiptapp2.png
I continued by inspecting the dynamic signs which made me realize how every icon in the top menu guided the user to the same filter tab instead of the individual filter. This can be helpful as it brings the user to the correct tab but could be improved to bring the user to the corresponding filter that they selected.

The fourth step, which is a comparison of the designer’s metacommunications from previous steps, allowed me to compare the previous steps with each other. This made me think about how the user could interpret the signs and messages, and if they were linked with the designer's intent. The final step was an evaluation of the service and its communicability to the user. I analyzed the home page, their filter options, and the introduction page. In the table below is a list of relevant signs and their importance. I found a few static and dynamic signs I wanted to provide optional solutions for.
Table 1: Static signs that are used to represent features of the system
1tabell tiptapp_2x.png
The first, the analysis of metalinguistic signs, allowed me to investigate who the intended users were. I looked at the choice of words, documentation, and help that was provided. Tiptapp used words such as “easy”, “fast” and “cheap”, which lead me to believe that it was directed to the everyday person that was looking for a cheaper option to a moving company and/or waste disposal.
 
When I analyzed the static signs: the layout, structure, menu, and toolbar. I found two icons that I thought might be a bit misleading for the user. One of them was a recycle symbol with a locket in the middle (for recycling items) and another was a flatline symbol (for available ads). The universal recycling symbol defined by the European Commission usually provides a code in the middle to identify the material it’s made of. But this symbol had a locket in the middle that didn’t seem to fulfill a purpose. The flatline icon allowed you to filter out inactive ads, which I found unnecessarily and confusing. I also wondered if there was a better option for a collapsed menu icon in the left corner, due to its similarity to the filter icon to the right.

Findings

Solution

This is the final redesign of Tiptapp, I created a different menu bar that showed options such as settings, chat, create an ad, and profile. This is to make it more clear for the user to find what they are looking for. I removed the locket from the recycle triangle and gave the filter options different colors.
tiptapp redesign 2,0.png
Figure 2: My redesign of Tiptapps 2019
bottom of page