IN COLLABORATION WITH

0-Roli-Logo

CHALLENGE

Roli approached us with a prototype of an illuminated keyboard and a promise to make playing music more accessible. Together, we defined, positioned and crafted the smarter way to learn and play music.

RESPONSIBILITIES

UX/UI
Research
3D Design
Graphic design
Motion

TEAM

Yuta Sagawara — Creative director at Roli
Angus Keith — Product owner at Roli
Matt Rice — Creative director at Sennep
Kin Man Leung — UX/UI, Graphic design, Motion
Peter Tarka — Final 3D design and 3D artworks

The project was made at Sennep

Process

CHALLENGE

During our research, we studied the 4 key areas LUMI encompasses — music education, music making and consumption, training and gaming.

1-1-Research@2x
Market research

STRATEGY

Following that, we defined with ROLI three routes the app can be developed into – A textbook, a game and a content app.

Designing each route taught us that although those routes are fundemantily different, the real magic happens when combined.

1-2-Strategy@2x
Positioning

VISUAL DESIGN

We produced 3 different routes for all of the game’s 7 views, both dark and light mode.
Inspired by the tactility of the product, I wanted LUMI to be a world that is fun, welcoming and physical that embraces the keyboard’s unique light aspect.

2-1-visual-dark@2x
2-2-visual-light@2x
2-3-game-1-dark@2x
2-5-views-dark@2x
2-4-game-2-light@2x
2-6-views-light@2x

LEADING WITH CONTENT

Following user research we chose to lead with LUMI’s music catalogue since playing your favourite music, is one of the most rewarding aspects in learning how play.

3-1-library@2x

LEARN BY PLAYING

We have explored the different ways we can create a fun and meaningful experience.

4-1-game

RESULT SCREEN

Celebrating success and showing users’ progress are fundamental elements in a satisfying and effective learning experience. The suggestion engine will motivate users to take their next step that will help them progress the most.

5-1-results

LEARN

Bite-sized interactive lessons teach the elements of music, such as scales, chords and playing techniques. We organised the lessons into different paths, to give users the autonomy to choose what to learn.

6-1-learn@2x
6-2-artworks@2x

The lessons artwork were based on the 3D clay concept, and visualises the lessons as a smaller unit in the bigger paths.

HOME

To support the ever-growing song and lesson libraries, Home enables LUMI to creatively curate its content around themes, artists or genres.

7-1-home

LEARN

We designed LUMI’s entire music catalogue of over 200 songs — creating a consistent yet flexible system accross contemporary, classical and traditional genres.

8-1-artwork@2x
8-3-artwork-thumbnails@2x
8-2-artwork-world@2x
8-4-photo

ONBOARDING

Aimed to celebrate the first impression of the product and to quickly guide the user on how to connect their new LUMI keys.

Other projects

42Percent NoirExperimental

AnchorProduct design

BarclaysProduct design