User experience professionals use Clickframes to rapidly spec and prototype the interactivity of their designs, and to communicate the design to collaborators as well as project stakeholders. When the design has been refined, Clickframes facilitates communication with the developers who will implement the application.
You’ve heard of self-documenting code – Clickframes provides self-coding documentation. From a Clickframes XML spec, software developers can generate fully-functional, enterprise-class MVC code that’s easy to evolve as the project proceeds, and eliminates a lot of the tedious coding usually needed to get the app running and to provide minor changes in functionality.
With a Clickframes XML spec in hand, QA professionals can generate and customize automated test scripts to start the QA process as soon as development begins – and remain in sync with design changes as they occur.
Enhanced collaboration and communication between designers, developers, and testers saves time and money. Design issues get surfaced up front, meaning fewer change requests down the line. The Clickframes requirements model supports reliable estimates and helps minimize unpleasant surprises. And as a project advances, Clickframes makes it easy to integrate changes whenever necessary.
The video from the Clickframes talk at Ignite Boston 6 is now online. The Quicktime Video is here. Warning, big!
September 17, 2009: Faster than lightning, CLIPr lets you upload an appspec and preview the CLIPs without having to download or install anything locally.
We’ve proposed a Clickframes talk for Interaction10 in Savannah, Georgia, February 4-7. Please post your comments and help us get accepted!
The Beacon16 gang will be serving a Clickframes “side dish” at the next Web Innovators Group bash: Tuesday, September 29, 2009, 6:30 pm, at the Royal Sonesta Cambridge. It’s free, but RSVP is required. See you there!
See Will Crawford’s 5-minute Clickframes talk at Ignite Boston 6 on Thursday, September 17, hosted by O’Reilly Media and Fidelity Investments.
Nicole Zanetti will present “The Single Source of Truth: Quality Assurance Can Keep Up in an Agile Environment” at Expo:QA 2009 in Madrid. The conference is being held October 27-29.
July 1, 2009: Clickframes Preview Release 1 is ready! See the download section to get your hands on it.
The heart of the Clickframes framework is truth.xml, which is the blueprint of the application. Code and artifacts are generated directly from this file by using a variety of provided plug-ins, then further customized by the developers and testers to produce the final application.
The truth.xml file is written in Clickframes XML, a simple format – not too different from HTML – that describes the core interactivity and functional requirements of a webapp. There’s even an XML cheat sheet (PDF) to help you start out.
Clickframes Interactive Previews, or CLIPs, let you interactively explore your application’s design. You can see all the requirements for any page in the application, including links, actions, outcomes, form fields and general facts. If another page is involved, you can just click through to see those requirements as well.
Once an application is modeled in Clickframes XML, it’s easy to create the kinds of artifacts – like software requirements – that you need to satisfy stakeholders and collaborators, without extra effort.
Clickframes keeps your code connected to the design and requirements by generating much of it directly from truth.xml. This also means that developers don’t need to waste time on mundane wiring – they can focus their attention on the challenging, interesting work.
Clickframes is not dependent on any particular implementation technology. Out of the box, you get two different Java code generators (Seam and Spring Web Flow), plus a PHP code generator, and we look forward to working with our open-source community to provide support for even more languages.
Run a preview of your application with real code underneath to demo or test its interactivity in a browser.
Clickframes will generate automated Selenium Tests that allow tests to proceed in tandem with development. (Coming soon!)
Clickframes code generators structure and modularize your code so that it can be safely regenerated throughout the development process, even after it’s been customized.
Clickframes works well in an Agile framework because it’s built around the idea of rapid iterations. In our Clickframes Project Lifecycle, we describe a slightly different kind of iteration than some teams practice, since our approach to software development is pretty heavy on user research and iterative design work. If you want to start from use cases and user stories, Clickframes supports that, too. Just iterate your truth.xml as desired and run the code and test generation plugins as often as you want.
Clickframes was originally developed in 2008 by the Informatics Solutions Group at Children’s Hospital Boston. The first “Clickframes” came about when we decided to automate generation of HTML wireframes (now Clickframes Interactive Previews), and to reduce the time and effort required to manage requirements for a particularly demanding customer. At a certain point, we realized that we didn’t have wireframes anymore – we had a computable requirements model. Some refactoring and development later, the result was Clickframes – a suite focused on the complete lifecycle of a web application, from modeling and design to code generation and development to testing and release.