Yes. OutSystems enables organizations to employ responsive design techniques. Every time a new mobile device is announced it seems to come with a completely different screen size. As the number of different form factors increases, a full spectrum of sizes between the smallest smartphone and the largest computer display appears. This makes it harder to tweak a user interface (UI) when using something like a Galaxy Note or iPhone.
OutSystems shields any company's applications from this changing landscape with fluid grid design capabilities, UI widgets and a responsive UI framework called Silk UI.
Fluid grids have become the standard for responsive design. With OutSystems, developers can use fluid grids in the visual development environment by simply dragging and dropping. The apps smoothly adapt to all existing device sizes perfectly and are future proof.
Because fluid grids use proportional sizes (set in percentages), developers can use them in every kind of layout, even in smaller sub sections of a page, and when designing and tweaking the tiny elements of applications rather than resorting to CSS.
OutSystems enables developers who are using fluid grids able to also use thesplit commands, available on the toolbar and context menu. With a single click, containers can be split by 2,3 or 4.
OutSystems includes a set of widgets that allow developers to create richer multi-channel user experiences. Users can be more productive when inputting data in an app, while the developer team focuses on business functionality. These widgets are:
Powered by HTML and CSS standards, a major advantage for accessibility compliance or customization requirements
Multi-channel ready so they work and adapt themselves across multiple devices and form factors, and with substantial usability-related improvements for mobile scenarios
A responsive UI framework: Silk UI
OutSystems has a built-in framework to develop responsive web applications without a single line of code: the Silk UI framework. In Silk UI everything is responsive: themes, layouts and patterns. But it's a different, better kind of responsive. Instead of a client-side approach, where all content is always sent to the browser and it then decides, using CSS media queries, what to show to the user, Silk UI uses a server side approach.
Why Silk UI?
Silk UI is a fully responsive framework, with dozens of ready-to-use patterns, that can be easily dragged-and-dropped to build amazing UIs without any coding. With several developers pointing to CSS as one of the hardest “languages” to master and all the new challenges brought by the wide set of form factors across devices, pushing this complexity away was key to solving this issue.
This codeless approach boosts developer productivity, fosters usability, improves look and feel out-of-the-box, and reduces the skillset required for developers to create rich and engaging user experiences.
The framework provides four themes that are customizable and fully responsive. Liverpool and Dublin were built to answer different base layouts, Tokyo is aimed at building great hybrid mobile apps and Lisbon is for developers who want to start something completely new that still leverages the provided patterns.
Any of the dozens of patterns work seamlessly in any of the themes and blend into its look and feel. Users have noted that “they just work” and look great across all devices.
Dozens of pre-built web blocks extend current OutSystems widgets with exciting new controls and patterns, like button groups, toggle buttons, dropdowns, balloons, carousels and many others. This makes building applications user interfaces a breeze.
From patterns that simply display content in modern and easy-to-model layouts, to a set of new modern controls, data visualization elements, good looking emails and new navigation mechanisms,a developer team is covered for most patterns an application might need. There are also specific patterns that enable responsive behaviors or are designed to craft a mobile experience. These abstract the complexity of working across devices or form factors.
All of these patterns have best practices built in so they are extremely robust and performant in runtime, while providing the drag-and-drop experience in the visual editor you’re so used to.
In Silk UI everything is responsive - the themes, layouts and patterns. It foregoes the client-side approach where a browser or device decides what content to display in favor of a server-side approach called RESS (Responsive through Server Side components). Content is calculated and optimized at the server before being sent to a particular device. This adapted version of the page improves fit and performance and has multiple advantages over having the browser or device decide:
Only the required content is sent to the browser because the server is aware of the device in use.
There are no CSS media-queries, which makes specific device-targeted CSS instructions easier to understand.
Different strategies can be used to handle devices on the server.
Sample pages and apps
A set of sample pages and applications are provided to quickly set up developer pages and to allow learning by inspection. OutSystems has built dozens of responsive and mobile sample pages that can help developers and teams imagine and build UIs.
Get started with Silk UI quickly by visiting the Silk UI website.