This article will tell you a true story about a startup led by a small team of enthusiasts.
Bandlink is a service that allows musicians to quickly and conveniently upload and organize information about their upcoming concerts and performances, release or create a full-fledged website, without attracting developers.
To date, Bandlink has already helped 10 thousand of musicians to share important information with their fans, which has provided us with almost 1.5 million visitors. Unfortunately, before creating Bandlink as it is now, we were destined to make the same mistakes other new teams made. And some teams are even making these mistakes right now. We want to share our story with all creators of digital products because this certainly is a useful experience.
The history of Bandlink begins with its creators’ sincere love for music and the desire to devote as much time to it as possible. It was decided to develop the product for those who shared our interests – people with hearts full of music, eager to follow their favorite artists. We chose a name for the service – “Bandtraq”, decided what features we want to see in it, conducted a survey of potential users and began the developing. From our point of view, Bandtraq was supposed to be a platform where all the information published by a musician was conveniently organized and categorized. The idea to provide information about upcoming concerts, new tweets, and releases in one place seemed beautiful to us.
We spent a lot of effort on development, and in our opinion we made a good product – Bandtraq worked perfectly, but, unfortunately, was not getting popular. The increase in amount of unique users and new registrations was very little. We conducted a number of promotional activities, but still did not receive the increase we were looking for. We found ourselves in a situation where we spent half a year developing a good-quality product that was interesting only to a very little group of people.
Our forces were running out, but we tried to realize the mistakes that were made. This realization allowed us to carry on developing a good and useful product.
The main problem was that after the decision to create Bandtraq, we did not pay enough attention to the practice of classical UX research. At the time of creating Bandtraq, we had only had a general idea of our target audience and its needs. Also, during the development period a competitive offer appeared on the market – it was basically duplicating our service functionality for free. This fact served as a basis for the subsequent problems associated with the Bandtraq monetization.
Looking back with the experience we already have, it is worth to mention that it is practically impossible to work with the target audience within the framework of the above-mentioned project (or other projects like this), even in the absence of competition. There are two main reasons for this:
After we analyzed the existing problems and looked at our product from the inside, we researched the market again and noticed something:
For 2018, the number of downloads of music releases from iTunes has decreased by 27%, and the sale of music albums on physical media has decreased by 41%. On the other hand, there was a growth in streaming services popularity. Today, streaming services occupy 75% of the music market, leaving only 25% to other ways of listening to music. Musicians regularly publish their releases at various platforms and services, such as Spotify and Apple Music. The number of streaming services is constantly growing, and this forces musicians to publish their work on as many services as possible. They understand that streaming services operate on a subscription system, and if a person has paid for a subscription on one service, he will not be able to listen to a song or an album until it appears on this service.
This makes musicians publish posts that have a really large amount of links to various streaming services. We have distinguished this ‘pain’ because of the analysis of our service. Studying this problem in more detail, we found several possible solutions. Bandtraq had led us to a market in which our technology and experience could successfully fit. Analyzing future competitors, we decided to develop a new product, using the previous technology stack as a base. We began with a UX research in order to test our hypothesis and evaluate the expediency of moving from B2C to B2B.
We have interviewed different musicians and other people that are connected with the music industry in one way or another. The purpose of the interviews was to test the hypothesis that was born during the period of our reflections on the work done. To skip ahead, our hypothesis was confirmed – almost every interviewee who had to publish releases complained about the inconvenience associated with social media publishing. We were also able to understand the problem deeper, as well as look at it from different angles.
«It is incredibly tedious to collect all the links to different websites. I tried to paste them into one post, so that people could find everything in one place, but it was rather difficult. It is possible on Facebook, but impossible on Instagram – there is a limitation to the amount of characters that can be put in an Instagram bio» Artyom, 22, cloud rap artist
During the interviews, a lot of musicians have marked Instagram as their top-priority platform, because the audience here is very active. However, it is practically impossible to include links to all streaming services there due to the fact that links can be published only in a profile description, and there is a character limit.
The knowledge about future users of our service received during the interviews proved to be priceless. We used the obtained data to create the Empathy Map in order to distinguish and work out each ‘pain’ of our future Clients. The clustering of problems obtained from the interviews allowed us to form the following points of interest:
Readability (for listeners)
Time (for musicians)
After seeing the ‘pains’ that our future users experience, we began to form the Personas of ideal Bandlink users. It was decided to conduct more ‘in-depth’ interviews with our key Personas – an Indie Artist and a Manager, at that time. Let us get acquainted!
This is Mark, he lives in Moscow. As a child, he had been studying at a music school for some time, but he left it because he did not see any perspective in learning how to play classical instruments. Despite the lack of music education, Mark continues to study music and publishes rap releases regularly. He has a small fan base, but it is not enough to provide him with sufficient income at the moment. Therefore, Mark has to do a part-time job to be able to buy new music equipment and pay the university tuition. Mark needs the university because his parents do not agree that he is being serious about working in music industry and that he is ready to devote his life to it. Despite the difficulties, his fan base (though not so big yet) instills him with hope that he can get a lot more popular.
Alexey was born in St. Petersburg, but he currently lives and works in Moscow. He graduated from the university with a degree in law, but from the very beginning of his studies he could not imagine himself as a lawyer. Alexey is very passionate about music – he devoted a lot of his free time attending concerts of various bands that came to his city. Over time, Alexey’s musical taste became more demanding, however, concert organizers did not invite the musical groups that interested him to the city. After visiting a music festival in Europe, he had an idea to organize a concert of one of his favorite bands in his hometown. Alex took the first step to make music his profession. During his studies at the university, he successfully organized several concerts, earned some money and realized that he wants to continue doing this. The more concerts Alexey organized, the more he got acquainted with various musicians and music managers. Over time, work in the industry and new acquaintances provided him with the opportunity to supervise various musical groups. Alexey is fond of his work – he likes working with musicians and likes to be a part of an industry that inspires millions of people including himself.
By the time we ‘got acquainted’ with the ideal Personas of Bandlink, we began to understand how our product should look like. In order not to repeat the mistakes of Bandtraq, we decided not to develop the ideal version of our service right away, but to develop an MVP.
The minimum statement of work was as follows:
Bandlink on the outside – the page with all the links to a musician’s release. The page should load instantly, have a short link (to fit in Instagram bio) and a ‘Share’ button (to quickly copy the link to the clipboard or share it on social networks).
Bandlink on the inside – an intuitive dashboard that should allow a person that has no IT background to quickly create, edit and manage links. It is also necessary to make links to new releases appear on different platforms automatically, once the link to iTunes is made. This function should relieve the user from the pointless ‘copy-paste’ activities.
In conditions of limited development funds, we could not allow any extra expenses. We decided to fix the requirements before proceeding to the product prototyping. For this, we used FlowMapp.
FlowMapp is a UX platform that helps to collect and organize product development requirements, and also allows you to manage a project throughout the whole process of development using an interactive sitemap.
Using FlowMapp, we have created two projects: Bandlink / Marketing and Bandlink / Dashboard.
Bandlink / Marketing includes all the pages, blog and other information pages of our service, which are designed to attract new users and to show the service documentation.
Bandlink / Dashboard is the service itself. It includes main functional features, dashboard and pages that allow to create new links. Using the dashboard, the user interacts with the product, researches how to solve that or another ‘pain’ of a particular Persona.
Take a look at the screenshot – you can see how intuitively the hierarchical structure is presented. FlowMapp allowed us to design an information architecture and look at the project from another point of view. Detailed information architecture allowed the designer and developers to visually assess the scale of the development from the very beginning, leading to appropriate time requirements.
Using FlowMapp, you can add blocks of information, files, links and comments inside every sitemap card. We have used those functions in order to see the context. The statement of work was always in the cards description, every card had a comments section where we discussed various relevant topics, and we always kept the archives with the content in attachments. We have also successfully organized the navigation through the hierarchical structure of sitemap on FlowMapp, based on prototypes made in Figma. The thing is, when the designer started to create the design, he used Figma as a prototyping tool, but to keep other team members from spending time studying the frame layout logic in his project, he added Main Link to the current frame in FlowMapp, thereby providing quick access to the current frame for the whole team.
After we finished the development of Bandlink’s navigation system, we have started to install labels on sitemap cards. This allowed us to quickly understand at what stage the development of a particular page was at.
Labels that were used during the course of development:
It should also be noted that in the process of development the overall number of labels has increased, and labels became narrower:
We have used such labels on pages where only illustrations or text were required – everything else was finished.
FlowMapp allowed us to properly organize the workflow in which each participant could easily find the necessary information despite being in the office or at an outsource.
Let us return to a stage of Bandlink development where we had the first version of the information architecture ready. In order to think over the experience of interaction with our product for each Persona and to understand the principles of our service better, we started designing User Flow using FlowMapp.
User Flow are finished user scenarios that are built based on the data obtained through conducted UX researches.
Over the course of User Flow development, we highlighted both the entry points for our Personas and their experience in interacting with our product. For this reason, we have developed a lot of User Flows, grouping them with particular Personas. The examples of User Flow are displayed here.
The development of User Flow provided us with better understand of how our service works, and most importantly, made it clear for our users. The next stage was prototyping and release, but we will tell you about these stages in another article.
Looking back, it is important to mention that the time we spent on researches had already paid off in early stages of product development. There is also a classic example of “Before” and “After” – the improvements are clear. Failure of Bandtraq and then integration of preliminary UX studies, followed by Bandlink’s dynamic growth. Despite the fact that Bandlink provides us with good results, we continue to explore the needs of its target audience. First Personas of Bandlink allowed us to develop an adequate subscription plan for our service.
Throughout the course of product development, we are now able to understand our audience deeper and to work out their every ‘pain’. The number of our service’s Personas is also rising and the service is changing along with the needs of users.
Of course, the process of development may be launched without using the above-mentioned frameworks like Persona. However, those useful tools greatly speed up and improve the process of development. This is also a good way to improve the teamwork – we have engaged programmers and designers to the process of Persona and User Flow development, which in turn helped them to better understand the product and needs of the audience and sped up the overall development process.Read more
Reviewing a cool shot on Dribbble or a top case on Behance, a novice designer who is not familiar with the delicacy of web development may think that in order to become a professional and create successful projects single-handedly, it will be enough just to learn how to make beautiful pictures, and make some nice animations ‘here’ and ‘there’. They think that these simple actions will provide them with high income, and all the media resources will be interested in their opinion.
Only a small number of people can estimate the real amount of work that they will have to do before creating their “first artboard” on a new project. This article is about the unappreciated work that usually remains behind the scenes.
The development of a good product begins with the research work, and the first task of any designer on a new project is observation.
Observation is an underestimated skill that is neglected by many newcomers with an impostor syndrome. The lack of time evaluation skills, customer pressure and a tendency to generalize — all this drives them into a conditional ‘black wigwam’. There, the disorientation leads them to chaotic actions and inconsistent decisions, and the result is usually frustrating. To avoid such cases, it is necessary to understand that the product is created for the user. Therefore, the designer is required to understand his target audience. This simple conclusion is the key to understanding the significance of the basic UX Research concept. The UX planning tool helps the designer to determine user behavior and prepare the most intuitive and responsive interface. Nevertheless, the user experience research methodology implies a high number of tools that need to be applied depending on the project and budget you have.
Interview is one of the basic tools that allows you to understand the user needs. The UX interview is based on the sociological research practice and is verified by time. The significance of the interview results depends on the question – it is directly proportional to the number of interviewees and the representativeness of the sample. Interviews can be divided into two groups: “moderated” (polls) and “unmoderated” (questionnaires).
Classic – a regular interview, with specific questions and answers to them. In order for it to be useful, it is necessary to interview as many users as possible. The main benefit is to compare the answers received.
Disoriented – an interview in which the interviewer usually does not use questions prepared in advance, or tries to minimize their number. In this kind of interview, the interviewer sets the abstract frame and listens to the interviewee. Here is an advice – when conducting this type of interview, use a voice recorder to be as involved in the story as possible.
Action – this type of interview is defined as a contextual observation. One of the popular cases is the ‘Uber’ design team, whose specialists worked together with taxi drivers, consulting with their target audience and integrating the user experience into the development of the new interface.
Card Sorting is often carried out in the framework of moderated testing. In this type of testing, the user is presented with a set of cards with terms that he must catalog according to his subjective representation of the hierarchy. In result, we can obtain relevant data on the understanding of the hierarchy by the user and use the information obtained when creating a Visual Sitemap.
Tree Testing – a moderated testing, in which the top element of the Sitemap is provided to complete the task given to user. The user is asked to explain a particular action that he performs in the process of completing the task. Such testing allows you to check the logic of the site map hierarchy.
A/B Testing – the most popular survey in the UX study. A/B testing is necessary if you have two competitive solutions. The reason of A/B testing is to randomly provide each option to a different number of users, the results of such testing can serve as proof of an assumption in a disputable situation.
Guerrilla testing – one of the way to conduct testing on a free site, in a shopping center or cafe. Unconditional plus of such testing is minimal expenses. The downside is the minimal sample representativeness. For this reason, this methodology should be used for projects with a large user base.
A persona is a collective image of the user, which is formed by a set of researches. If you define a persona, you can control the expectations and needs of users, embodied in one fictitious profile.
There are three key parameters of ‘persona’ – user description, environment description and tasks description.
User description – key parameters of the user, his gender, age, occupation, goals, and more personal information are indicated.
Environment description – territorial factor and context of use, this column contains the place and time at which the user interacts with the product.
Tasks description – the tasks that need to be solved by the user.
The main purpose of the ‘Persona’ tool is to get to know and see the image of target audience. Persona identification affects the decisions throughout the development path. The positive effect of the persona is often proved in situations where the Client provides data on the target audience and asks for new functionality to be developed, but when conducting a study and compiling a Persona Card it becomes clear that the Client’s target audience is not as was stated, and it is necessary to develop the exact opposite of which the Client requested at the beginning.
CJM is a way of determining the user needs at different stages of interaction with the product. CJM is formed on the basis of ‘Persona’ and allows you to think about the individual route of the user. By designing a CJM, you can determine the points at which the user will pick a product of your competitor instead of yours.
CJM is presented in the form of a table in which the ‘Customer Goals’, ‘Channels’, and ‘User Flow’ are reflected.
Please, see the following article in order to learn more about User Flow:
“Barriers” and “Ideas”. Filling each block at the corresponding stage of interaction with the product allows the designer to understand the user for whom he is designing it. When designing a CJM, it is important to maximize empathy at each stage of user interaction in order to try to understand his thoughts and emotions when interacting with the product. Nevertheless, the base on which CJM is built is the result of research of the target audience and the definition of a particular ‘Persona”. Otherwise, you can get an irrelevant user travel map.
A Visual Sitemap is a content navigation planning tool. Sitemap development requires an integrated approach. In order to be able to plan a valid map, it is necessary to conduct in-depth researches. When planning website navigation, the designer must see the product and its navigation hierarchy through the eyes of the user. This is the only way to create a Sitemap with the help of which there will be a possibility to correct the user’s path in future, providing him with the necessary information as quickly as possible.
In addition to the research work carried out by the UX specialist, it is important to take into account the semantic core clustering data provided by the SEO specialist when designing a Sitemap. The preparation of the semantic core and the use of analytical data for a website design – are the main topics of this article.
The direct purpose of the UX research methodology for the designer is to ensure that the users’ needs are understood and implemented. It is the need for awareness of the target audience that the designer requires after he begins to explore the interface patterns more thoroughly. The questions ‘Why does this UI element have a similar shape? Color? Or why is it located in this place, not in that?’ The designer opens a huge world of UX, where every design decision is justified and supported by research. In the frame of this article, we gave a superficial definition of a small list of tools that needs to be integrated into the workflow at the very beginning of the path of website development.Read more
Having a single platform for managing a project at all stages of UX Research remains an urgent challenge today. Often when working with a client there can be misunderstandings due to chaotic comments and forgotten edits. Such issues are directly related to the number of services, messengers and social networks used by the project manager to establish communication and present the product to the client. Relying on memory, the search for relevant information in this chaotic system can turn into torture. In this article, we would like to tell about how to integrate Figma prototypes into FlowMapp and use this bundle as a single platform to manage the project.
Starting a new project, we will face a number of necessary actions, such as fixing requirements and coordinating a technical task. Building a detailed site map improves the project understanding and simplifies the requirements fixing, thereby speeding up the preparation of a technical task. FlowMapp also allows you to work out User Flow, prior to the prototype development and place convenient links to it within the description of any sitemap card.
In spite of the general development of UX design, and the emergence of well-thought-out interfaces, the manager has to remember that it is not always easy for the client to navigate through the endlessly increasing flow of new services. The difficulty and time spent on the exploration of new interfaces can lead to a misunderstanding arising between the manager and the client, complicating the coordination processes and can create an artificial increase in the cost of development.
For this reason, it is so important for both parties to maintain the established communication experience. Using FlowMapp and Figma as a single platform for UX Research can help you solve this issue.
Figma is a great tool to prototype differently detailed screens, in conjunction with FlowMapp, it allows you to narrow the focus of attention by creating a single system for communication with the Client and allowing you to close the UX Research chain based on a single platform.
On the way to solving the fundamental UX Research issues, the client will familiarize himself with the FlowMapp interface, leave the first comments and mark the edits in the sitemap cards. In order not to force the client to search for links to actual prototypes in instant messengers or mail, you can use the convenient “Add Main Link” function in the sitemap card interface, which is familiar to the client, to link the current prototypes created in Figma.
In fact, this simple action, together with the ability to create links in the card description to other sitemap cards, opens up the possibility of creating a full-fledged Prototype User Flow. You can try these services in the project following the link.
Thanks to Page Covers presentation mode and the most user-friendly UI FlowMapp, the client has a convenient way to navigate the project, and the manager has a clearly organized project history with all the comments and edits.
Experience has shown that the project handover is not always its logical completion. And there is always the possibility that the manager may need this or that information on the submitted project over the course of time. Without having a single platform, he will again need to rely on his own memory. In addition, the more time passes after the project is handed over, and the more submitted projects appear, the more difficult it is to navigate dozens of abandoned chats and forgotten passwords from the services on which the accounts were created for the project. To stop the chaos in the project manager work, saving him from frustration and subsequent burnout, FlowMapp has a convenient system for projects archiving. Archiving allows you to focus on current tasks, and refer to submitted projects only as needed.
2019 poses new challenges for us. The ability to cut off information garbage and focusing on the main thing-are the main priorities of the Designer while working on the Project. Trying to keep tons of information in mind leads to helplessness and loss of quality control arising in the workflow.
Working with the FlowMapp+Figma bundle helps you be more productive-consolidating all the information on a single platform, unloading your head to work on creative solutions.Read more