TOA Berlin: bringing people together at a festival through an event app
Tech Open Air was born in Berlin in 2012 from the desire to bridge technology and community through a different kind of event. They take pride in the fact that they are a community based festival with the artsy Berlin vibes.
The concept has attracted thousands of people from all around the world and the festival has continued to grow stronger through the years. Unfortunately, the last -in person- edition of the festival took place in 2019 and they haven’t been able to organise a new edition due to the pandemic. However, they are preparing to make a comeback this summer of 2023 and they want the community to feel closer than ever.
The challenge
When we talked with their team members, they expressed that they wanted to encourage networking by implementing a Tinder-like feature that matches attendees with other attendees, depending on what they’re looking for/are interested in. On the other hand, they also wanted to incorporate a scheduling function to allow people to have a customised experience and more sponsor digital presence since they were going paper-free for this new edition.
Studying the market
We analysed other tech festivals around the world in order to study their way of presenting themselves, visuals and event applications to do some benchmarking. Our main references were SXSW, Bits&Pretzels and Web Summit Lisbon, some of them gathering audiences of up until 70 thousand people per edition.
Now, we had to ask ourselves how to provide a complete experience and how differentiate themselves from the rest.
Tech Open Air takes pride in their sense of community and collaboration, in fact, they were the first ever crowdfunded festival and with collaboration only they have managed to bring together 78 thousand attendees since 2012, more than 950 speakers and appeal to the younger audiences, the average age of the attendees in the last edition was from 25 to 35 according statistics, and the profiles are equally distributed between startups, corporate workers, investors, creatives, etc.
Empathising with users
We interviewed 7 subjects who had experience in events related to technology, whether it’s been as attendees, organisers or speakers. We organised our findings with an affinity diagram and then voted on most important pain points and positive focus points.
To filter information even further we prepared an empathy map and through this we were able to extract some valuable insights such as:
- The schedule and organisation tends to be the most important thing for them when attending an event, setting reminders and filtering with tags would make the experience easier.
- As a negative, they added that meeting with people at large events might be harder due to the scale, also, finding sessions that truly interest them is sometimes difficult.
Our user persona
Meet Dynamic Dominic, we created him to be able to think like an actual user may think. He’s a startup founder whose goals are to meet other attendees and better yet, other startup founders like him in order to expand his network and learn from his peers, maybe even find a business opportunity or an interested investor. But how would he navigate this potential connections and opportunities? Many things could happen such as lack of communication, orientation and planning.
What you’ll see next is the user journey we created for him:
The journey starts with him feeling excited about buying his ticket, he knows he could find big opportunities by attending an event like this, but it starts going downhill when he finds blockers related to orientation, information and timing*, all three could be taken as opportunities to improve the experience for Dynamic Dominic.
*One of the key opportunities that we wanted to remark is related to the new networking feature, people should have an established timeframe after the event to continue gathering information about other attendees they matched with in order to continue networking outside of the app. on the other hand, people should also be notified with time when the event app will stop working.
Ideation
Problem statement
TOA 2023 attendees need to find a way to be able to tailor their agendas and networking opportunities to their preferences because they have different goals and it is difficult to achieve them without help.
Crazy 8’s and MoSCoW method
What do we have to have? enough features to let people be informed on how the new networking and scheduling feature works, sections dedicated to the sponsors and speakers, personal profile and easily accessible digital ID, filter tags, the possibility to message other attendees and set reminders for yourself.
We summarised everything into a list to have a roadmap to creating the minimum viable product:
- Setting up preferences from the onboarding with different tags as well as the possibility to choose the profile of the attendee (e.g. attendee, investor, founder etc.).
- Connect profile with LinkedIn + digital ID (QR code) that people can scan in order to take them to other attendees’ profiles.
- Interactive schedule with the option to filter by tags and to save your favorite sessions into a “My Schedule Page”.
- TOA Connect, a feature with functions similar to dating apps, through which attendees can safely meet other attendees based on their profile and interests.
- Interactive Ads with sponsor pages that show you the people that are present from the respective company.
Site map & User flow
Our site map contains a navigation bar with options to go to the homepage, program page, networking page and private messages and a hamburger menu where you could access your profile, satellite events page, speakers and sponsors page, privacy settings, a pdf downloadable of the floor plan and a hyperlink to the website (most of our interviewees expressed that they usually opted for downloading the map of the festival in their phones for easy accessibility) and the preference of having a link to the website just in case the app presented technical difficulties.
Low-fidelity sketches
Having worked through the information architecture and feature prioritisation, we started to sketch out our ideas for the app:
This was enough to allow us to do some testing and learn what people thought about the concept.
We asked people what they thought about an event app that would let them match with other attendees and have control on their schedule organisation:
Key insights from the concept testing:
- “I think the scheduling will be really useful.”
- “Love the idea of the networking.”
- “I want to go to an event that has this app.”
- She likes all the features, finds it useful “I always get lost… I always lose so much time”
- “It will be very helpful for people looking for investors and other networking people.”
Negatives
- “You don’t want the creepy old men thinking they can flirt with women”
- Swiping might lead to abuse — people might use the app for hookups (Tinder connotations)*
- There were some issues with the name of the sections (e.g: inbox instead of messages)
- People expressed concern on what would happen if there were 2 colliding events in the schedule
- Some people were confused as to where to find their own schedule
👉 * By knowing this, we learned that we had to be really careful about how to handle this matching functionality and distance people from the underlying Tinder connotations.
Iterating the wireframes
After testing, we incorporated the feedback to our mid-fis. It included changes in the wording, position of elements, icons, and adjustments in some sections.
For example, we incorporated the bell icon in all session cards for people to click directly on to set an alarm. We also changed the word ‘Inbox’ for ‘Messages’ in the navigation bar because it was misleading for the users, as well as the private messages icon in the Networking page (TOA Connect), people weren’t sure about what it meant so we decided to remove it. We also decided to divide the scheduling page into 2 (All sessions and My schedule) for people to manage their events in one page.
We also asked people to test out mid-fidelity wireframes for usability and these were the key insights:
Key insights from usability testing:
- “It’s really helpful” She knows where to go to add the session to her schedule (she noticed it right away).
- I didn’t have a lot of experience before with events app, but they are usually quite boring. Never really as engaging as the one you just showed me.
- Homepage feels like her profile page — everything is personalised towards her.
Negatives
- “I’m under the impression that this is a bit unclear” (about the onboarding explanation for the networking feature)
- “Make it more clear that you have two options there.” (Networking page)
- She would proceed with horizontal scrolling after swiping up
- Doesn’t like the idea of scrolling down and losing a potential contact forever*
- For the networking feature, we initially ideated that people would scroll horizontally through the profiles, swipe up to send an invitation to connect and swipe down to skip the contact forever (as opposed to swiping left and right like in Tinder to distance ourselves from the “hook up” connotation.
Visual competitive analysis
In order to jump into the high-fidelity wireframes, we needed to analyse the competition first. We gathered that some of the tech festivals presented themselves in a more corporate manner (with dim colors and corporate illustrations, like the Web Summit Lisbon) and others like SXSW were more “out of the box” in the use of color and graphic elements. Bits&Pretzels appeared to be somewhere in the middle, with a bright yellow in contrast with black and big bold call to actions.
Our style tile
The look and feel for this year’s event had already been established by TOA Berlin. They had the colors (same three they always use), typography and icons but, they just had a sketch of the hero section for the new desktop homepage and no brand guidelines or anything else in place. That’s why we condensed everything into a style tile.
What they provided:
Our style tile:
High fidelity prototype
After gathering all of the above, (usability feedback, visual competitive analysis and visual elements) we were able to implement everything into our hi-fis. Here’s a quick video demonstration of the flow:
Explanation of the flow:
When you enter the app, you first run into a screen that will ask you to log in or skip, in this case, we are logging in with our ticket code. Next, we start with the onboarding process, first, you have to either connect with LinkedIn or fill in your professional information which will be displayed on your profile, select all the tags that are related to your interests and then your goals for this edition (this will have an impact on the networking feature later).
After setting your preferences, you get a quick animated explanation of the two new features - to ensure attendees can hit the ground running when they first download the app.
Then, you land into the homepage. In the upper part of it, every attendee will have a QR code that will serve as a digital ID; let’s say you meet someone while in the queue for the drinks - you can scan their digital ID and instantly go to their profile in the app (without having to find them in the networking page). Then, the first thing that is visible are your notifications and personal schedule, with the possibility to open the program and keep browsing sessions or remove them. Below that, you can browse some recommendations based on your settings (which you can adjust in your profile, inside of the burger menu).
After interviewing our users, we gathered that the main thing they wanted to have in hand is their program/schedule, that’s why it’s second in our navigation bar. From there, you can see the program and click on the sessions (to see more information), and also add them to your schedule, which you can also access through the same page.
Next in the navigation bar, we have the Networking page. Here, is where you can find your contacts, manage your pending invitations and swipe through attendees. We decided to simplify the process to a swipe up to send invitation and swipe left to keep browsing (it was easier for people to understand).
In between attendees, you would also get an interactive ad, in order to position sponsors in the top of mind of attendees (without the use of paper). People would be able to go on the sponsor’s page and see what sessions they are participating on and even have the possibility to connect with employees (in this case, Google employees at TOA23).
You can also play with the prototype here:
Desirability testing
Last step of the process was to test for desirability (to see whether the interface is appealing enough for users).
Here are some of the key insights we gathered:
- “Feels young, fresh and original”
- “It doesn’t look like other apps”
- “I love the retro look”
- “It’s visual and interactive”
- “It’s dynamic, intuitive and modern”
- “It has a retro and fun vibe”
Learnings
For this project, we learned that:
- Even good ideas need to be approached with caution (e.g.: the Tinder like feature).
- You definitely cannot build an entire event app with networking and scheduling functionalities in two weeks (but you can build an MVP version of it ;) ).
- A good flow of communication with the stakeholder is crucial.
- You have to give yourself the space to fail and try
- Designing swiping in Figma is ridiculously difficult!
Special thanks
I want to thank the people at TOA.life Editorial for giving us the opportunity to work on this challenging (but rewarding) project, they were amazing to work with and it was an honour to develop these ideas for such an iconic festival.
I especially want to thank my teammate Adam Mazik, who worked alongside me and made this process easier and enjoyable kudos to you!
Thank you for reading up until here :)! You can find me on Linkedin if you have any questions or comments for us in the link below:
https://www.linkedin.com/in/jeannettefuentesruiloba/
Have a fantastic day!
