Sanghoon Hwang | HP Sprocket Photobooth

Overview

Challenge

Designing for first-time users in high-energy social settings required an intuitive, frictionless experience, while also adapting quickly to a sudden rebrand from Kodak to HP.

Goals

Ensure the first-time user flow is quick and free of road blocks.
Create an entirely new design system.
Design a companion mobile app for event planners.

Purpose

Enable guests at social events to effortlessly take and print photos, capturing memories without hassle.

SECTION 1

Rebranding

Polar Opposites

For the first 6+ months I worked on this project, this photobooth device was intended to under the Kodak brand. All of the screens were designed and developed, almost ready for release.

While the shift to HP caused a little bit of internal confusion and panic, it was personally a fun challenge in which I was able to establish a new look for the photobooth.

Home Screen

Thought process: Ensure that the lighthearted and fun nature of the product shines through the more "corporate" nature of the HP visual guidelines.

Photo Capture

Thought process: Keep the background elements minimal to keep the focus on the live view. A dark tone will be suitable for the users' eyes as they will be looking at this screen for a prolonged period.

Event Creation Dividers

Thought Process: These transition screens should have very easily readable text, as they will fade quickly.

SECTION 2

User Flows

Two Types of Users

The photobooth has two distinct halves: The Admin flow, and the Guest flow. During the design process, our UX team carefully considered the ease of use for both types of users.

Admin Flow

Admins are the event organizers and the actual owners of the product. Their primary goal will be to set up the "events" prior to the occasion, which houses all of the settings that will determine what the guests will experience.

Guest Flow

The guests' job is easy, but imperative to how the product is received. The ultimate goal is to take a photo and print one out, but the process of doing so was optimized for simplicity and speed to ensure there isn't a long queue for the photobooth.

SECTION 3

Mobile App

Unlike the on-device software, I was there from the beginning for the mobile app's development.

This mobile app was designed to be primarily used by event planners who may own multiple photobooth devices and would need to manage them in real-time while hosting an event.

More features, such as editing events, is planned to be added in a future update.

SECTION 4

Visual Style Guide

The rebranding provided the perfect opportunity to establish a design system that was previously lackluster. Below is the visual style guide for the mobile app, modified from to the on-device software's design guidelines.

Color Styles

To maintain the informal nature of the device, we opted to sway away from grayscale for the neutrals and use eye-catching colors for the accents. In accordance to the HP visual guidelines, we removed all use cases of gradients.

Iconography

To maintain a consistency in the icons, we set the following rules:

Most icons should be outlines, rather than solid. Where appropriate, there will be acceptions.
The icons are used at the following sizes. Header icons : 32px. Toast message icons: 48px. Pop up icons: 64px.

Buttons

Since the footer takes up the entire width of the screen, the full size and small buttons can be used universally across the app. The only exception is within the pop ups, which require slightly smaller buttons due to limited screen space.

Elements (Mobile App)

Shown here are some other UI elements seen across the mobile app.

SECTION 5

Looking Forward

Reception at CES and IFA

As of October 2023, the HP Sprocket Photobooth has been at 2 major technology summits for use by the general public. While I was not at these events myself, we seemed to have garnered positive attention while learning valuable pain points which have since been addressed.

Frame Overload

A huge part of the job for this product that went unmentioned is the production of 269 unique frames that the guests will be able to use to decorate their photos. The user interface to handle the frames was designed to be scalable for the future, as we plan to keep adding new frames alongside QoL features.

Expanding the Mobile App

Preliminary designs for the mobile app expansion have already been created, as we look to give the users more features at the convenience of their phones. The most impactful feature will be the ability to create and edit events on the go, expediting the setup process.

Lessons Learned

This project was an opportunity for me to craft a design system from scratch.

In summary, here are some key takeaways and improvements that will help me in the future.

Bend the rules a little bit, if it serves a greater purpose. Although HP's branding is not about the fun and casual vibes that a photobooth brings, we pushed forward with a design system that strays far from HP's typical blue and white. Although if I were to redo the design system, I would push the vibrance factor even further to make the photobooth even flashier.