Where the design community meets.
Founder at Neonto Joined over 8 years ago
I wrote most of the code generation for React Studio, so I'm glad to answer this question :)
It really comes down to three things:
1) React's design is a great match for visual tools. Declarative views, functional state, clearly separated components -- these are all fundamental good design choices by the React team that make it easier for a tool vendor like us to present the same concepts in a visual form.
2) We don't try to do everything. React Studio isn't really a Dreamweaver competitor. If you want to do a static landing page, there are already great tools out there for that. Instead we are focussing on mobile-first single page web apps. That helps a lot in designing the code generator because it's fundamentally component-oriented.
3) We have lots of experience in this already. We started at the "deep end" of app code generation with Neonto's existing product that produces native code for iOS and Android. Compared to the challenges we faced in producing clean Objective-C and Java, working with React has been immensely refreshing :D
Btw there is a free version of the iOS/Android tool on our site at https://neonto.com if you'd like to compare with that... React Studio is of course a different product, but the existing Neonto Studio will give you an idea of where we're starting from.
Finally, about state -- we're currently doing event-based state updates (to avoid getting committed to any particular library too early), but the plan is to replace that with a plug-in system that will basically allow you to decide between Redux, Alt.js (or something else) at any time. This way, state management becomes a separated concern from the visual design and view components. (This kind of design-time liberty in swapping out libraries is one of the big strengths of code generation IMO!)
Hi Andriy, instructions and download link for the plugin should have been sent to you by email after you activate the app. Sorry if the mail went missing!
I sent you a copy by email. If anyone else has trouble, please contact email@example.com and we'll send it to you.
In a way, Facebook’s acquisition of Parse in 2013 seems to have postponed the inevitable. As a startup, Parse was always vulnerable to running out of money. As a division inside Facebook, Parse was always vulnerable to running out of strategic support.
I wrote a longer post about this on Medium:
this post is a guide for Neonto Studio which was recently discussed here on DN: https://www.designernews.co/stories/57610-neonto-makes-your-app-prototype-into-real-code
Based on the great feedback in the DN thread, we've redesigned the UI layout and are working on:
A light color scheme (à la Sketch)
A Sketch plugin for automatically bringing designs into Neonto Studio.
If you're interested in the Sketch plugin and would like to sign up a beta, drop us a line at hello neonto.com! We'd love to develop it based on real projects.
You certainly have a point. Here's a screenshot of Neonto Studio to give others an idea of what we're talking about:
I think we'll try making a light theme and see how that works out.
To go deeper, you don't have to develop a plugin because you also get the generated source code -- you can just expand on that.
The generated code is all standard components: UIViewControllers, UINavigationControllers, UITabControllers, UIPageControls etc... So you can replace the Neonto-generated classes piece by piece with finalized code.
(That's for iOS, but we do the same on Android using the Java equivalents there.)
A native prototype made with Neonto Studio can be like the Ship of Theseus  -- all the components get replaced during production, yet it was fundamentally the same ship at the start :)
Hi Michal, any unsolicited redesign is welcome ;)
There is an element of cost-effectiveness here though. We use the native Mac OS X controls wherever possible: buttons, checkboxes, toolbars, dropdown menus... And since these can't be styled, we're stuck with whatever Apple decides they should look like.
Since Yosemite, the native controls are very white. At the same time, users wanted to have a dark background for design. There's a mismatch here that poses quite a challenge. (If you look at other apps like Zeplin that use native controls, they are very white indeed. Maybe we should try to make a "full bleach" version of Neonto Studio to see how that would look like...)
Big companies like Adobe have their own UI toolkits that reinvent everything in a cross-platform style. A lot of smaller companies use Qt which has great theming support, but I don't think Qt apps ever feel quite right on Mac because all the controls are "faked"... So we went for native controls.
Yes, we have support for web service plugins that can work two ways: both load and send data. So a plugin can fill out a data sheet using real data from the service, and also send data back to the service (in this Photo Diary example, that would be the image and text note).
Right now we don't have many web service plugins available. There's a simple RSS loading example here: http://blog.neonto.com/2015/04/03/neonto-studio-0-8-1-and-an-example-of-live-web-data-loading/
There's also a Tumblr plugin done, and I'm working on a generic REST/JSON plugin.
The code you get from Neonto Studio is not locked down in any way. It's all yours. (There's no binary framework or libraries included either, so everything is right there in editable code.)
Hi everyone, the name of the product is actually Neonto, not Neonate -- I think iOS autocorrect has struck again :)
I'm a founder and developer of this product. Ask me anything!
Also I wrote a blog post yesterday to explain what we're trying to do:
Where the design community meets.
Designer News is a large, global community of people working or interested in design and technology.
Hi Thomas! Which other tools are you referring to?