Mixture offers rapid web prototyping

Rapid prototyping and static site-generation tool Mixture is now in the wild.

According to Neil Kinnish, one of the devs behind the app, said it “brings together many popular development tools, best practices and super-charges your development” when rapid prototyping or creating static sites.

The app has a number of features designers and developers alike will find useful, including: automatic preprocessing handling; automatic minification; powerful HTML templating, allowing includes and layouts; validation; a built-in server that will live reload/style-inject on detecting changes; one-click online publishing; a boilerplate system; a JSON model system that “allows you to architect and work with real data against your projects and templates”; a unique Mixture profile enabling you to showcase your projects and boilerplates; BrowserStack integration with one-click tunnelling; a to-do system; support for non-Mixture projects; and a Chrome plug-in to aid debugging preprocessed styles.

Speaking to .net, Kinnish explained Mixture arrived from the team’s own workflow requirements: “In particular, we wanted a cross-platform tool with a quick and minimal set-up, enabling us to focus on the project. We also wanted one-click publishing for sharing and sign-off, easy multi-device testing and advanced features for design and development.”

Powerful features

Two such features are Mixture’s templating and data models. “The templating was really important,” said Kinnish. “We chose Liquid, which is used by Shopify and is powerful and simple to use. It's essentially HTML with some additional tags and features, although you can of course use straight HTML and we’re adding support for HAML.” On data models, Kinnish told .net they were a key feature: “The ability to prototype and build a project using data makes a big difference to the project, your approach and the outcome.”

On the decision to go for a native app over something primarily web-based, Kinnish explained that “working exclusively in the browser is not always possible or desired, especially when working with so many technologies and practices,” although he added that Mixture does have plenty of online crossover, and the team has “built some pretty big online services around the tool”.

There’s already a good buzz about Mixture, not least from those who’ve had early access. Developer Keir Whitaker enthused to .net about the speed in which you can get to a working prototype when using Mixture, and the manner in which it pushes pages to an online service, so they can be shared. “I’ve played around with loads of other tools for prototyping and wireframing, but I feel that I spend a lot of time in them and would have achieved more in Mixture,” he said. “It has data logic, enables you to reuse chunks of code and it’s designer-friendly. In fact, Mixture’s clearly targeting the designer who’s moved to code rather than just the developer who dabbles in Photoshop.”

For more on Mixture, check out the first screencast on the Mixture YouTube channel: