Latest Ext JS 7.8 is now available. Learn more

Introducing Sencha Architect 2: A Massive Upgrade of Ext Designer

April 17, 2012 828 Views
Sencha Architect 2.0 builds on our innovation in Ext Designer. Now, you can build Touch and Ext JS apps through drag and drop. Available for Mac, Windows, and Linux. Download Sencha Architect 2

When we started working on the next release of Ext Designer, we had very ambitious goals: we wanted to build a great visual tool to help you build web applications faster that didn’t get in the way. We wanted to make the development process more inclusive by lowering the barrier to collaborate, allowing UX designers to work effectively in the same environment that you use.

We wanted you to be able to create complete applications — not just the UI. We wanted a tool that would let you build an application quickly out of standard components, but also allow you to easily customize those components with your own code, right from within the tool. This is all part of Ext JS which we think is the best javascript framework.

What we created is no longer just a rapid interface designer, but a complete application builder, a place where the architecture *and* the interface of an application can be created and properly structured for development.

For this reason, the name “Designer” no longer accurately captured what the product enabled: it’s now much, much more than a simple UI designer. And so, it is our pleasure to introduce the all-new Sencha Architect 2.

Sencha Architect 2: What’s Changed, What’s New

A tool that works the way you do.

Click to watch our launch video

The foundational concept behind Architect 2 is simple: a visual app building tool that creates code as clean and well structured as the code that a Lead Architect at Sencha would write by hand. Architect 2 is visual where it makes sense, but also gets out of your way when you need to dive into code.

This philosophy led to the creation of a tool that lets you iterate solutions with very low overhead and with instant visual feedback; all assisted by inline documentation and quick links to the API reference.

But the best part is that it’s a tool where experimentation is safe. All code generated by Architect is guaranteed to work out of the box. You can’t arrange components in a way that will break the frameworks’ conventions. There’s also a wealth of new features that makes the experience of creating apps a lot more enjoyable and immediate.

The hub of all activity: the Project Inspector

Sencha Architect project inspector

The Project Inspector has been greatly enhanced to show views, controllers, models, and stores all in one place, along with information about the project’s structure. All components and their relationships are right there, where you can see and analyze them.

Framework Support & Creation Tools

Architect can create applications for Ext JS 4 and Sencha Touch 2. The Toolbox has been improved dramatically to make the richness of both frameworks more accessible. Categories now make searching for a component quicker, and it’s possible to create new groups of components for your personal workflow.

Architect also includes a built-in JavaScript editor, so you can work on your code without switching back and forth between different tools, although it’s still easy to switch between Architect and your favorite IDE.

In-line Documentation

Now every component, property and configuration comes with handy inline documentation, and if you need more, there are quick links to go deep into the API reference. The documentation is available as a part of the main UI, and appears as tool-tips and hovers as you need it.

Source Control-Friendly File Format

Architect 2 projects are easier to manage and track via source control. The single file archive we had in Ext Designer 1 has been replaced by a file for each view, model, and store. This decision was intended to make it easier to work on a project where more than a single developer is involved.

Native Mobile Packaging & iOS Simulation

You can now package applications for iOS and Android directly from Architect 2. Using technology we released with Sencha Touch 2, Architect lets you take a finished application and get it ready for deployment on a mobile device quickly and easily. And if you’re on OS X and you have Xcode 4 installed, Architect starts the iOS simulator for you and loads your application automatically.

Click to explore the user interface of Sencha Architect 2

A Better UX to Make Development Fun

Several weeks ago, we asked for volunteers to help user-test our beta version. Thanks to their help and our extensive set of usability studies, we were able to zero in on the biggest user experience issues and to design better solutions for commonly performed tasks.

Here are just a few of the user experience improvements we made. We added a highlight for new components that are added to the Project Inspector: this helps you see where the component is added in the hierarchy. We added a toggle to the property panel that lets you switch between commonly used configurations vs. the comprehensive set. We also enhanced our component icons to improve readability. These were just a few of a long list of detail improvements.

Countless hours went into making Architect 2 a beautiful and easy to use application. User experience is never complete but we know you will notice right away how our new process has made the tool as easy to use as it is powerful.

We couldn’t have done it without you…

On top of our formal user studies, we want to say thank you to our community for helping and guiding us with their constant feedback: first with the private beta program for SenchaCon 2011 attendees (it rocked to meet you in person in Austin!) to the later open beta. Your suggestions and questions helped make Architect 2 what it is today.

We also want to thank you for your patience and your incredibly insightful comments, and we ask you to keep it up: Architect 2 will be evolving over the course of 2012 and we need your continued support and feedback to make all the things we have dreamed during the last months a reality.

Keep asking for new features, keep reporting bugs, keep showing us your examples.

Sencha Architect team members; (left to right) Aaron Conran, Luca Candela, David Foelber, Katherine Chu

Getting Started with Sencha Architect 2

This version of Architect ships with a significant number of examples for Ext JS 4 and Sencha Touch 2 alike. We have re-created a few of the frameworks’ demos in Architect 2 including GeoCongress and the Feed Reader, and it’s all available from Architect’s product page (close to the bottom). Just unzip it and open the .xda files to see great examples of entire applications.

The online documentation is also a significant step forward. All our technical docs are now hosted online, just like the API docs, which makes them easier to search and easier to keep updated. While the docs are already much better, we are committed to improve them and expand them significantly over time. Please let us know where you find the current documentation lacking or unclear, and we will concentrate our efforts where it’s most useful.

We also want to let you know that, if you have an example you are particularly proud of, and you want to share it with the community, submit it to the dev team for inclusion with the set that comes with Architect 2: if we like it, we’ll add it to the downloadable package and of course give you credit in the notes. It’s your chance to shine, don’t miss out on it!

Pricing & Availability

Individual copies of Sencha Architect 2 cost $399, with discounts for 5 and 20 packs. If you are upgrading from an old copy of Ext Designer 1, please read the following carefully:

– If you bought Ext Designer 1.0 after January 1st, 2012, you’re already entitled to Sencha Architect 2! Your license will be sent shortly to your email address, but in case it doesn’t after a few days for any reason (typos, spam filters, etc) please contact [email protected] and we will take care of everything for you.
– If you purchased an Ext Designer 1.x license prior to January 1st, 2012, you can upgrade to Architect 2 for $279 in our online store.

Please note that Sencha Complete includes Architect 2, and remains priced at $995. So, go ahead, buy Sencha Architect 2 from the Sencha Store, or download the trial and share your experiences with us!

Recommended Articles

8 Must-Know Tips for Choosing the Right Web Application Framework for Your Project

Starting web application development on a project can feel like a very difficult task. The abundance of frameworks adds to the confusion. It leaves developers…

Web Application Development | Top 10 Frameworks in 2024

If you are a developer, you must know the role of frameworks in creating amazing applications. Web application development frameworks come with pre-built tools to…

Understanding the Difference: When to Use Ext JS Classic vs. Modern Toolkit

Ext JS is a JavaScript framework for building powerful web and mobile applications. The framework features over 140+ high-performance, fully tested, and customizable UI widgets/components.…

Ext JS 7.8 Has Arrived!

The Sencha team is pleased to announce the latest Ext JS version 7.8 release. Following the 7.7 release, which included numerous quality enhancements in Ext…

How to Work with Ext JS Models and Stores: Tutorial on Managing Data and State

Ext JS is a popular JavaScript framework for creating robust enterprise-grade web and mobile applications. The framework offers a rich set of high-performance and fully-tested…

Discover the Top 07 Architecture Patterns used in Modern Enterprise Software Development

Developing software without an architecture pattern may have been an option back then. However, that’s not the case anymore. Modern software development requires apps to…

View More