Back to work

Experimental Projects / 2024

MIDI Keyboard App

Browser-native musical interaction

Input

MIDI

Overview

The product frame

The MIDI Keyboard App explores tactile digital feedback, low-latency interaction, and expressive controls.

The Challenge

Browser music tools need to feel immediate to sustain creative flow.

Input latency
Device compatibility
Visual feedback

Research

Understanding the operating context

The work begins by identifying the user decisions, business constraints, domain language, and moments where the system must reduce uncertainty.

Architecture

A responsive instrument surface with clear controls and compact interaction states.

Device input layer
Keyboard state machine
Visual response system

Development Process

From model to interface

Interaction engineering
Audio interface
Prototype architecture

Tech Stack

Tools selected for the shape of the product

React
TypeScript
Web MIDI API

Gallery

MIDI Keyboard App

Interface study 01

MIDI Keyboard App

Interface study 02

MIDI Keyboard App

Interface study 03

Key Features

What the system makes possible

A browser experiment connecting interface design with musical input and immediate feedback.
A responsive instrument surface with clear controls and compact interaction states.
Input: MIDI

Solutions

Decisions that lowered product risk

Recording mode
Preset system

Results

A clearer system for real work

The outcome is not just a screen set. It is a more legible way to move through business logic, product decisions, and user tasks.

Lessons Learned

The interface is only as strong as the model beneath it

The strongest product decisions came from treating data relationships, user intent, and operational rhythm as one design material.

Next Project

BMT Inventario

Continue