Why does this exist?

A crowded streetcar might seem like the last place that ideas would flow freely, but it worked for me. The background chatter. The occasional bright spark of the power lines ahead. Standing with just enough room to wield my phone a few inches from my face as my arm contorted into an angle so acute it was practically a line. It just... Worked. But I couldn't seem to jot my ideas down as quickly as they came to me. I needed something more fitting for my one-handed flurry of typing.

So I created Redberry.

I had been using Workflowy, which is a fantastic productivity tool. It helps countless people organize their lives through its brilliant "fractal document" UX. On desktop it boasts keyboard shortcuts and intuitive mouse controls, but its mobile app is just a direct translation of its desktop experience.

Redberry aims to solve this problem. It has a desktop UX that's heavily inspired by Workflowy, but it also has a completely reimagined mobile experience.

Hierarchy

The most pressing issue I had with Workflowy's mobile app was how it displayed hierarchy. It still used indentation, despite increasingly narrow phone screens.

By only ever showing a single column of information (one specific level of indentation), I was able to remove an entire column of buttons along the right side of the screen. (These were +/- buttons, used to expand/collapse details, respectively.)

At the top of Workflowy's UI is a horizontal list of all of the ancestors to the current bullet point. This would quickly become quite long, and require horizontal scrolling to even see where you were in the document.

In Redberry, this is shown as a hamburger menu. Instead of a horizontal list, it shows as a vertical list, so it's much quicker and easier to see where you are.

Gestures

Of course, removing indentation from the interface produces new problems. If it's not possible to see multiple levels of information in the same view, the next best thing is to make it quick and easy to switch between levels.

That's where the gestures come in.

In Redberry's mobile app, there are four directional gestures for navigating the tree. These provide immediate visual feedback as the user starts a gesture, and animate the change to help provide a sense of persistence.

Infrastructure

When making software that targets phones, it's important to design around poor network conditions. Redberry is a Progressive Web App (PWA). The first time you load it, it downloads everything it needs to work offline. From that moment onward you can access the app even if you're in airplane mode. (This works on both PCs and phones.)

Users don't even have to create an account to use Redberry. It saves everything offline to IndexedDB whether the user is authenticated or not. Authentication and a network connection are only required to use the backup and synchronization features.

Bonus Round

In addition to the enhancements above, Redberry has a more advanced search than Workflowy. Instead of a simple "contains" filter, Redberry uses stemming and other techniques to match results regardless of the capitalization, conjugation, and order of the words.

For example, searching for "Bug Fixes" would still match the exact text "Bug Fixes". However, it would also match entries such as "Fixed 'Hello World' bugs".