UX Idea/Proposal: Navigation Tweaks

judyio · April 1, 2021, 4:57pm

I skimmed the history of the Rack Development Blog and didn’t see any upcoming changes to this, so I’m asking here if it’s been done already, if others have thought about it, and feedback on my idea if I decide to try implementing it myself on v1.

My only major gripe with Rack is navigation. Even on my main 27" 1440p monitor, any project quickly grows to the point where I need to move around the space frequently. And I can’t stand the default key commands of

Scroll: Scroll rack vertically.
Shift+scroll: Scroll rack horizontally.
Ctrl+scroll: Zoom in/out.
Middle mouse button drag: Pan rack view.

I use Rack on Windows with a traditional 3-button mouse, and macOS with a trackpad. Neither case is intuitive to me. On something like a website, navigating up/down with the scroll wheel makes sense, because you don’t usually zoom in/out on a website or have to navigate left or right. On any other program I use where you can move in “3d”, so to speak, the scroll wheel moves in/out (zooming), so Rack is constantly throwing me for a loop when it doesn’t work like that.

My ideal setup on Windows with a mouse would be something like

Scroll: Zooms in+out
Click+drag on empty space: Pans view

On macOS, navigating anything with the “magic trackpad” is very intuitive, and Rack is the only application I have that doesn’t use the functionality it offers. Apple lists the usual Multi-Touch gestures out here, and I’d make Rack operate in the same fashion.

Pinch fingers: Zooms in+out
Slide two fingers in any direction: Pans view
Double-tap two fingers: Switch between 100% view and zoomed in/out view.

There are other gestures that would be fun, but not necessary. Like rotating two fingers around to turn a knob? Anyway, I know that would conflict with the current controls, so I’d make this a toggleable setting in the menu.

I also loved this idea from another user. I use these defaults constantly in my other creative applications. Adobe has been very consistent about creating these as defaults in all of their applications.

Hold Space, then click and drag anywhere (not just on empty space): Pans view
Hold Space+Ctrl: Cursor turns into Zoom In icon, clicking zooms in to that location one level.
Hold Space+Ctrl+Alt: Cursor turns into Zoom Out icon, clicking zooms out one level.

Now, I’m a web developer and haven’t touched C++ since college. But I’ve been thinking about picking it up again, just enough to try out the idea. But I wanted to make sure this isn’t something that’s already done in V2, and/or collect feedback. Thought?

Ahornberg · April 1, 2021, 5:44pm

For zoom, there’s also [Ctrl]+[NumPad +] to zoom in, [Ctrl]+[NumPad -] to zoom out and [Ctrl]+[NumPad 0] or [Ctrl]+[0] to set zoom at 100%.

There’s also Stroke by Stoermelder VCV Library - stoermelder STROKE

Feel free to develop alternative navigation gestures.

judyio · April 1, 2021, 8:52pm

OMG YOU GUYS

I have a prototype working. I can’t believe how easy it was to build the project and try the changes. Mostly a proof of concept right now, but you can click+drag outside of any panel to navigate, and the mouse wheel scrolls in+out. Clicking on any other panel control still works as expected

I added a menu item and called the original way “legacy navigation”, though I hope that doesn’t sound snarky or dismissive.

Screenshot 2021-04-01 164133

Huge props to Andrew for making Rack so easy to build and understand. Next, I’m going to:

Tweak the icon to be a hand when dragging the interface around so it’s not just a cursor.
Try the same build on my Mac and make sure both the new and old functionality still works there.
Fork Rack on Github and submit a PR. And see what it takes to make a production build so others here can try it.

After that, I’m looking forward to programming in the magic trackpad gestures and trying out the keyboard combos that @luvv suggested. I can’t wait to get patchin’ again.

Squinky · April 1, 2021, 9:53pm

Andrew does not usually accept PR’s, and right now while he is super busy with (I presume) rack 2.0 I’m pretty sure he won’t. Often people post their own versions…

Ahornberg · April 2, 2021, 5:24am

Do you plan to publish your fork on Github?

judyio · April 2, 2021, 12:39pm

Appreciate the heads-up. Yeah, I’ll make the fork public. I’ll do that this morning before forging onward.

judyio · April 3, 2021, 4:53am

Busy with work this morning, but pushing up my navigation branch here. If I can figure out how to create a release for Windows, I’ll push that up too.

EDIT: FWIW, I’m trying to set up a Github Action to automatically create a windows build. It’s almost 2 AM ET so I’m going to bed, but hopefully it’s created something by the time I get up in the morning. Progress of actions here: Actions · judy/Rack · GitHub

Ahornberg · April 3, 2021, 6:12am

Just a question: Is it possible to put your solution into a module similar to the module MB by Stoermelder?

I’m asking because if your solution can be put into a module, there’s no need to re-install the Rack itself and future updates to your code could be distributed easily.

judyio · April 3, 2021, 1:40pm

That’s a good question. I think it’s possible… but I got away with my changes because they were mostly tweaks to the existing code base. Writing a new module to inject functionality is miles ahead of what I did.

That being said, maybe I can look at MB, see how it modifies the functionality of Rack, and create a clone with my tweaks?

judyio · April 3, 2021, 2:10pm

Well, I got a continuous integration system set up for Rack, so there’s another win! I haven’t set up a final “release” step yet, but if I can find more time soon I’ll wrap that up so everyone can download the build. I also learned how to set up a “matrix” too so linux and mac builds can be done concurrently, which will be useful once I develop the magic trackpad features for nagivation. Hopefully other devs will find the CI build system useful for their own forks, should be easily adaptable to the Rack Plugin SDK. Actions · judy/Rack · GitHub

In other news, I looked through the MB source and I’m not sure how the existing module browser is being overridden. Hopefully @stoermelder can help me figure that out? The change is quite small, just these two commits. All it does is turn off checks for the modifier keys, and everything works as expected. I’m sure it’ll get more complicated when enabling magic trackpad/photoshoppy features, but for now…

Ahornberg · April 3, 2021, 3:07pm

I think it would need the approach used in VCV Library - Modular Fungi Lights Off to capture and manipulate the mouse events. From this perspective, your simple solution seems to be the way to go, although it requires re-installing the Rack.

Maybe contact @Vortico to get your changes into Rack V2.

stoermelder · April 4, 2021, 6:50am

Well, the module browser is “overriden” by exchanging its member variable in the Rack-window:

github.com

stoermelder/vcvrack-packone/blob/93b45555b58b9830d1094f16ed5ab42eacb3539e/src/Mb.cpp#L158


	mbWidgetBackup = APP->scene->moduleBrowser;
	mbWidgetBackup->hide();
	APP->scene->removeChild(mbWidgetBackup);

	mbV06 = new v06::ModuleBrowser;
	addChild(mbV06);

	mbV1 = new v1::ModuleBrowser;
	addChild(mbV1);

	APP->scene->moduleBrowser = this;
	APP->scene->addChild(this);
}

BrowserOverlay::~BrowserOverlay() {
	APP->scene->moduleBrowser = mbWidgetBackup;
	APP->scene->addChild(mbWidgetBackup);

	APP->scene->removeChild(this);

	pluginSettings.mbV1zoom = v1::modelBoxZoom;

I’m not sure though if this will help in any way. What might be interesting for you how I capture “top level” events of Rack’s window in STROKE:

github.com

stoermelder/vcvrack-packone/blob/93b45555b58b9830d1094f16ed5ab42eacb3539e/src/Stroke.cpp#L908


struct StrokeWidget : ThemedModuleWidget<StrokeModule<10>> {
	KeyContainer<10>* keyContainer = NULL;

	StrokeWidget(StrokeModule<10>* module)
		: ThemedModuleWidget<StrokeModule<10>>(module, "Stroke") {
		setModule(module);

		if (module) {
			keyContainer = new KeyContainer<10>;
			keyContainer->module = module;
			// This is where the magic happens: add a new widget on top-level to Rack
			APP->scene->rack->addChild(keyContainer);
		}

		addChild(createWidget<StoermelderBlackScrew>(Vec(RACK_GRID_WIDTH, 0)));
		addChild(createWidget<StoermelderBlackScrew>(Vec(box.size.x - 2 * RACK_GRID_WIDTH, RACK_GRID_HEIGHT - RACK_GRID_WIDTH)));

		for (int i = 0; i < 10; i++) {
			addChild(createLightCentered<TinyLight<WhiteLight>>(Vec(8.6f, 50.1f + i * 29.4f), module, StrokeModule<10>::LIGHT_SHIFT + i));
			addChild(createLightCentered<TinyLight<WhiteLight>>(Vec(14.f, 50.1f + i * 29.4f), module, StrokeModule<10>::LIGHT_CTRL + i));
			addChild(createLightCentered<TinyLight<WhiteLight>>(Vec(19.4f, 50.1f + i * 29.4f), module, StrokeModule<10>::LIGHT_ALT + i));

judyio · April 10, 2021, 7:39pm

Really appreciate the tip on checking out STROKE! I’ll look through that for reference.

Took a week off Rack for work stuff but hopping back into this project. My preference would be to finish the changes on my fork and see if those would be welcome additions to Rack v2. If that’s not an option, then I would need help writing the necessary code from scratch for my own module. It was a lot easier to modify the existing code to do what I wanted it to do, but it’s a lot harder to write original code, especially when I’m so out of practice with C++.

LarsBjerregaard · April 13, 2021, 6:42am

Just don’t get your hopes up on that one, that’s not how Andrew rolls. Rack might be an open-source project, but it’s not really an open-development project. I think better just to live with that and try and go down the route that Stoermelder has done, which works very well.

idkreina · March 16, 2024, 12:29am

hey all, sorry if ive missed this somewhere more obvious but i was wondering if its possible to zoom using a pinch gesture on the mac trackpad?? if not natively, is there some way of mapping custom gestures??

sounds · March 16, 2024, 1:14am

not sure, but i just hold command and two finger scroll up or down.

idkreina · March 16, 2024, 1:22am

ya im aware of this & it works fine but would prefer the pinch to zoom gesture for my personal workflow

Squinky · March 16, 2024, 1:48am

I feel like this kind of thing would be platform specific, and VCV would therefore be very unlikely to do it?

idkreina · March 16, 2024, 4:53pm

hmm i mean it is platform specific but im curious why you think its unlikely to be implemented for that reason?? as also noted in the og post, every app i use on the macbook utilizes these gestures (from chrome to ableton/reaper to adobe apps) so its curious to me vcv is the exception. at the end of the day its not going to make or break my experience using vcv, but it does feel odd having to adjust to when everything else feels standardized in this sense. especially as im often running both vcv & premiere in tandem for education work.

if it is indeed out of the realm of being added by the vcv devs, i also saw the op was perhaps working on a third party implementation of these gestures which is y i decided to necro this thread specifically. wasnt sure if there was any progress that had been made, or if anyone else had built a way to map gestures etc.

Squinky · March 16, 2024, 4:58pm

Because there is very little in VCV that is platform specific. Especially features - it’s really, really unlikely that VCV would ever have a feature only on the mac and not on Linux of Windows (for example).

But, heck, maybe I’m wrong. It’s happened many time before.