Announcing Sencha Designer 2 Beta

### Sencha Designer 2 Now Supports Sencha Touch

Designer 2 beta

Sencha Designer 2 Beta features support for Sencha Touch and Ext JS JavaScript frameworks.
Download Sencha Designer 2 beta today

We’re thrilled to announce that Sencha Designer 2 Beta is available for download! Designer 2 makes it easier than ever to build desktop and mobile applications using Ext JS and Sencha Touch.

We’ve been working hard to bring you the next generation of Designer that will help you quickly build Ext JS and Sencha Touch applications. Experienced users will enjoy the productivity gains of the visual development environment, while folks new to Sencha will have a much easier time learning how to work with our frameworks and quickly build a complete application.

Ext JS and Sencha Touch are incredibly rich: they provide UI components, charting, controllers, models and data stores. In Designer 2, we make all of these features easily accessible and neatly organized to make it easier to discover all their capabilities.

### From Ext Designer 1 to Sencha Designer 2

Designer 1.0 was the first step in tooling for Sencha frameworks. Designer 1 was a visual UI builder that made it easy to scaffold and design the UIs for your applications. You used it in conjunction with another code editing tool in order to build Ext JS 3 apps.

In Designer 1.2, we adding the ability to target multiple frameworks and also added support for Ext JS 4. You could continue to build views and stores utilizing all of the new widgets available in the new framework, like charts, enhanced stores, and more.

While you told us that you loved the features of Designer 1.x, we kept hearing that you wanted Designer to do more to help you build fully functional applications in a collaborative way.

### Designer 2: Easier, Faster, Stronger

When started planning Designer 2, we wanted to improve every aspect of the tool. To achieve this goal, we adopted the mantra “Easier, Faster, Stronger.”

* **Easier** because we believed that the learning curve of building Sencha apps could be shortened. In Designer 2, all components come with handy in-line documentation, and there are quick links to go deep into the API reference. More fundamentally, developers can try things quickly and get instant feedback. The Designer canvas is a live view giving you immediate feedback. Learning the dozens of components in Touch or Ext JS is now a breeze.

* **Faster** because traditionally, web based development proceeded like this: write some code, refresh the browser, check the changes. Over and over again. While better web debugging tools have come a long way, debugging and error checking is still a tedious and sometimes unpredictable process.

Designer 2 is different: all code generated by the tool is guaranteed to work out of the box. You can’t arrange components in a way that will break the frameworks’ conventions. Every property or event of every component is available in Designer, removing guesswork and eliminating digging through the API docs.

Moreover, the Project Inspector has been greatly enhanced. It’s the heart of your project, and it shows your views, controllers, models, and stores all in one place, along with information about the project’s structure. All components and their relationships are there where you can see and analyze them.

If you need to jump into a project somebody else started, the Designer Project Inspector makes it easy. At one glance, you can see the entire project and understand how the application is built without thumbing through pages of code.

* **Stronger** because Designer 2 helps you create well-structured applications from day one, and ensures that generated code follows best practices. Most (if not all) of the boilerplate code is generated for you, so you can focus on the code that really matters: the controller logic that’s at the core of your unique application.

### What’s new in Designer 2?

Designer 2 represents a significant leap ahead in functionality, and here is a brief list of what’s new and what changed since the previous version:

#### Support for Sencha Touch 2

This feature has consistently been the top request from our community, and now it’s here! Sencha Touch 2 is now a first-class citizen of Designer. Visual development of mobile web applications is now a reality. This beta includes the [PR4 release of Sencha Touch 2](

#### Code editor

Designer now includes a built-in editor so you can add your own code any time you want. You can toggle between the design view, which gives you access to Designer visual controls, and code view, where you write your JavaScript. The files are saved to .js files on the file system, so you can use your editor of choice, or the built-in editor in Designer.

#### New Toolbox

The component Toolbox has been expanded and improved: it now includes all the components you need to create a fully functional application like Controllers, Models and even a brand new store that connects to We also worked to make the vast array of components more manageable by adding base categories. This allows you to narrow down the selection quickly, and create your own to fit your personal workflow.

MVC in the Project Inspector

#### New Project Inspector

The Project Inspector shows the entire application at a glance. The root Application node contains your launch function, while the Controller, View, Store and Model nodes help you keep things organized as you’re building an MVC application.

####Event Bindings

There’s a new panel that displays all the Event Bindings available for a component, and you can use this to bring your UI to life. And when your application grows in scope, you can stay organized by moving your event bindings into a controller.

#### Source control friendly file format

Developers share code using source control, but developers using Designer 1 had a hard time doing that because of the monolithic nature of our project files. Designer 2 projects are better: gone is the single file archive (you still can package them that way for easy sharing via email). Now, each view, model, store is its own file. Designer 2 makes it easier to work in a project team.

#### In-line documentation

In Designer 2 every component, property and configuration comes with handy in-line documentation, and if you need more there are quick links to go deep in to the API reference.

### Caveats for the Beta Release!

We’re excited to share with you our first beta of Designer 2. While we’re excited to see our community give it a whirl, it is still a beta, and there’s still some work left to do. In the following weeks the team will concentrate on two things:

* Further quality improvements of the existing feature set
* Improvements in the user experience and the UI design

Certain features that were not quite ready for the beta have been disabled — don’t worry they’ll be back soon. As of today’s beta, the most notable absence is packaging for mobile devices.

The coming weeks are going to be fundamental to make Designer 2 the application you’ve been waiting for, so we need your feedback. We will be running usability tests to make sure we catch bugs on our own before the official release, but if you find something that doesn’t work as you expected, or think you have an idea that would make the application better, go ahead and let us know. All feedback will be evaluated carefully.

If you’re local to the San Francisco Bay Area, and are interested in **participating in the usability testing** that we’re doing, we’d love to hear from you. [Click here to apply for the usability test](

Since the application is going to improve and change significantly before release, the Designer documentation for beta is very basic. We are releasing an introductory article to get you started, and more material will become available as Designer takes its final shape.

We don’t recommend that you adopt the beta of Designer 2 yet in your production environment. Designer 2 has an auto-update feature, so as we make updates, we’ll be pushing changes directly to the application, and you can choose to accept or decline the updates.

**To share your ideas**, comments and critiques with us, please use the [Sencha Designer 2 forum](

**To report bugs**, please use the [Designer 2 Bug Forum](

###Promotions, pricing and availability

We are updating pricing for the product at the launch date: individual copies of Designer will be $399, with discounts for 5 and 20 packs.

Special offer: buy an Ext Designer 1.x License today and take advantage of promotional pricing of $279. Plus, you’ll receive a free upgrade to Designer 2.x License when released. Hurry, this offer ends on March 31, 2012.

Upgrading: if you bought Ext Designer 1.0 after January 1st, 2012, you’re entitled to a free upgrade to Sencha Designer when it ships! In order to get your upgrade license please contact the email address []( 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 Designer 2 for $199 from now until March 31, 2012. To take advantage of this offer please email us at []( Note that after March 31, 2012, the upgrade price increases to $279.

Please note that Sencha Complete which will include Designer 2, will remain priced at $999.

So, go ahead, [download the Designer 2 beta trial]( or [purchase Ext Designer 1]( from the Sencha Store, and share your experiences with us!


  1. Aaron Conran says

    @seasharp, LoreZyra – We’ve been working on a new look and feel that will be coming in a beta in the near future.

    @hamilton quant – Our blog software picked up your comment as spam and it was pending moderation. You actually had 4-5 comments and I let the last 2 which seemed the most relevant and had all of your points through.

    @all Thanks for the feedback.

  2. says

    We use extjs mostly with anchor layout since our forms have complicated desktop like design sometimes with more then 100 controls on the single form, and none of the other layouts isn’t right for us. And we also do not want to add more layout containers since the performance is critical feature for us. So in other for the designer to be really useful for us we need two things:
    1. Is there going to be multiselection for controls in designer? I wan’t to be able to select multiple controls and delete them or drag them to another location. Also the project inspector does not have multiselection option.
    2. Is there going to be support for keyboard positioning of control when in absolute layout? (when control is selected in designer and container has the absolute layout I want to be able to move the control around with keyboard arrows) And generally please work on keyboard support for the designer, for instance the control can’t be deleted with delete key from the designer!

    I really want to congratulate on the job well done. But there is still a lot of work to be done to even come close to real rapid development environment like visual studio, eclipse or netbeans…

  3. says

    This is a major improvement over version 1.x.

    I will certainly upgrade my license.

    Also, very nice to see support for mobile.

    Congratulations on your good work!

  4. Jihan van de Merwe says

    What about if you already have Sencha Complete? I just paid 495 usd for extending it. Now I have to pay another 199 usd? And if I don’t upgrade, does it mean that I have a version of Ext Designer that comes to a stand still? Sencha seems to be very tough on loyal customers.

  5. seasharp2http:// says

    Just had a play. The ribbon/tool bar buttons are too washed out and appear disabled, I was quite surprised when I found they were clickable. Why is the design/code view toggle buried in a cryptically named classic menu? The welcome experience is poor. I recall having to twice indicate I wanted to access the trial, then having chosen the project type the welcome dialog window disappeared to be replaced a moment later by the full designer window.

  6. says

    First impression: KICK AZZ!!!
    1) Nice redesign. Looks more intuitive than before.
    2) Far more robust in terms of proper code creation.
    3) Makes it even easier to focus on the business logic and experience flows.

    First disappointment: Crashes upon “Save As” on both Windows (XP) and Linux… Damn “undefined” error.

  7. X Flex says

    There is life after Flex…finally a viable HTML/JS solution for enterprise developers. Now I can rid myself of jQuery…

  8. Michael Mullany says

    Jihan. If you are on Sencha Complete, you get Sencha Designer included as part of your Sencha Complete subscription.

  9. says

    Good work.

    I had some comments on the UI. I know it is beta and it might get improved by the final release. The pop up windows’ style is not consistent with the rest of the UI and they look alien to the rest. The pop ups look (e.g. Settings) like extjs-ish.

    Since it is a designers tools for GUI design, It would nice for the sencha designer to reflect that design spirit. Other than that the tool is very nice, and I am sure the final product will be very useful for gui designers and developers. Keep up the good work.

  10. Aaron Conran says

    @aw3s0m0, Thanks for the feedback. We appreciate it.

    1) Multiselection of controls is something that we do not have at the moment but may come in future versions.
    2) Expect a significant re-work of the keyboard navigation in the near future. Deleting a component is done with Shift + Delete and should work reliably.

  11. Ozum Eldogan says

    I appreciate your great work, and I wanted to buy it even if I handcraft my code. However, upgrade price is too high. It is not encouraging old customers who purchased previous version. Your “promotional” upgrade price is equal to regular upgrade price of well known photo editing software which has 700 USD retail price.

    My intention is not to be offensive. I know you work hard to publish software with great quality. I just want to show point of view for some (or just one) customer(s).

  12. PranKe01 says

    Is there support for Sencha Charts in the Sencha Designer? I installed the beta, but could not find any charts in the Sencha Touch project.
    If not, will there be support for it in the future?

  13. Michael Mullany says

    @johan. That is a confirmation. Designer 2 is free if you have a currently active Sencha Complete support subscription. This is one of the benefits of buying (& renewing!) Sencha Complete.

  14. David MacLean says

    I spent some time learning the compass/sass thing.
    Figured we were encouraged to do so. Got myself a style I like.
    But the designer cannot use it. Dunno how to become productive again unless I go back to the standard style or add miles to the project.

    Me too on the pricing. By the end of the day I’ll have spent more than I ever did on say Borland Delpi Pro, which had a designer/code builder/help/editor that makes extjs look like a cheap toy. And the cost of learning to use it has been many times higher.

    Looking forward to a stable release that I can use for many years to come. Cheers.

  15. Aaron Conran says

    @David – You can certainly use compass/sass alongside the designer and your own custom theme by applying it when you deploy your application. That being said, you are correct in that you cannot link it in at design time and see it applied live. That is a future feature we’d like to have.

  16. Chris says


    In “Get Started with Designer 2.0” guide – ‘Component Layout, Step 2’ referrs to a “Grid Panel” I just can’t seem to find. Any idea what I may be doing wrong?

  17. Samuel says

    hi new to sencha touch, i am an undergrad and i love the writeup on the designer 2. but can’t seem to download a trial version. can any body help

  18. says

    Me too on the pricing. By the end of the day I’ll have spent more than I ever did on say Borland Delpi Pro, which had a designer/code builder/help/editor that makes extjs look like a cheap toy. And the cost of learning to use it has been many times higher.

  19. Johan van de Merwe says

    @Goldclub, I think that is a bit harsh, to call Ext Designer a cheap toy. I am not using Ext Designer to build complete projects like I have seen in some webcasts. But all my dialogs start with Designer. I have saved already a lot of time, by using this product. I think the price is quite high frankly, but it is hard for me to imagine doing Ext JS projects without it. I haven’t used it yet for Sencha Touch.

Leave a Reply

Your email address will not be published. Required fields are marked *