
Create JavaScript, CSS Interactions With Zero Lines of Code - callmevlad
http://interactions.webflow.com
======
danso
Let me preface this by saying: I have the upmost respect for the Webflow
developers and designers...they've created a highly-functional web app with
the purpose of enabling creators...the process to make such a full-featured
web-browser product with such a range of capability is astounding.

That said, I disagree with the implication that Webflow, and similar products,
solve the problems of code, e.g., the phrase "Do xyz without writing a line of
code". Knowledge of code does constrain non-developers, but in the end, that
is not the _hard_ part. To use a quick example: the mechanics of baking
responsiveness into a new site from scratch is significantly easier than the
conceptual process of "What information and features should be prominent, or
excised, in the mobile view of our website?"...and in my opinion, that latter
problem is something that people can get into without knowing how to write
code.

So despite the technical strength of the Webflow product, I don't think that
it makes things easier in the end. Instead of "code", a newbie has to learn a
whole new interface, a whole new set of iconography/terms (used for buttons,
subheads, etc.), and last but not least, a whole new set of quirks inherent to
the Webflow program. And when they become experts at this, they have spent
50-90% of their cognitive ability mastering Webflow, and the remainder
understanding the creative and technical process of web development.

At some point, isn't it just better to learn _some_ code? Not 10 years worth,
but something in between that and "0 lines of code". I've used Webflow, and
I'll repeat again, it is an excellent web product in execution and
design...but the problem it attempts to tackle is just too _big_ , and the
abstractions it offers may ended up hindering creators in the medium-to-long
run.

~~~
callmevlad
I'm the founder and CEO of Webflow, and I can't agree enough with your
statement that code is not the hard part. That's why we're trying to create
tools for designers to help them focus on the hard parts (content, usability,
etc).

I love what Bret Victor says about this in his Magic Ink paper [1]. Replace
"information software" with "web applications" as you read it:

"I suggest that the design of information software should be approached
initially and primarily as a graphic design project. The foremost concern
should be appearance—what and how information is presented. The designer
should ask: What is relevant information? What questions will the viewer ask?
What situations will she want to compare? What decision is she trying to make?
How can the data be presented most effectively? How can the visual vocabulary
and techniques of graphic design be employed to direct the user’s eyes to the
solution? The designer must start by considering what the software looks like,
because the user is using it to learn, and she learns by looking at it."

The act of creating a solution IS the hard part, not tweaking CSS properties
or knowing how to integrate Bootstrap components just right. All those things
should just get out of the way and let creatives do the important work,
without bogging down in the implementation details.

In case you're interested, I wrote a bit more about this on our blog a while
ago: [http://blog.webflow.com/designers-will-rule-the-
web](http://blog.webflow.com/designers-will-rule-the-web)

[1] [http://worrydream.com/MagicInk/](http://worrydream.com/MagicInk/)

~~~
brenschluss
I absolutely agree with all of you say -- which is why "without code" is
misleading / unhelpful.

A better tagline for the web interactions site would be: "Don't code website
interactions; design them."

~~~
mbesto
As long as "without code" is the copy that converts better, then it doesn't
matter.

------
evanmoran
The most important thing to keep in mind is this is for designers not coders
-- I haven't looked at this deeply enough to know if it is good yet, but my
guess is if you read hacker news comments it isn't for you because, well, you
probably code=).

Yes, these sorts of editors often create horrible leaky abstractions. Yes,
these editors often confuse product folks into thinking that coding isn't
necessary or important or hard. But that isn't its goal -- the goal is to make
the common stuff easy to do for people writing / designing simple site content
-- fades, positional, simple triggers. There is no reason to write code for
this stuff.

If you don't believe me, imagine drawing something without showing the
picture. Word documents without wysiwyg. Photo editing without Photoshop. In
this video ([http://vimeo.com/64895205](http://vimeo.com/64895205)) Bret
Victor brilliantly shows what a powerful interactive editor can do. For the
web, no amount of manual css typing can beat what a great editor could do.
Whether this is that editor remains to be seen, but the idea of editors is a
good one.

~~~
kpapke
Actually I think Webflow can be a useful tool for if you're a developer who
wants to learn how to design a prototype. I struggle with visualizing a new
site without a mockup or style tile for reference. Webflow's UI is intuitive -
everything you do has immediate visual feedback and directly translates into
clean CSS/HTML. The previews of media queries affecting content is nice too.
So it's very easy to reverse engineer how to make a good design, the same way
you would reverse engineer some source code.

But with that said, I am not a paying customer. When I need to make a site
then I just sign up for a free trial and export the code to continue the
project. Their individual plan doesn't really make sense for me and I think
it's too expensive.

------
habosa
This is amazing, and I really intend to use it. I am a developer but I just
suck at front-end (CSS, mostly) and I have a much easier time learning back-
end stacks. I haven't used WebFlow yet but is it fairly easy to use it to
create bits and pieces to put into my entirely separate website?

Also for a person like me, it would be great if there was some sort of
"explain" feature where Webflow would give me a peek at what's going on so i
could slowly learn. For example: "This fade-in was achieved using the CSS3
fade animation with the following line of code: ...". I know that's a niche
feature, but I think there are a lot of design-challenged coders out there who
would like it.

------
dangoor
Nifty looking tool!

The home page is missing a link to pricing. I couldn't find pricing until
clicking through to the Features page.

------
chrisweekly
Sure it demos well, but it's closed-source. Vendor lock-in sucks, full stop.
And the time investment spent learning it won't pay off bc those skills won't
carry over to the vast majority of other future projects that don't use it.

Building a site on bootstrap (from source, ie integrating bootstrap's less
files as dependencies in your webapp via grunt and bower) is defensible;
becoming entirely dependent on the capabilities of something like webflow,
imho, is not.

I suppose if you're a designer in a hurry to build a pretty, throwaway site
(eg a microsite for an event) then this might be worth your while. But if
you're building something for the enterprise, anything you or your team might
want to maintain and extend, I think it represents an unacceptable level of
knowledge debt, to rely on site-generating tools like this.

YMMV of course. My views are skewed towards the UI architecture needs of a
multi-million-dollar global company.

/$.02

------
reedlaw
The headling should be "...without _writing_ any code". Zero lines of code
implies there is no generated code at all. That would be truly amazing.

------
azurelogic
More than half of the examples didn't even work in my browser - Chrome
34.0.1847.116, Windows 8.

~~~
liora
same here.

------
wehadfun
So you can only make websites that are hosted in webflow. I cant send the
website to my own server?

~~~
rch
Incorrect - you can download the source from within the editor. I've been
happy with the results so far.

------
Xdes
Not interested in SaaS unless there is an offline version. I like to own my
software not rent it.

~~~
Edmond
you can try HiveMind (crudzilla.com), it is something you can download and run
locally or put in the cloud such as a digital ocean box...

------
thehme
I tried sharing the site's link with someone who opened it on a mobile device
and was unable to see it - "doesn't work on my phone". Does this mean that a
site built this way would not work on mobile devices or just not on Android
devices?

------
CoryG89
Lack of scroll animation support for touch devices seems like a deal breaker,
no?

~~~
dgavey
None of the scroll animations work in Firefox either. Not just touch based
devices. Didn't leave a very good impression on me.

~~~
kkilat
Kyle from Webflow here. Are you on the latest version of Firefox (28.0)? The
scrolling animations are working for us.

~~~
Neff
Same issue here. FF 28.0 on OS X (10.8) and none of the animations are
working.

Works fine on Chrome and Safari

------
chrismorgan
Very significantly broken for me on Firefox 31 (nightly):

> TypeError: F.timing is undefined

------
buckbova
It's a good looking product.

What does this offer over something like Wix or Weebly?

~~~
rch
I've tried Wix briefly, but so far I've only explored Webflow in depth.
Comparing the two, I get an immediate sense that Webflow is a better fit for
my workflow. And as long as I'm happy with the generated code, I probably
won't be looking into alternatives.

------
Tloewald
None of the examples worked on my ipad (gen 4). I like the idea, but it seems
to me that it needs to work or at least degrade gracefully on mobile.

------
pjonesdotca
Pricing missing? Why list "try free for 14 days" when there is no price
listing?

That makes me question if I even want to take it for a spin.

------
aps-sids
Is this different from Google Web Designer?

~~~
ralfn
\- Google Web Designer is a desktop application and you can't run it on linux.

\- Google Web Designer is free to use, this costs money structurally.

\- This offers integrated hosting, Google Web Designer does not. So, for
creative types, its easier to share a design and deploy it. (although it seems
export is available)

\- Google Web Designer seems focused on (fixed-size) ads (for mobile), where
this is focused on creating responsive animated websites.

------
gbromios
Dreamweaver 2.0

------
cturhan
Scroll animation works well on windows phone 8. Seems like you didn't count it
as `touch device` :)

------
octatone2
Inline all the styles!

------
pessimizer
Instead of paying somebody once to do this stuff with skrollr, you instead
rent your own website from this company for the rest of your life? Good
business plan for the rentier.

~~~
callmevlad
Sorry, that's not accurate. Webflow sites can be exported at a click of a
button, and you own all the code. You can host anywhere you want, make any
custom changes, etc.

~~~
skrowl
Only the higher Webflow plans have export. The cheapest plan doesn't let you
export.

~~~
geuis
So what's wrong with that? These guys have built a piece of software which you
personally may or may not find useful. We are all in the practice of paying
for software and services we find useful.

As someone who has many years of experience coding animations by hand in css
and a little js, sometimes a tool would be more useful. Its too easy to get
lost in the minutiae of the code and lose sight of the visual impact you're
going for.

For some people, a tool like this is entirely worth the cost.

------
evo_9
Man are people that oppose to learning a little bit of coding?

I guess in my mind if you are that against coding maybe you should consider
just sticking with design or biz development, etc? Not being mean but
seriously, stick to what you are good at, right?

~~~
kkilat
Totally get your point, and we could have a fun philosophical discussion
around whether or not people SHOULD want to learn how to code.

However, it's pretty clear that most of the people in the world who want to
create/share content on the web are NOT interested in learning how to code at
all, right? I mean, that's a big part of the reason why blogging platforms,
and many other user-generated content sites are so huge (Facebook, Twitter,
YouTube, etc. etc.).

Yeah, people could just stick with what they know if they don't want to code
-- but then there would still be huge barriers between having an idea that you
want to create and get out there, and actually having the ability to make it
real.

For example, this Webflow Interactions site was entirely created by someone
who isn't a coder (I know, I work with him). How long would it have taken him
to learn all of the code he would have needed to know to create it all from
scratch? Or how much would he have needed to pay a developer to build it for
him? And how long would that back and forth taken to get it all right?

For a lot of people, those types barriers are insurmountable (they don't have
the time/skill to learn themselves, or the money to pay someone else). So
should their ideas just not ever have the chance to see the light of day?

If everyone who ever had a great idea could code it themselves that would be
awesome. I just don't think it's feasible -- and tools like Webflow can bring
a lot more people a lot closer.

~~~
evo_9
Nah man, you are contributing to the problem. Less training wheels, the world
is a better place without them.

Drink your kool aid all you want, coding will never be replaced by a solution
like this. It will simply allow someone to get closer to what they want before
they grow frustrated by unforeseen limitations they will eventually run into;
then they need to hire a real coder to fix everything, and likely replace it
all, costing them more money and worse lost time.

~~~
andcase
"Nah man, you are contributing to the problem. Less training wheels, the world
is a better place without them."

Tell that to all the Wordpress based projects out there or Dev Frameworks.

Some users just need an outlet to express fairly static data in engaging ways
and don't need the overhead of learning a CRUD/REST stack in their way.

There will always be a need for experts who know who computer science actually
works but harder things will continue to be further simplified.

