UI/UX Design for Beach Volleyball WebApp

User Interface and User Experience design for a project of organising matches according to number of players on certain time, and depending on their levels.

The App, to be developed in summer 2018, will include Artificial Intelligence and Machine Learning, suggesting automatically rivals and hours of playing for each player, according to his level and predicting days and hours with more activity.


Beach Volleyball is one of the nicest sports for all-ages athletes who prefer outdoor activity. The seaside environment makes it specially popular all over Mediterrranean beachs in Spain and Italy.


In Summer 2017, Beach Volley becomes so popular than 20 nets per beach are not enough to cover people's demand. There are so many people who match at same time without knowing if each other's level is good enough even to begin a match, or if the people standing in the net is gonna play for fun without rules at all, or respecting any official rules.

In the other hand, all-year players and casual ones with level enough don't have any system to challenge each others, or even to challenge those who come only for summer and schedule a match.

Figure 1. Classic 2vs2 Beach Volley match played with rules in any beach.

So, at the end of 2015, I helped MOOOV redesign their iOS app. Acting as their Lead UI Designer, we created new mobile guidelines and most of the features you’ll see to this day.

Research & Analysis

User research focuses on understanding user behaviors, needs, and motivations through observation techniques, task analysis, and other feedback methodologies. It was so productive to research about beach voley players (all-year players or casual) and check how much they missed a system to let them plan a match, even for short time, instead of waiting without knowing when they could play, for how long, and against who.

User scenarios

Due to beach volley practise rapid growth, there was plenty of data available to us, so we used this to accurately define their user base, the way these users behaved and several possible use cases for the app.

Spontaneous Casual without plan Casual with plan All-year players

Spontaneous players are spending the day in the beach with no expectatinos of sport activity, but sometimes, the desire of exercise comes, and they join any net to practise voleyball for some minutes, rarely more than 45.

In this scenario,we have many users who play beach volleyball regularly, but they are not planning the day or schedule they go to the court

In this scenario, the casual players prefers to agree a time to begin a match and a time to end it. Level required is also agreed before matches.

In this scenario, the users are playing during all the year, and schedules begin to be repeated regularly. Matches will be organised by level of players too.

Figure 2. Beach Volleyball user scenarious.

Wireframing & Prototyping

With the proper planning, we were able to confidently move into creating wireframes for the app. We took the decision to focus more on the functionality and structure of the app, opting for low-fidelity wireframes with very little detail. Ultimately, we could add design elements in later, what was important for our users, was that the product (above all) was clear and simple.

Figure 2. VoleyPlayapp’s low-fi wireframes.


One major challenge in the app is to show in a simple and smart way the so many options a player can have. The goal is to offer something that helps players to organise their matches and not to make it more complicate.

We also needed to create an structure that takes data about: locations, preffered hours, players' level, and duration of matches, to make algorythms suggest user the best moment for them.

Creating QR codes at every net will be so important to motivate people to use the app from first minute and join any available match.

Figure 3. Voleyplayapp UI Design.


In the results we created a mobile application that is able to perform the business tasks. UI testing gave us an idea of how to properly organize the structure of the application, providing the most positive user experience for beach voley players. We understood the complexity of hundreds of players playing at same time, and got the main idea from players who want to enjoy an sport in an organised way.

Most people make the mistake of thinking design is what it looks like. People think it’s this veneer – that the designers are handed this box and told “make it look good”. That’s not what we think design is. It’s not just what it looks like and feels like. Design is how it works. Steve Jobs, US computer engineer & industrialist.

After getting data from a whole year, May 2018 will be the date when client will launch Voleyplayapp App. So stay tuned!

Date December, 2016
Type Mobile apps, Prototyping design


Are you working on something great? I would love to help make it happen! Drop me a letter and start your project right now! Just do it. I will not spam you on
e-mail or add to MailChimp list.

Email hola@iamperi.com

Find me in Madrid, Spain