Overview

Client

Smukfest x IBM

Time

March 2023

5 weeks

Team

4 people

Focus area

App (re)design

Key methods

Design thinking, double diamond, experience mapping, 2x2 matrix, hmw, crazy 8, wireframing, prototyping, think-aloud testing, guerrilla testing

Background

Smukfest, Denmark’s oldest music festival, in 2022 introduced the Min Smukfest app in collaboration with IMB, aiming to elevate the festival experience with experimental features. However, given it was a first version, the app wasn’t popular among festival attendees and there was some room for improvement.

During the project we were given a task by IBM to redesign the Min Smukfest app, while paying extra attention to:

  • enhancing user experience
  • improving engagement
  • on-boarding the users more
  • making the UI consistent with Smukfest’s new website

Problem statement

How can we improve and re-envision the Min Smukfest app, to further support the attendees' experience of the Smukfest festival?

Discover

Analysis of the existing app

Fist, we needed to analyse the current version of the app to be able to expend on it later. The main features were:

  • Find my friend - provides the attendees with an easy way to find their friends at the festival plaza
  • Beautiful memories - based on users’ registered festival bracelates, after the end of Smukfest, they can see summary of their experience there (based on the sales data) in spotify wrapped like form
  • Just fun - an offshoot of “Beautiful memories”, this feature uses sales data to provide users with a live overview of

Main problems of the old app

  • The design differs from the website's and it’s quite boring
  • Map is not interactive
  • Users don’t know if location of their groupmates is up-to-date
  • Users don’t see their own position

Target audience

We were provided with some user data by IBM from which we could see that majority of the attendees is Danish and 46.5% of them are female. There were 2 big age groups,18-34 year-olds and then 35-60. We decided to focus on the younger group, because they are more likely to use apps. We conveyed interviews of people this age, who have attended a music festival and discovered that they participate in them mostly for social reasons.

Define

Experience mapping

Experience mapping was done with a participant, who didn’t attend Smukfest, but has been to other music festivals. From it we gained insight into the festival experience and what challenges may occur during it. It also helps us brainstorm new ideas that could solve some of the users' problems, especially concerning health and hygiene.

The ideas we got were:

  • Reminders to drink water
  • Showing showers’ availability
  • Displaying emergency tents and water stations on the map
  • Adding a hang-over guide

It also re-established a need for Find your friend feature.

How Might We

First we prioritised our ideas using 2x2 Matrix and then we formed how might we questions for our 3 main goals, to come up with more features that could help us reach them.

Develop

After mappings we decided that main focuses of the solution are going to be:

  • Improving the Find your friend feature
  • Helping users spend their time more efficiently on the festival
  • Improving attendees safety during the festival
  • Visual consistency with Smukfest’s website

Low-fi Wireframes

First we sketched individually on paper, using crazy 8 method, after which we voted on the ideas we liked. Based on those, we created a low fidelity wireframe in order to concentrate on the functionalities rather than the design.

We gave groups its own tab for easy access and management. To add a personal touch, users can choose names, colors (which also show on the map), and avatars for their groups. Everyone has a unique QR code in their profile for quick group joining.

To help users keep track of their group-mates, we show when they were last active. Users can also easily control who can see their location and set meeting points.

Style tile

After low-fi wireframe, we created style tiles, based on Smukfest’s website and the design guide given to us by IBM, to ensure consistent design throughout the app.

High-fi Wireframes

For the high-fi we implemented feedback from testing and focused more on the UI of the app. We wanted it to have a fun and casual atmosphere, without being too distracting for the user.

I was responsible for designing:

  • groups for Find your friend feature
  • profile
  • QR scanning flow
  • settings
  • the wave at the top of each page

To optimise the Find your friend feature, every user has their unique QR code in their profile that can be scanned while being added to a group instead of searching for their username. Another way to join the group is to scan group’s QR code.

Final Figma Prototype

After testing we created our final prototype of the app. Click the button to view the Figma of it.

Reflection

  • Collaborating with IBM taught me to consider to potential outcomes of features, such as data leaks and too big storage needs.
  • I’ve learnt how to use hierarchy for the typography, but, on the reflection, the “see group’s location” button should have stand out more than “add a friend”.
  • In hindsight we shouldn’t have written the text in all caps, which we haven’t initially noticed because of little amount of it.
  • I’ve learnt how to follow and adjust an already existing visual identity.