Crafting costumized features by a systematic approach.

Webdesign
Design Thinking
Responsive

Traumpalast

Interface Design

Team

Nina HielscherJan Lonardoni

Semester, Year

3rd, summer 2023

...not quite a dream

From an unwelcoming homepage to unnecessary subpages and poorly organized film listings, the website simply falls short. Unclear navigation due to unintuitive terminology further makes the user’s experience worse. Additionally, the overall color scheme doesn't align with the aesthetics of a modern cinema, and there's a lack of clear information on youth protection.

Design Objective

How can we visually enhance the website and tailor the booking process to individual users? Our goal is to facilitate quick bookings while allowing users the convenience of browsing. Simultaneously, we aim to address recurring misunderstandings directly on the website.

Redesigned screens at the Traumpalst cinema in Schwäbisch Gmünd

Enhanced user journey by prioritizing core features.

Kano Model

To achieve our goals, we focused on optimizing basic features and redesigning user-centrically. In analyzing the current website, two features fell into the "Danger" category, relating to youth protection. Our solution includes prominent FSK age recommendations and a hover label for late-night showings, specifying the required age for the visit.

Navigation Structure

For a clear and understandable process, the navigation structure of a cinema website can be simplified into two stages, which are visually distinguished by a different design of the navigation bar: the informational section and the booking process.

Style Guide

We utilized a created server for communication between Arduino and JavaScript. Using JavaScript and the "One-Color" library, we programmed a page that represents a color window, which we controlled with the Arduino.

Individualizing the booking process.

Various Usecases

The screen design adopts a modern approach, aiming to engage users through colors and impressions reminiscent of the cinema environment.

Fastest Usage Scenario

Users who know exactly which film they want to see need minimal information. The Quick Booking function on the homepage allows them to quickly proceed to seat selection and complete the booking faster.

Browsing Opportunity

For users who enjoy spending time on the cinema website without a specific film in mind, we offer a switch from a tile view to a list view and provide detailed information about the film and actors.

Spontaneous Booking

In this use case, we emphasize the ability to change data and showtimes during the booking process. Additionally, users can more conveniently compare available seats in different auditoriums.

Style Guide

We utilized a created server for communication between Arduino and JavaScript. Using JavaScript and the "One-Color" library, we programmed a page that represents a color window, which we controlled with the Arduino.

Mobile Version

To make the redesign more complete, we have designed additional screens in the size of a smartphone. These screens retain the same elements as the desktop design, but have been adapted to the requirements and user experience of smartphones.

Concept Video

This showcases a complete booking process followed by a cinema visit. Thanks to a straightforward booking process, the visitors can then relax and enjoy the movie.

more projects