00 research 01 concepting 02 testing 03 solution 04 visual design 05 takeaways
hamburger menu
phone mockup
phone mockup

tutti.space

Creating a new app that will work along with the existing beta-website for a startup that defines themselves as Airbnb for creative space.

challenges

  • Tight timeframe of 4 weeks
  • Bringing the user input into the business strategy for the client’s next steps
  • Designing for 2 user groups of sometimes opposing needs
  • Getting hold of users in the given timeframe
  • Splitting tasks and getting back together in a larger team of 5 UX Designers

my contribution to the team project

  • Analysing google analytics data of the existing website, that led to improving the search
  • Developing a style guide for the team and coordinating our group prototype
  • Creating onboarding and map screens
  • Based on the client’s branding developing key high fidelity screens, to show the difference between browsing as an artist and host

solution

A native app allowing hosts to list and manage their spaces, artists to discover rehearsal space, and both parties to negotiate the booking easily.

tools

Sketch, InVision, Google Analytics, Trello, Mural, Photoshop

key screens
We developed mid fidelity prototype, with key high fidelity screens. The whole process is described below.

the design process

sketch of the process

In a larger team of 5 UX designers, we conducted daily standups and weekly team retrospectives stay on top of the project. We also used the Gantt Chart to map the crucial deadlines. Given the tight project timeframe of 4 weeks we decided to work in 3 weekly sprints, each focusing on:

Every sprint finished with a presentation, where we got the input from our client and defined further steps. At the end of the project, we handed over a package including annotated wireframes and our recommendation for next steps of the product development.

initial research

sketch award

0 of the competitors have an app

An app would give tutti an advantage on the market and speed up the booking process and communication between hosts and artists.

sketch lost

55% of users do not use filters

Google Analytics analysis, told us that most people don’t use even one of the 63 existing filters. We saw an opportunity in improving them.

mapping the journey

We organised a workshop with our client to define the points of friction from the client perspective. Out of 6 initial users stories we prioritised the following 3:

1. Filters

A choir that has specific requirements for their rehearsals would like to be able to filter search results so they can identify the locations that best fit their needs.

2. Messaging

Tutti tribe (Tutti users both hosts and artists) want to be able to communicate simply so they can agree and confirm a booking.

3. Price negotiation

A Jazz club wants to set cheaper prices for daytime bookings (compared to evening bookings) in order to encourage more artists to use their space.

photo mapping journey
We conducted a workshop to map the user journey with Gabriel (our client)
user journey
Our initial journey and interaction between the hosts and artists

targeting business goals

Tutti had an existing beta website and needed a native app that will work along with it. The client was also seeking to bring the user input into their business model. From a business perspective, they wanted to increase conversion and increase retention. We needed to cater for two distinct groups of users: Hosts and Artists.

increasing conversion

Artist users: by making it easier to browse, identify, rent and use spaces that meet their needs

Host users: by making it appealing and easy for host users to post their spaces for rent

increasing retention

Artist users: by enabling to re-book spaces they’ve previously used and explore alternative spaces

Host users: by making it easy to communicate with renters, make updates to postings

who are the users?

After getting to know the business side of tutti we conducted 10 user interviews to help us understand how users interact with the product and to define their priorities. We developed personas for the 2 groups of users (artists and hosts) who were interacting with each other and had different needs:

photo artist

Joe – the artist

A recent music school graduate needs a quick and easy way to find a reliable rehearsal space because they can’t practice at home due to noise constraints.

photo host

Mark – the host

The owner of a small music studio wants to rent out their space to responsible artists so that they can earn extra cash and make new connections.

validating initial hypothesis with users

The challenges that our users encountered were broader than our initial hypothesis. We brainstormed over 40 ideas, developed and tested 9 best concepts to ensure we are designing the right thing. User testing helped us prioritise the following concepts:

sketch concepts
line issues from the users’ perspective
dashed line our initial hypothesis

search / filters

Setting options during onboarding to shorten the filters list and creating a personalised view was the artists favourite.

sketch disciplines

pricing

Artists wanted to see a grid showing the price breakdown, that would also allow hosts to set up different pricing options.

sketch price table

trust

A link to their creative portfolio in their profile page, visible for the other site as well as a review between both groups.

sketch trust

improving filters

We moved quickly, brainstorming our first ideas on paper, then testing, refining and moving to the digital prototype. My task was to develop the onboarding, search, map and filters.

photos of the process
First journey mapping / paper prototypes / reviewing screens / daily standup

simplifying the long list

existing filters gif
Current filters on tutti website
paper prototype
First paper prototype
filters wireframe
Refined wireframe

test, refine, repeat, test…

We continuously tested our work in progress with users. During the project duration, we tested our prototype with 20 users. In the last round we asked the users to complete the following:

  • set up a new account


  • list a space (host)

  • find and book a space (artist)

We fixed all major errors and gave the client a list of recommendations. Here are some interesting turnovers:

photo testing session
early sketch
welcome screen
registering

landing page

Users wanted to see the map straight away so we removed this screen.

unexpected screens

Users needed an explanation of how tutti works. We added 3 screens, explaining the benefits.

3rd button

Tests were inconclusive about the sign up. “The third button” that could be tested in the first release.

final designs & problems solved

search

  • Streamlined search - set up during the sign up for artist

  • Filter categories have been simplified

  • “Spaces” with repeat bookings, saved spaces, suggested for you

onboarding + map screens

price

  • Flexibility for hosts

  • Clarity for artists on pricing breakdown

  • Ability for hosts to offer discounts or extras

pricing screens

trust

  • Messaging integrated within the app allows faster communication and negotiations

  • Artist and Host “creative” details in profiles

  • Reviews and ratings

  • Intro to Tutti before sign up

messages and profile screens

visual design

Many users on tutti both host and browse spaces. We applied the branding colours to create a distinction between both modes. Switching to the other profile is possible in their profile section.

brand guidelines
hifi screens

key takeaways