Webflow – Interactions 2.0 | Hacker News Reader

Webflow – Interactions 2.0

webflow.com

I feel like they should allow me to try their designer without having to sign up. I'd recommend they split test that against their current onboarding flow.

Check out https://www.flexboxgame.com/ to experience the Webflow UI while playing a Flexbox game. Gives you a sense of the controls that Webflow exposes without signing up.

Hmm, I can't seem to get past Level 1 in the flexbox game. I'm probably doing something wrong, but the circle I'm supposed to drag to the outline doesn't want to move.

You aren't supposed to click and drag it. You use the css flexbox attributes (see right-hand sidebar) to move it over the goal.

This page loaded quickly for the amount of stuff it has on it, but it scrolls slowly in some parts (and really slowly in one, the part after WORLD WIDE WEB, with the CERN Welcome screens). It also pegs my CPU the entire time. I assume this is due to some of the animations happening constantly throughout the page, even when things are not on screen, since this happens with constantly running CSS transitions on any website. Since this is done in Javascript, why can't they detect if the specific element is on screen and enable/disable the transitions happening for it? A page like this is uncommon since it's a showcase of the tech but I would imagine this would save a lot of headaches for future designers when designing multiple animations on a page (or at least give the option to "stop when not on screen" for an animation).

Hey, yladiz!

I'm the tech lead on IX2. Are you using Safari by chance? The part after WORLD WIDE WEB is a known issue and we are working on it, but it works smoothly in Chrome (if you could give it a try). We are also looking at how we can best cull off-screen animations to minimize CPU usage. Thank you for the great feedback!

Best, Leonard

In that case I'm a little confused. If you're showcasing this new technology but it only works well in one browser or has issues in other browsers (Safari lags and Firefox has some issues as well, not sure about Edge), why not wait until it's more ready in the others before showcasing it, especially if you're creating a new version? It doesn't have to be perfect, but if this is your showcase and it only works well in one browser (and it doesn't say this in the page), it looks kind of bad in my opinion. I thought we were beyond the "Works well in Chrome" phase of web design...

I'm not critiquing the actual page, which I think is really slick and well designed, just the process for creating this new technology and forcing customers to deal with this issue implicitly if they use certain animations.

Using chrome on a brand new macbook pro and scroll is a little janky everywhere on page.

Which site are you experiencing the jank? https://webflow.com/interactions-animations or http://webflow.com/ix2

Sorry this one: https://webflow.com/interactions-animations

I signed up to try Webflow. Unfortunately Firefox is not supported. I guess the "Only works in Chrome" really is the new "Works best in IE6".

Hey @trizinix, I fully understand and agree with your sentiment. History sure has a way of repeating itself. As one of the devs on the team who is primarily a Firefox user I feel this everyday. The primary reason we don’t support Firefox is due to our usage of custom scrollbars: https://bugzilla.mozilla.org/show_bug.cgi?id=77790#c188

You can vote for this issue on our Wishlist to help get Firefox support prioritized on our roadmap: https://wishlist.webflow.com/ideas/WEBFLOW-I-17

(Fwiw the published sites from Webflow do fully support Firefox, just the Designer itself does not.)

I usually don't post seemingly pedantic comments on HN, but I have to call you out here. You guys are blocking users from using your application in Firefox because of scrollbar colors? That seems like a terrible choice given it is probably alienating a good chunk of potential users.

On that note, can a screenshot be provided in Firefox with the Webflow designer, provided the code functions? If it's really just a scrollbar issue, and the UI is that bad according to the Bugzilla comment, can we see how it looks?

Here's a little screen capture of what Webflow looks like in Firefox https://cl.ly/3J0c2v2Y093O — the scrollbar causes quite a few issues with layout, but also we have to take into account the fact it's also a different width, which doesn't play nicely with drag 'n drop.

What would HN be without pedanticism? ‍️¯\_(ツ)_/¯ We’re also more than just “guys”.

Well people: it's "pedantry" and you ought to support Firefox without people voting on a roadmap. I mean I feel an Ed Reardon scale rant coming on...but no...gone.

most people aren't going to get the ed reardon reference.

http://www.bbc.co.uk/programmes/b006r5ck

the full series is available from the usual places.

https://english.stackexchange.com/questions/11816/is-guy-gen...

(ﾟヮﾟ)

Do you folks need a custom scrollbar? Is it functional in any way?

We have a few senior developers who develop Webflow in Firefox.

So yeah, right now we have soft support for Firefox and definitely want to move that to official support, especially now with Firefox gaining much deserved momentum.

Nice launch!

One thing is that the page here: https://webflow.com/interactions-animations is pretty janky on scroll on my top of the line macbook pro. My guess is its because there are a lot of animations being demo'd which probably wouldn't happen on a real site.

But just a heads up.

From a quick look in the Performance tab, there seems to be an expensive path in "bugsnag", an error reporting tool, on every scroll and mousemove.

WebPageTest.org result: https://www.webpagetest.org/result/171024_AW_97ca0329c0a7e7d...

I am impressed how fast it loads, despite it being over 3.5MB.

Hey there, Webflow CTO here. We take performance seriously here so I'm secretly in glee to see users notice this. It's a similar stack we use for Webflow hosting: https://webflow.com/hosting

A few things on this page that make this site fast:

- Responsive Images created for you as your build your site (https://webflow.com/feature/responsive-images)

- HTTP2 wherever possible

- Fastly for initial HTML document for sub 10ms TTFB, depending on your location - their instant purge makes it possible for our users to see their updated sites super quickly

- AWS Cloudfront for static, scripts, and media assets

Neat tool - and a lot of hard, careful work no doubt.

In one of your articles, you say that your product isn't a 'grandma web site builder' or something to that effect. Any chance you could, in the future, perhaps use different language? Maybe something a little less derogatory to older folks?

I totally get that it wasn't your intent!

Yea, when I said it verbally on the Skype call with Matt (the reporter) it definitely conveyed much more of a satirical tone, but in hindsight, I realized that was a mistake. My 奶奶 definitely would have scolded me for that. Sorry 奶奶...

It is quite snappy, yes!

This is very impressive. I don't have to labor anymore over tediously designed landing pages with slick animations. This looks like it's as easy to use for designers as After Effects.

holy crap that took forever to load on mobile safari

Worked great on mobile safari for me

Ditto on an iPhone 7 with iOS 11.0.3. Butter smooth scrolling too.

Reply on news.ycombinator.com