OutSystemsPlatform in Action

OutSystems Platform 2014 Winter Release

To celebrate Valentine’s Day, we launched a series of updates to the OutSystems Platform. I guess that for a lot of you, this is one of those gifts you’ll be excited to use all year around.

There are so many mind-blowing improvements that we’re even a bit ashamed of naming it 8.0.1. There’s a great reason for that though: it works just as a patch release… our cloud users will start seeing their platform get updated with the new capabilities and our on-premises or hybrid customers can simply patch their installation and immediately benefit from all that is in there.

So, what can you expect from this release?

Great User Experiences Across All Devices

A new, responsive-ready, web page editor

This release includes a brand new web editor with full support for responsive design, providing even higher-fidelity previews of the application being built without ever having to leave OutSystems.

Written from scratch for performance and to take advantage of the WebKit browser engine, the new web editor gives a pixel-perfect preview of HTML5 and CSS3 while editing, making the whole design experience much faster.

Grid layouts are an awesome way to ensure design consistency and to accelerate screen design by making it easier to layout content. In this version, support for responsive grids is included as applications are designed, making it super-easy to build your screen layout for the desktop, tablet, or smartphone.

1

Responsive by default

A new responsive theme that is flat, responsive and touch ready is now included as the default for new applications. The London theme bundles everything needed to discover the best way to build an application that works across devices.

Much more than a set of styles and layouts that can be used throughout your application, this theme is a complete style guide that helps with many of the composition patterns needed in applications. It includes templates that can be reused such as Dashboards, Long forms, Wizards, Infinite scrolls, Advanced search, Editable lists, Tabs, Breadcrumbs, Cards, etc…

london-theme

The London theme was built with customization in mind, and it’s very easy to transform it to your company’s look. By going to the theme landing page (http://labs.outsystems.net/LondonTheme) and writing your company’s web address in the customization section, the theme is personalized just for you – including colors and company logo.

And because the theme is all standard CSS3, it can be further customized for your specific needs. This is not only a great accelerator, but also an awesome way to learn the best way to extend a theme, and even understand, by inspection, how to create your own theme and share it with the community.

london-theme-2

Icons, icons, icons

mobile-icons

Every application needs some color. And icons are a great way to represent a particular action on an application, with a visual queue that users will recognize as they get used to the application.

To get started without having to hire a design team, we’ve bundled a set of beautifully designed, highly usable icons (based on AwesomeFont) and made it really easy to include them in any application.

These icons adapt well to any size and can be highly customized to almost any need. And they’re amazingly simple to use, just by drag and drop, browse, and customize.

Device testing made easy

It would be great if only a single device needed to be considered. But the fact of the matter is that with the proliferation of new devices appearing, each one with its own form factor, it is harder to ensure your user base will own the device you expect. Applications need to account for this.

Responsive design is a great approach to cover these needs with minimum impact to productivity, but it also implies that you need to test your applications across this wide range of form factors. To help accomplish this task, the OutSystems Platform 8 introduced an extremely simple way to test applications with different form factors. As an application is published and opened in the browser, you’re immediately redirected to a screen that let’s you choose which form factor to test in (with the usual standards bundled in). You can fine tune the form factor in which the application will be tested or immediately open it in a mobile device by scanning a QR code.

mobile-theme

A new 100% smartphone theme

Smartphones present unique challenges in terms of application design and sometimes responsive is not enough. For those scenarios, you now have access to the new LondonMobile – a 100% smartphone theme. This theme takes advantage of advanced HTML5 and JavaScript optimizations making the entire smartphone experience more fluid, without having to know them. It also includes new smartphone-specific widgets (e.g. scroll to show more, right aligned menu for a more usable experience, toggles for checkboxes, …) making your applications a pleasure to use on small form factors.

smartphone-theme

A bunch of usability and productivity improvements

Smart suggestions

ux-improvements

Whenever a value needs to be set in OutSystems, a list of suggested values is always provided to make your job easier. In version 8.0.1 we’ve made these suggestions even smarter, to better predict what is needed at each step of development.

Assign node usability

Applications in the OutSystems Platform handle huge sets of data going back and forth, in and out. Mapping transformations of this data is not always easy. To further help, we’ve improved the usability of the Assign node, so it is much easier to understand what each assign consists of.

Links around containers or web blocks

Did you ever want to make an entire area or section clickable?

web-blocks

Do you need large and rich touch areas in applications? Do you want to package rich, UI complex and reusable blocks that your team can reuse as buttons or links across applications?
If the answer to any of these is yes, you’ll be happy to know that in this version any of these elements can be included inside a link widget, giving much more freedom when composing web applications. The use cases are so broad and powerful that we wanted to make sure this new “minor improvement” didn’t go unnoticed.

Richer mobile list screens

mobile-screens

When scaffolding a new mobile list screen, the default list is now created with a List Records (instead of the previous Table Records). This allows for richer list elements with much less work. Combined with the ability to have web blocks inside links, this allows you to design in detail the content of each one of your mobile list rows, fine tune it, make it reusable, and just drag it to be your list element. Not only is maintainability improved, you’ll be much more focused on improving the user experience of your mobile app.

Improved widget navigation

To build a truly great application, a great UI is needed. We realize that developers spend a lot of time tweaking web and mobile screens, and in this version, we have improved how you select, move, and navigate widgets inside a screen. Understanding and navigating the hierarchy of widgets, while still maintaining the real preview, is now much more easily done just by clicking on the widget name right in the editor. And when you need to tweak the data source for your list or table, it is easily accessible right from the user interface.

Themes layout inheritance

improved-navigation

In order to increase maintainability of your application and provide you better options when redesigning an application, both grids and layout web blocks settings on a theme are inherited. The outcome of this is that the actual layouts (Masterpages) used on a screen, are defined by the theme itself, instead of on a particular screen. By changing the applied theme, all the pages using that theme will see its layout updated.

Major Performance Improvements in 1-Click Publishing and Staging

The day-to-day of an OutSystems developer is spent making heavy changes on critical applications, over and over. The 1-Click Publish operation is a core part of this process, and one that is done dozens or hundreds of times per day.

Whenever you need to see the effect of changes to an application, be it UI, business logic, data model or integrations, the Outsystems Platform lets you do that with just one click. Getting your changes done in the model, uploaded as a new version in the version control system, getting highly optimized Java or C# code out of it, and then getting it compiled and deployed to the cloud or across your on-premises server farm is a heavy lifting job. Sure enough, having it automated is a big help.

Such a critical piece requires constant tuning for increased reliance and performance. On this version, we’ve taken a giant leap and introduced a huge increase in performance, not only in the 1-Click Publish process, but in a lot of the capabilities that rely on it’s technology.

In this version, we’ve refactored the most lengthy part of the process (transforming / generating the model into highly performant code), achieving optimizations that decrease the time required for the entire 1-Click Publish process. This part of the process had an average performance improvement of 86%.

Overall, going from application change to application running is now up to 60% faster!

before-now

These improvements will be noticed on every operation that implies generating code out of your model. As such a similar level of overall improvements in the following operations can be expected:

  • Publishing an application for the first time
  • Making a change to an existing application
  • Publishing existing modules, solutions or solution versions
  • Staging applications between environments
Immediate test query

Along with these improvements in code generation, we’ve refactored one of the most important actions that, as a developer, you use every day. Testing a query, to check if you’re doing everything right, debugging it or fine tune it against example data or different conditions before actually deploying the new version is done over and over again when you’re developing. This operation usually took around 14 seconds.

Now it is immediate! Only depending on the ability of your database to handle it, of course.

Want It? Go Grab It!

Overall, these changes represent a huge productivity increase in daily work, allow you to test more often on all devices, and make the operation of staging an application to production even leaner.

Just head over to http://www.outsystems.com/home/downloads/ and get it installed on your private cloud, or ping back OutSystems to know when it will be available on your cloud subscription, if not already there!

About the author

Gonçalo Borrêga

After ten years of hardcore development, Gonçalo got bored with the repetitive tasks that are required project after project. So, he adventured into finding the best way to bring automation and productivity to the rest of us.

Leave Your Comment