I absolutely agree with this. Spot on.

I think that in order for the industry to make a seismic shift to other tools, like the great migration from Photoshop to Sketch, we need a design tool that fundamentally rethinks how we design, and until that happens, everything will be an alsoran of Sketch.

That, or there needs to be a fundamental design problem that Sketch doesn't solve that's really important in order to force migration, like how Retina devices forced people off of Photoshop and into vector based programs.

I always kind of chuckle when I see UI gifs and heavily animated prototypes. I'm sitting here thinking - good luck finding a dev who can do that, and good luck making that turnkey enough that it'll be approved in a real-world business setting. There's a reason nearly all of your apps don't look like any of these prototypes you see nowadays.

Lottie is a great tool and I'm starting to see it peppered in here and there, but mostly in loaders and onboarding views. I did notice this tool has a panel for exporting swift code, which is cool and I'm interested to check that out.

I think what really needs to happen is Apple needs to buy Invision and then integrate this tool right into Xcode - then we'd have something to talk about.

I think that Framer is actually going to go in the direction that you want. What I think is going to happen over the next year or so with Framer is that they're going to still keep the code portion in place, but add more UI elements in the design tab of the tool that will let users implement interactions. If users want to modify the interactions beyond what's offered in the design tab, they can switch over to the code tab.

Seriously, how many Sketch clones do we have now?

Symbols != Components. Symbol overrides != States.

Why is the idea of having a hover state or scrollable sections so outlandish?

Completely agree. Overrides are a poor man's states. Also, there are a few different components that have predictable logic, such as input fields, so why not build a simple way to toggle between state based on that logic? I think it's crazy that most of the prototyping tools still don't accept text input .

Hey Tom —

What we need is a tool that creates living components.

YES. I 100% agree with your vision of the "next generation" of design tool, and that while impressive and certainly improving designers' lives iteratively, the Figma-InVision arms race doesn't address our most fundamental pain: that "design" pixels and "app" pixels aren't connected. "Export code" isn't good enough, and "developer hand-off" is the PROBLEM, not a feature.

Have you seen Haiku? I'm on the team, and have dedicated the last several years of my life to solving exactly this problem.

Here's an example of a simple interactive component one of my teammates made visually with Haiku, with only a sprinkling of code https://codepen.io/taylorpoe/pen/oGJeba

If you're interested in an invite, I'd be happy to send you one if you sign up for our beta and shoot me an email at zack@haiku.ai

Playing with Webflow is like this. I wish it pluggin into backend more and was worked on as a design tool at this lvl. (plus mobile)

Check out Fractal

https://fractal.build/

Found this to be a step towards that - a living pattern library you can set to interpret component-based CSS with a little Gulp config. You can then expose the components via an API.

This is us :)

https://www.animaapp.com

While with Launchpad you can create a short film, it is a first step towards empowering designers to create a complete fully featured film.

I think you’re looking for Flinto.

What we need is a tool that creates living components. Just let me create components and let them have multiple states based on click-, hover- and scoll-events. Then, let me build a view consisting of those components.

Flinto does exactly this.

I don't know. What's the solution here, you think? Creating a tool that lets you output fully functional frontend logic without the need to code? If, in theory, that would be possible, it would still be only frontend, without backend. And create a tool that lets you do both? Probably not possible. And even if possible, every design/client/solution probably needs a different technological base (e.g. one use C#, the others use Node.js) so connecting that to the design in a single tool would be probably impossible too.

So this leads us back to the possibility of a tool, that would let us to create fully responsive (real) frontend part of the app/website. But again, it would not be functional: no data would be transferred from the databases, no real login, no nothing. So if you think about it, you would still just have components and theirs states with animations. And this is pretty close to what we have now.

Isn't it?

Subform is a tool that's a WIP that address your needs.

Not release yet, but their philosophy addresses your issues:

https://subformapp.com/

1000% agree

Tom, http://atomic.io.

Seriously. Get into it. Does what you want.

I totally and completely echo this sentiment, but I think we're back at square one if we need to create custom tools that mimic what it means to just sit down and build the components yourself just because designers won't code. It's completely absurd. HTML, CSS, React, Swift, XCode are all really really well thought out ways of building things, why the fuck should one company or any company for that matter over-invest in creating this made-up fairly-tale simple tool / language which basically mimics the actual way of building and translating design into implementation when the step to actually building it is so incredibly small? Framer is just Coffeescript which is syntactical sugar on top of JavaScript. I hope for the love of god no one attempts to do this because it further helps design to stay away from actual implementation, and I would even go so far to say that it helps dumb-down our roles as designers.

I agree. I think the future exists out of components. With symbols we're slowly getting there. Think about it. You design something with symbols. And with the click of a button you can export React Components. In reality this is alot more difficult of course. But it sounds good.

Designers should code, but won't

This is very true. I have been experimenting with Bubble.is, where I can focus on programming instead of writing code – there is a big difference. With Bubble, you can actually create a living project that uses real data, repeating components, component styles and pretty advanced logic without writing any code. It's quite impressive and has been fundamental for us to build high fidelity prototypes that communicate our intent to testers and developers.

Kind of like Framer, but way simpler. Designers should code, but won't.

This is a fun one for me. Because it's kind of true.

More designers than ever are learning programming and are able to solve most of the problems you describe through it. Code is just such a powerful tool.

But a lot more are waiting for some new innovation so they don't have to learn an intimidating new skill and still will be able to do everything you describe. I hope that invention will come – and we will certainly try to build it – but I'm not sure if it will (in time).

So we'll continue to try and innovate here, while we not so secretly try to teach every designer how to code too. That's going quite well, and very fulfilling to see work.

High5!

Well this looks promising. Looking forward to hearing more details down the road!

This made my day :) Looking forward to give it a try!

Please, showcase your product better. Fix your website

The world doesn't need scroll jacking anymore. My browser was so sluggish that I just wanted to close the tab and immediately give this feedback.

I was quite impressed with the video for the Studio. More than that product, I was genuinely interested in the ecosystem you guys have made. But the website just turned all my interest off immediately. It just felt like a Dribbble trend painstakingly engineered to give your visitors a bad experience.

More than that, I was genuinely feeling lost. What is part of screenshot/what is part of a website, what are the call to actions and what are those numbers that come in the middle and why are they needed?

I don't want to give your new competitor(Sketch) as an example for how to showcase your product, but I couldn't resist. Looking at their (new) site, I feel I could trust them because somehow the site comes off as transparent and open. Same way how I felt about the product 3 years ago. It's so simple that the design itself doesn't ask for too much attention compared to the product.

I know there are designers/product people/engineers who put heart and soul into this site and product and want to see the best launch, and my only feedback here is that there is still some more time to make the best out of this launch!

Any word on pricing? Is it included with a regular subscription? I would love you forever if it was buy to own. Even if it cost $500usd.

This is exciting.

Any chance that this tool will support Dynamic Buttons? Ability to change the text inside the button and it will automatically resize?

Congrats! Thanks so much for listening to the community and putting all the effort to launch awesome tools.

Somehow this caught me by surprise but can't say I wasn't expecting InVision to take over and hopefully Studio meets our high expectations (:

HYPED

No love for the southeast US? Orlando? Atlanta? Miami? Design companies don't seem realize we have three large art colleges in the area (SCAD, Ringling, Miami International University of Art & Design), and all have illustration / prototyping classwork. And the tech scene is hopping in the Tampa Bay area. We have MalwareBytes, Microsoft, Brave People, etc.

Stephen consider taking a trip to paradise?

Hi Stephen, where can we signup/learn more about the live events (im in nyc) ?

This is just another Sketch clone. It doesn't bring any new value to our workflow. There is a nice good comment in the first post, that is what we need. Not this. Sorry.

This is very exciting!

Would be keen to attend a live event and surprised you listed NY, SF, Seattle, Boston, Berlin, Amsterdam. And not London???

Wondering if because of Brexit?! :)

Ok, seriously, why not inlcude London?

Hey Stephen, a few quick questions. Support cmd+arrows to resize objects? A setting to only select layers that are entirely within the bounds of the selection rectangle? ESC to unselect everything (Sketch on ESC selects the artboard an this drives me crazy)? Copy and paste styles?

I've always said that a Sketch + Webflow marriage would be tremendous. I use Webflow sometimes to do quick mockups, and I'll even modify the code output and use it in production. Once they get a little more advanced and add things like pseudo elements/classes, only export the required CSS/JS, and maybe even handle as much of the animations they can in CSS only, it will be a major game changer.

Test Comment

I suppose that Sketch import will be included, since the existing tool already has the ability to inspect Sketch files

I think the 'web based' thing 'ala figma' and collaborative design are kinda the same thing....aren't they?.....

Why do you think so? I'm quite sure it's the opposite.

That's constructive

"Jack of all trades, master of none, though oftentimes better than master of one."

Should painters build their own easels?

Should drivers build their own cars?

I think you are dismissing valid and constructive feedback that can hardly be construed as "hate".

Yes InVision made something cool a while ago, that doesn't make every decision they make a good one from that point on.

I'll see you there Josiah- will be boots on the ground for that one. Come find me and say 'hi'. :)

Aubrey- keyboard shortcuts have been a BIG topic of conversation with the 'v' key being one of the most controversial. I think you're going to like where we ended up with that solution. :)

January 2018 is the earliest at this point for general consumption and usage. We're using it internally today and its been a joy to use. I know its hard to wait (believe me I know!!!) but hang tight- making sure this thing is as dialed in as possible before we release it into your capable hands.

Adobe is on the brink of an AI revolution with creative tooling yet we’re fussing over drawing squares — https://twitter.com/Adobe/status/920714900401373185 — machine learning and automated processes are the future for both accessibility and creating a computing assistant for design. Not pixel pushing.

What I mean by this is designing at the speed of thought is the ultimate goal no matter what input method we're using.

Let's do the math. He said 40+ worked on this tool. I'll round it to 50 people. Since it's a complex one I'll say the guys have been paid on average 10k / month. He also said they worked on it for 2 years, so that's 24 months. I'll ignore the other costs but we can safely double the total to cover it.

This means 240k x 50 which is $12M. So probably Invision probably spent around this amount up to date to build the tool. But most of the costs are pending - marketing, maintenance, feature parity with the other tools, bug fixing, etc.

Considering Sketch's maturity and adoption, I wouldn't be surprised if they offered 10 times more - probably 100-200M.

Doubt it - Sketch know their domain, and they'll push it. Invision are trying to master absolutely everything digital product design as said in the comments here. House of cards effect.

Maybe. It still isn't a proven tool. I have to think InVision might have been shitting their pants a little after 2 years of not releasing motion and surviving on what is predominantly a glorified image mapping tool while other tools are integrating the same features and cutting out the need for, what IMO, was an overpriced service to begin with.

That said I am excited to try it. On one hand it's well timed with the Adobe activity. Also gives other tools lead time to release what they have been cooking up.

I'm not sure I follow your logic there, these companies are not our friends helping us out. These are for profit companies who charge for their products and services and we owe them nothing. If the products they make are sub-par, we should ask for better. If a product you or I or any of the other people with an opinion here are shitty, then we deserve the criticism and if they are good, we deserve the praise. There's no such thing as a good product that is unjustly criticised - if people don't get it or use it in all the wrong ways, then whomever designed it did a piss poor job and the product is not that great. I'd understand if that product was free, someone's attempt to be a nice guy/girl and help out the community. But that is clearly not the case here.

Guess lot of people have been frustrated by Invision, they just didnt have the opportunity vent it out until now.

Chicago! Indy! Columbus! Grand Rapids!

Hey William- yep Sketch import is included. We're laser focused on making this tight, powerful, and easy to pickup. Looking forward to having you kick the tires!

It does https://twitter.com/InVisionApp/status/920640277315911681

UX Pin sort of does that. The animation builder is not as powerful as the one in Axure, but the closest. It's also web-based (Figma has been lying, making everybody believe they've created the very first cloud-based prototyping tool). The problem with UX pin used to be the poor management of components and overrides, and the performance not as good as Figma, but that was some time ago.

Web technology (unfortunately). Hopefully, it will perform well :)

Full desktop applications win everytime !

Especially with the “advanced animation” component. (Which Figma doesnt have) They’ll have better access to system resources.

3:45 in the video seems like just an intro from the CEO?

Edit: looks like the Sensei demo starts around 2:09:00

It certainly looks amazing. The trade-off is locking you into their ecosystem which maybe doesn't sound that dangerous at the moment but it's going to become even more relevant on the long term.

Extensibility is a big deal and a core component as it relates to Studio with much more to come on that front.

Prototyping is available for all document types not just mobile. :)

Think they would have said if it did seen as its months of dev work to do that

Sketch import is available.

running 8 fps on 2017 macbook pro.. It would be nice to test it on safari as well :)

Hey Timo- we have a followup announcement planned for design system details later on. This is a much bigger topic than could be covered in todays announcement. We plan on giving this its own separate thread of discussion, love, and exposure in not too long. Stay tuned!

Hey James- to think of this as Macaw v2.0 probably isn't the most accurate description since intents and key values (web design tool vs screen design tool) are slightly different between the two. That said in many ways I suppose one could consider this the 'spiritual successor' given that the same team (plus many others) is behind it and the tools do share several key 'DNA' pieces. Hope that helps. :)

Hey Maiken- files are saved locally and you can use Studio without any internet connection at all, as its natively installed. :)