AUG
10
2016
|
KDE's Kirigami UI Framework Gets its First Public Release![]() Kirigami, KDE’s lightweight user interface framework for mobile and convergent applications, which was first announced in March, is now publicly released! This framework allows Qt developers to easily create applications that run on most major mobile and desktop platforms without modification (though adapted user interfaces for different form-factors are supported and recommended for optimal user experience). It extends the touch-friendly Qt Quick Controls with larger application building blocks, following the design philosophy laid out in the Kirigami Human Interface Guidelines. KDE has a long tradition of providing user interface components beyond the basics that are offered in Qt itself. With KDE Frameworks 5, these have become more easily available for Qt developers who are not part of KDE. Now, with KDE’s focus expanding beyond desktop and laptop computers into the mobile and embedded sector, our QWidgets-based components alone are not sufficient anymore. In order to allow developers to easily create Qt-based applications that run on any major mobile or desktop operating system (including our very own existing Plasma Desktop and upcoming Plasma Mobile, of course), we have created a framework that extends Qt Quick Controls: Welcome Kirigami! Kirigami is not just a set of components, it is also a philosophy that defines precise UI/UX patterns. It allows developers to quickly develop intuitive and consistent apps that provide a great user experience. Some concepts are: ![]() ![]() ![]()
The Kirigami Components for smartphones are optimized to allow easy navigation and interaction with just one hand, making it ideal for using applications casually “on the move”. Kirigami is not only for smartphone applications. It will allow to create convergent applications, which are not simply the exact same user interface scaled to different sizes, but morphing between optimized interfaces based on the input method and screen size, changing as the context changes (e.g. flipping over a convertible, docking a phone). Another important concept is non-invasive pop-ups to undo an action, rather than confirmation dialogs. Why the name Kirigami? Kirigami is a Japanese art of papercraft. It is derived from origami, but adds cutting as an additional technique to folding. The reason we chose it as the name for our framework is that different layers or “sheets” in the UI are an important element in its design philosophy. Navigating through screens and the pop up of the drawers are like flicking through sheets of paper. The first real-world application implemented using Kirigami components, Subsurface-mobile, is available for Android, a version for iOS is currently in the works – sharing most of their code. The Subsurface mobile team (which is lead by VMware’s Chief Open Source Officer Dirk Hohndel and has a certain Linus Torvalds as one of their core contributors) and their group of enthusiastic beta testers have worked closely with the developers and designers behind Kirigami to improve both the framework and the application based on their real-world experiences. The second Kirigami-based application to be released, the comic book reader Peruse, had its initial release in June, and was made available on both desktop Linux and Windows as well as KDE’s own Plasma Mobile. The application targets both touch based devices and the touchless desktops and laptops that are still very common, and as with Subsurface above, Kirigami has allowed for the majority of the code to be shared between those two versions. When asked about the experience, the main developer of Peruse, Dan Leinir Turthra Jensen, stated that “developing with Kirigami has been really exciting, and the team behind it is very responsive to suggestions and reports of any issues in the components.” Kirigami currently officially supports Android, Desktop GNU/Linux (both X11 and Wayland), Windows, and the upcoming Plasma Mobile. iOS support is currently in an experimental stage, support for Ubuntu Touch is being worked on. You can find links to the code, API documentation and contact details on the Kirigami Techbase page. |
![]() |
Comments
Hamburger controls
The framework is certainly interesting for a number of reasons.
I must question the hamburger/menu button positioning choice though. It may seem like an interesting option for ergonomics on mobile since it places access to the buttons closer to the bottom of the screen, but floating buttons will always cause some problems with layouts because they can obscure content. In this respect, the left side of the screen is significantly worse than the right side (eg - material floating action buttons, which are also less of a problem because they're only displayed contextually) for left-to-right languages, since that's where text is usually aligned. Additionally, since the appbar/menubar is already a staple component of app design, the floating hamburger button is actually just wasting screen real-estate, and on mobile the swipe mechanic is often more convenient anyway (when well implemented). Finally, because the interactive elements in the drawer are aligned top-to-bottom, any ergonomic gains are immediately lost by the need to shift to the top of the screen to interact with the drawer contents.
I can appreciate a desire for differentiation, but I'm not convinced by this choice.