Project Overview
Jellyfish Lighting offers a permanent exterior lighting system that eliminates the need for seasonal installation and removal. While the hardware experience is excellent, the companion mobile application presents usability challenges. The existing UI feels overly complex, engineered around system capabilities rather than user mental models, and difficult to navigate when defining lighting behaviors at scale.
This project is a personal UX and UI redesign study focused on simplifying the experience while preserving the flexibility power users expect. The goal was to create a clearer, more intuitive system that feels modern, approachable, and purpose-built for daily use.
Project Scope
- Deliverables: Adobe Photoshop, Adobe Illustrator, and Figma Files
- Tools: Photoshop, Illustrator, Figma
- Role: UX Designer, UI Designer, Visual Designer
Design Goals
- Simplify the mental model for defining and managing lighting patterns
- Unify related functionality into a single, cohesive system
- Reduce cognitive load without limiting creative flexibility
- Align the interface with a familiar, platform-native feel while remaining brand-agnostic
System-Level Redesign
Rather than treating recurring patterns and individual light definitions as separate concepts, the redesigned UI unifies all pattern creation under a single system. Patterns are grouped into two clear types:
- Repeating Patterns
Designed for cyclical or repeating behaviors across zones or runs of lights. - Linear Patterns
Intended for precise, sequential control of individual lights when granular definition is required.
This structural change reframes the experience around how users think about light behavior, rather than how the system internally processes it.
Visual Language and Platform Influence
The interface follows Apple’s design language in its emphasis on clarity, spacing, and hierarchy, but avoids strict adherence to iOS conventions. The result is a UI that feels familiar and refined without becoming derivative.
Key visual principles:
- Clean typography with strong hierarchy
- Purposeful use of white space to reduce visual noise
- Subtle depth and contrast to guide attention
- A restrained color palette that supports, rather than competes with, lighting previews
Zone Management and Iconography
To improve clarity when managing complex installations, custom icons were designed to represent different lighting zones. These icons serve multiple purposes:
- Visually distinguishing zone layouts and arrangements
- Indicating powered on or off states at a glance
- Providing a scalable system that can accommodate additional configurations
This approach reduces reliance on text alone and improves scannability across the interface.
Process and Fidelity
The project began with exploratory sketches and low-fidelity concepts to test layout and hierarchy. Initial designs were executed as Photoshop mockups. These were later reworked into a high-fidelity Figma prototype, allowing for more precise interaction design, spacing, and component consistency across the system.
Outcome
This redesign demonstrates how a complex, capability-rich system can be reframed into a clearer, more approachable experience without sacrificing power. By focusing on mental models, system unification, and visual restraint, the Jellyfish Lighting UI becomes easier to understand, faster to use, and more enjoyable to interact with.
This project serves as both a UX case study and a critique-driven redesign, highlighting product thinking, information architecture, and system-level UI design.