• 2020.12-2021.06
  • Hackathon
  • UI/UX Designer
  • Figma
  • Design Team of 4
  • Develop Team of 5


About Zeitcaster

Zeitcaster is a location-based library of events for all ages and interests, tailored to what you need right now. In addition, it helps people connect to the events and communities surrounding them.

Design Challenge

During UX Design Hackathon 2020, my team selected the Zeitcaster Challenge. Zeitcaster provides event management service and its website allows users to search, browse, and promote local events and live streams. The client required the team to redesign a responsive solution of the filter and search result pages to give users a better understanding of the event context they are looking at.


User Interview

Within the timeframe, my team conducted interviews to participants aged 24-35 since it is the primary user group. There are key questions we asked within interviews:

  • Which type(s) of event you went to before and after the Covid-19 pandemic? How often do you go to new events or repetitive events?
  • Which online platform(s) you used to find an event. Which one do you like the most and why?
  • Could you please describe your latest experience of planning to go to an event? 
  • What are the cases you will need to search event in last minute? Can you please describe your latest experience of last minute  for searching an event?
  • When and where, or in what situation would you need to search for an event?


90% of people look for events only once a week or less

53% of people look for event regularly, but 47%  don’t search for events that often

2 in 3 people is used to search event on mobile phone, 1in 3 on desktop

72% of participants got latest events information online and 24% from their friends

64% of them browsed events by social media feeds, 24% by Eventbrite and 12% by Google

Alternative plan (43%) is the most common reason for people search events on APP at last minute, followed by scheduled event cancelled (36%) and additional activity after lunch(21%)

Half of most people are event seekers or planners, and half are follower

Three quarters of people is more willing to join free events


After resarch, we synthesized our findings and listed the following archetypes and user needs:


“I want to watch a musical show and I want to find whoever is available to go with me.”

Users need to browse information of events including date, time, location and type in order to pick one from event options.


“I am bored. I want to know what can I do now.”

Users need to quickly and confidently compare which event(s) nearby and is it happening soon in order to decide immediately which event they willing to go.


“I don’t care what to do. I just want to find something we can do together.”

Users need know what group activities are designed for doing together in order to participate with certain type of people they are going with (E.g. family, friends, coworkers and romantic partners).


User Journey Map

Peek into Our Solution

Our first proposal in 48 hours

Since different attendees want to find something interesting to visit in a different way, our solution is not only display information about events, but also a provide a convenient interaction between search and filter, as well as perform other similar activities in order to help users discover enthralling events.


  • Search is a fast and intuitive route to discovery events.
  • Giving users a breadth & depth of event selection on the site.
  • This feature helps us to learn about the user needs. It tells us what they're looking for so that we can deliver relevant information to them.

Top Filter Bar

  • According to Baymard’s study, horizontal filter bar significantly outperforms the left-sided one in terms of convenience and efficiency.
  • It keeps the user’s attention in one place.

▲ This project wins Zeitcaster Challenge as the Team Finalist in UX Design Hackathon 2020 held by #UXRESULT.

View Result >>


After Hackathon, we won the design challenge and continue to refine and accomplish this project.


User Flow

Scenario #1

When users search for events, they will made some selections on search bar and filter taking into account the parameters: date, location, event type, etc..

Scenario #2

When users click event result card, they will jump to event detail page which describes event venue info & specifies the timetable etc..

Scenario #3

When users want to save events or selected filters, these data can be saved into their profile & dashboard, they can keep/eait it for next time use.

Style Guide



Users can search event by typing keyword in the top search bar. Auto complete not only saves time if user forgot how to spell, but also shows top search queries.

    Search Result Cards

    The details of search results are displayed on the cards.


      Filter is designed for helping users narrow down their selections.

      Users can search events by filter according to date, location, event category, distance, price, age group, going with.

      Selected filter options can be adjusted or all cleared. Users can save filter options so that it will be convenient for next time use. 


        Events can be saved since people usually need to compare events and check same events multiple times.


          Share options is added on the card for user invite their friends/co-worker to take part in the event event together.


          Related events section is provide on the end of the event detail page in order to encourage users to look at more events.

          Responsive Design

          The web interface is also designed for mobile devices, since over half of users browsing event on their mobile phones.

          View Current MVP Website >>

          Impacts After Launching Phase 1




          Average Session Duration


          Returning Users