I’ve been very impressed in playing around with the Artboard.studio web app pre-release. You can request early access on their website.
If you need to create a variety of physical product mockups beyond just computer and mobile ‘devices’, this service is aiming to be your one graphic design compositing tool for applying custom designs to everything from clothing, to retail packages and of course computers and smartphone app mockups too.
I’ve been intrigued by the potential endgame of a single environment that could satisfy the needs and modes of operation for both visual UI designers and developers. Convergence of tools has been a theme of my “Looking Ahead” new year blog entries for 2017 and 2018.
Typical UI Design tools still offer an excellent working model for quickly manifesting design ideas at any level of fidelity. Many of us know of situations where a well-executed mockup that took 30 minutes to render in a design tool (drawing pictures of screens) might get a dev estimate of many hours or days to execute (QA’d production code).
As long as that dynamic exists, many designers will continue to prefer WYSIWYG drawing tool interfaces over working directly in code – especially when they are early in the ideation process.
Popular tools like Figma, Sketch and AdobeXD continue to make moves toward exporting out to React and potentially other libraries. However, as of now, these are one-way, and the real deal will be bi-directional or zero-conversion options.
Here’s a roundup of new tools looking to shorten or even eliminate the distance between drawings of screens and production-ready code (in alphabetical order).
Alva – “Alva lets you design interactive products based on components engineered by your developers. And guess what – we are entirely open source.”
Haiku – “Design components that snap into any codebase: Unlock your creativity with the world’s most expressive UI builder”
Interplay – Fast prototyping that combines the power of design systems, production code components and live collaboration.”
Iterative.ly – “Iterate on top of your live app using your design system. Launch an experiment in under 10 minutes. Continuously improve your product.”
Modulz – “The visual code editor for designing and building digital products—without writing code.”
Supernova – “Design and development tool unlike anything you’ve experienced. #nomoresnippets – always a production-ready code.”
Thanks to fellow designer Mike Scopino for including me in Nonfiction’s recent blog article “Expert Perspectives – Let’s Talk: Live Style Guides“.
Guests included Josh Briley, Vanessa DeCollibus and myself.
JAMES YOUNG: You’re not just adopting something to check a box but you’re actually building a system that works day to day for your team. You can capture what you’ve done in the past, and try to forecast the types of things you might need in the future. But expect it always to lag behind the innovations your team is making, and make it flexible enough to capture those. It’s a big job, so allocate support to develop it and maintain it. Also, try to do a good job of communicating what this resource can and can’t do. It’s not a magic UI machine. You’re still going to have to go through the really hard work of translating it into an actual product.
Read the whole thing over at Nonfiction.io.