Propose logic for zoom levels based on the labels on the leaves on desktop and mobile

[gissoo]

This issue tracks design work through the CDH design review workflow.

Here is a link to the

Description:

How the proposal/idea can fail:

Questions:

1. Does the idea and/or the design make sense to you? If not, please say why
2. Is there anything that you expected to see and is missing?

Additional context
Add any other context or screenshots about the design here.

[rlskoeser]

@gissoo would you consider this to be complete based on our conversation and decisions yesterday?

[gissoo]

I think so! @rlskoeser

Below are some of the main decisions we made:

• no zoom on desktop
• pinch to zoom on mobile
• Don’t show leaf labels on default mobile view; show at first zoom level
• 4 levels of zoom (on level 4 the size of the leaves seems to be good/almost accessible while being able to see more leaves)
• on zoom we should not let the svg go beyond our defined borders (so we do not see empty space beyond the century labels or extra space on the right side of the svg, beyond the last R+R leaf)
• When a leaf is clicked at any zoom level, zoom in to level 4 while centering on that leaf; may need to center higher in case the leaf panel overlaps
• When leaf panel is closed (x), leave the tree zoomed in on whatever zoom level it is on
• We should design and implement a button to reset zoom (go back to the default zoom level)

[rlskoeser]

Thank you @gissoo !

Just to confirm, regarding "no zoom on desktop" - is this based entirely on screen size? Does it matter whether or not it is a touch device?

[gissoo]

@rlskoeser I forgot to respond to your comment! I think it needs to be entirely based on the screen size, because all the leaves do fit on the desktop size, so interacting with the leaves by fingers should still be easy.