New Funnels UI not legible on dashboard

PostHog / posthog

🦔 PostHog provides open-source product analytics, session recording, feature flagging and A/B testing that you can self-host.

https://posthog.com

Other

21.62k stars 1.29k forks source link

New Funnels UI not legible on dashboard #5171

Closed samwinslow closed 3 years ago

samwinslow commented 3 years ago

Bug description

Funnels UI is not optimized for a small container.

Environment

[ ] PostHog Cloud
[ ] self-hosted PostHog, version/commit: please provide

Additional context

Thank you for your bug report – we love squashing them!

clarkus commented 3 years ago

I was just looking at this as well. It looks like the dashboard-level controls for configuration aren't working as expected either.

Gray background color persists through dashboard color options. I will work on updates for this.
Funnel layout doesn't work. Despite settings on the saved insight, funnels are always shown left-to-right on dashboards.
Regarding resizing - funnel steps in the left-to-right layout are fairly constrained at a minimum width (roughly 160px). We should be able to fit 2-ish steps in a 320px viewport. On resize, we might consider showing more steps instead of trying to adjust bar step sizing.
We could also change our precision formatting for rates of change in the chart. It should scale to 5 characters per rate of change nn.nn%... 7 if you count the parens :)

clarkus commented 3 years ago

Attached are updated color schemes for the latest funnel visualizations on dashboards. These are available in figma at https://www.figma.com/file/gQBj9YnNgD8YW4nBwCVLZf/PostHog-App?node-id=2903%3A5558

Purple purple Blue blue Green green Black Black Default - White

samwinslow commented 3 years ago

We could also change our precision formatting for rates of change in the chart. It should scale to 5 characters per rate of change nn.nn%... 7 if you count the parens :)

100% (or should I say 100.0000%).

Implementation detail: humanizeNumber has built-in support for toFixed

Mentioum commented 3 years ago

https://www.figma.com/file/gQBj9YnNgD8YW4nBwCVLZf/PostHog-App?node-id=2903%3A5558

The response to this new Funnel design from our Marketing team was "Oh my god, that's so much better"... "So nice!"

samwinslow commented 3 years ago

Some users are also reporting completely blank funnels on dashboard.

paolodamico commented 3 years ago

Yeah I noticed something broke in a merge or something, I'm actually fixing that right now