Songkick iPhone

The below is an exercise I did a little while ago for Songkick. This didn’t go into production, but is nonetheless something I very much liked designing, and presenting to the guys at Songkick.

note: click on the play button in the middle of the iPhone to access the prototype

I’ve taken the approach that the user should get more information per item, speeding up the decision making to buy tickets.

Apart from artist name, venue and date, I added:

  • Ticket price (when known)
  • Tube stop (provides venue context)
  • Supporting acts
  • Friends going
  • Like (a renaming of ‘track event’)
  • Share
  • Tickets y/n
  • Buy button

Friends attending will not only encourage ticket purchasing, but also a reason to go back to Songkick after the user has bought their ticket.

The expanding listing can be collapsed by tapping on the top ‘artists’ tab again (and should remain like that when the user comes back to it after going elsewhere).

I’ve added a ‘by date’ tab so that the user can see all gigs at a specific date, regardless of the artists they have liked (think gifting or simply wanting to go out on a specific day).

Songkick iPad

Using card based, atomic design elements will translate well to other devices and touch points…

Spotify

…and the same system can be deployed within Spotify.

Songkick.com

A reversed colour scheme for Songkick.com

Artist websites

A few examples of how artists could use a non-invasive design on their own websites; an accordion style list that only when opened reveals the Songkick identity.

Onboarding

Though the aim is of course to make any new features or changes to the journey feel natural and as foolproof as possible, to onboard (new) users I would suggest a tour around the app using a progressive tooltip UI.

Related Projects
  • Go Eu Go
    Go Eu Go
    Brand Identity Dashboard design UI UX Web design
  • Jukebox
    Jukebox
    Brand Identity iPad app iPhone app
  • Dash Audio
    Dash Audio
    Brand Identity Dashboard design UI UX
  • OMI
    OMI
    Brand Identity Event Identity Web design