Kiosk Design

CLIENT
Tauranga City Council
RESPONSIBILITIES
UX UI Design, Digital Display
Kiosk Design
CLIENT
Tauranga City Council
My Key RESPONSIBILITIES
UX UI Design, Digital Display

Background

Brief:

  • To design an interactive screen on an indoor kiosk stand for Tauranga City Council to promote the history of Aotearoa.
  • To include a video display function for historical stories
  • To provide an option for people to save and watch videos later
  • To include English and Maori language options

Goals:

To design and develop an interactive screen with an engaging experience for educational purposes.

Research

Measure & Research what others do:

After conducting a thorough competitor analysis and creating kiosk mockups based on the given measurements, we discovered that the kiosk design exceeded the standard height of 2.6m (H) x 1.25m (W) for typical kiosk screens. Through multiple rounds of user testing with a low-fidelity mockup, we identified an interactive landscape area located near the bottom of the kiosk screen. This discovery allowed for a more user-friendly design, and further research was conducted with this interactive space in mind.

What we found:

Our findings revealed that in order to improve the user experience, it was important to minimize friction and maximize speed by providing straightforward instructions.

Additionally, using graphics and icons was found to be a helpful tool in replacing or supplementing text.

Challenges:

Designing for a kiosk screen size that deviates from the norm requires inclusive considerations. Additionally, defining the information architecture can be challenging as client objectives may change frequently.

For instance, in our case study, the purpose of the non-interactive space located at the top of the kiosk screen remained unclear. This highlights the importance of thoroughly understanding the client's goals and objectives to ensure that all design elements serve a clear purpose and contribute to a positive user experience.

Design & Test

Design Thinking

Step 1: The User Journey method was used to identify the most important functionalities of the kiosk screen and determine which information and pages should be displayed to attract user attention.

Step 2: Wire-framing was then initiated to design the interactive screen area for the video and reference pages. This process helped to refine the layout and placement of design elements and ensured that the user interface was intuitive and easy to use.

Step 3: We conducted multiple user testing sessions with selected users within the company and ultimately decided on option 3 for the video page. This option allows the user to browse available content without requiring excessive interaction.

For the first video, we provided two layout options to display the content depending on the length of the content.

Step 4: We decided on a grid layout for the reference page, as the information architecture was not yet fully defined. The grid layout provided more flexibility to accommodate different types of content, such as videos or text-only, compared to the carousel layout.

Step 5: To determine the most effective video display function, we conducted A/B testing between auto-play with minimum interaction and tap to play.

Step 6: After further testing with high-fidelity mockups and gathering feedback from 10 different users, we decided to go with the auto-display function. The preview and auto-play function proved to be more efficient in providing a seamless user experience.

Design:

UI Solutions

Once a video has played, the next one automatically comes on screen with new description copy, but doesn’t play until "PLAY" button is pressed.After a certain amount of seconds of the play button not being clicked, the screen will revert back to the first video's preview page.Note: Language switcher was delayed to release at the end of the project as requested by client.

Takeaways

Design with limited information architecture is challenging but it can be the case in reality that we, as the designer prioritize the functionality in relation to quality.

Hence, constant testing and feedback cycles are essential to understand the accessibility of the product.


As this project does not require responsive design, but a fixed and unusual ratio, designs were required to be as simple as possible for users without too much onboarding knowledge required.

Therefore, removing unnecessary features was beneficial to keep the interface engaging and attracting the attention of the users to ultimately achieve the goals for both the users and the business.