Desktop zooming shipped

Hey all,

The next time you load Kinopio on desktop, you’ll see a slider bar in the bottom right that’ll let you zoom your space out and work at a birds eye view. While zoomed out, you can still do everything you could before (make new cards, paint them, connect them etc).

You can zoom by dragging on the bar, using cmd/ctrl-plus or minus, and cmd/ctrl scrolling up or down.

You can also invert the scroll zoom direction in your user -> settings.

Let me know how it goes! I’ll let the world know later

1 Like

a quick off the cuff capture

enjoying working slightly zoomed out.

if you use the align-and-pack options at zoom levels below 100%, the math is not quite right :slight_smile:

1 Like

arg good catch, i’ll look into that later today

1 Like

Can you please add the ability to zoom in farther than 100%? I do that a lot because I have a 4K monitor, but I frequently screenshare with my team, and it’s too small for them to see. I used to bump up the zoom to 150% or even 200% using the default browser zoom.

I tried manually changing the scale to 2, and it looks fine, but I found interaction is wonky. When I click, the edit card dialog is off screen, and it’s hard to get it in view. It feels like I’m fighting against some code that is not prepared for the scale to be 2 :slight_smile:

– ben

I’ll find a way to reverse this regression for this use case. Likely I’ll make it so that if you’re already at 100% zoom, pressing cmd+ will use native browser zoom

1 Like

just shipped the cmd+ fix

1 Like

thanks for the quick turnaround!

a related bug I found…if you start at 100% and zoom-in a bit with ⌘-+, it works as expected. but then, if you then hit ⌘-- to zoom back out, sometimes it triggers your code to adjust the scale, and it gets out of whack. you have to reset the zoom (⌘-0).

it looks like the edit dialog isn’t being scaled properly, too:


cheers :nerd_face:

hmm i’ll have to think about how to solve that one because js code doesn’t have access to the current browser zoom level (I think?), nor does it have the ability to reset the browser’s zoom level

1 Like

Update: came up with a workaround and shipped it. it’s a bit hacky but looks like it solves this issue

cool, yeah it works better. it lets me scale down even more (CSS scale combined with browser zoom), which is kinda nice actually:

btw, I still see the issue with the edit card dialog’s scale being a bit whack. hmm, is that intentional?

yes that’s intentional, I want people to be able to edit cards and click buttons as usual even when zoomed way out

1 Like

I can adjust the minimum zoom level pretty easily, I put it at 40% because I wanted things to still appear usable for the most common types of spaces when zoomed out to max - but maybe I was too conservative.

Yeah I don’t know in practice yet, but it feels like being able to zoom way out to see the shape of the space and manipulate sections would be useful.

As you work, if you could send me screenshots of your spaces at the zoom out you’d prefer it’ll help me judge

1 Like

another related bug (you probably are already aware of but didn’t want it to get missed) – when zoomed out, the math for ⌘-Shift-A isn’t quite right. It is selected cards above where my cursor is.

1 Like

and also the calculation of the placement of the edit tag dialog…

1 Like

thx! on it

The shouldInvertZoomDirection toggle feels flaky. I have toggled it to true, but sometimes it gets reset to false. I just tried setting it to true, but when I query the API for my user setting, it says it is false. In a separate browser, the setting is false. So perhaps in the former browser, it is cached locally, but it doesn’t seem to be persisting to the server.

– ben

1 Like

releasing a fix right now to fix that

1 Like