 Basically, a framework on top of Qt's module called Qt Quick, which uses a markup language called QML. And that language is basically just like any other markup language out there. So for instance, it's really, really similar to, the syntax is very similar to CSS. So you can define certain UI stuff and mark the anchors, add padding and spacing and stuff like that. So that way it's quite simple. I mean, so Kirigami is basically a framework that was developed by the KDE community on top of the Qt Quick module so that these applications that they write can work not only on your desktop, but also on something like this, a mobile phone. So KDE also has a project called Plasma Mobile, which is the entire desktop running on a phone. If anyone of you has not seen it, just look it up, it's a really cool project. And I think they already have a production version, so at least maybe beta already. And it's people are actually using it. The images are out in the open. So, okay, that was a bit of a context. So let's get into Kirigami. Yeah, just a brief intro about me, I'm Harish. I have been working on KDE projects for a while now, I think it was 2013 when I started contributing to KDE. I had the chance to work on a couple of Google Summer of Code projects with KDE. So 2015 and 2016, and basically I have been contributing to projects of subgroups Plasma, which is your desktop, KDE desktop. And QoPT is a universal messaging application and I was involved in the port of it from KDE 4 to KDE 5, which is a different API. And at present my day job is at a company called Spectral Insights. We are into healthcare and again, we employ a lot of desktop applications for deployment at customer sites. That was there, I think I'll keep it short over here. So, all right, so what's with the name Kirigami? So I actually didn't know Kirigami was a Japanese art and art of papercraft, I had heard of Origami. But apparently, Kirigami adds cutting us an additional technique to folding as well. So I'll take you for what it is and the different sheets, if I may call it, layers. That's the important piece in any Kirigami UI, if I may say. So even in any Kirigami art form, I think you have different layers and that comprises of your art. So in a Kirigami application, you have various screens just like you have in your mobile phone, you have screens which you can swipe up and down, right? And that kind of gives you the feel of flicking through screens or layers. And I think hence, people decided to go with this name called Kirigami. And a few examples for, I'm not sure if any of you have been using KDE, but this application called Mew and Discover is KDE's package installer. And there's another comic book reader called Peruse. And finally, public transport. That's basically a desktop application that, well, it basically, if you can provide an XML input for the public transport data. So it'll just fetch the list of stops for a certain stop in your city. And we'll just show it in a nice timetable format. That's the idea behind it, it's still a work in progress project. So I've been the one who's been working on it for most part. So maybe after this someone might want to work on it. So this is, yeah, some screenshots for you. This is the Mew and Discover, this is the package manager, so package installer. So you can see the packages are installed in a nice way format and you have like a menu bar over here. And I think you'll follow the same structure. You'll notice it's the same structure being followed across different applications. This is the comic book reader that I spoke about. Yeah, again, you have the main menu bar on the left. And basically what happens on the screen is what you write. You can organize your any sort of data, it could be images, it could be a list of columns and rows of data. And just organize it in the proper way. And finally, the public transport. And I think the screenshot really tells you it is a work in progress project. It's only the bottom part that you need to look at. Like I said, again the same structure, you have a global menu on the left. And you have basically rows of data. These are basically public transport data, so these are the stops. And this could be any public transport, it could be a bus, it could be a tram or whatever. And it's basically showing the arrival and departure to a particular stop and rather list of stops in Oslo. It's just an example, dummy dataset. So yeah, let's get into the business now. So Kirigami has a lot of your components, all right? So just like with Qt, Qt Quick, there are loads of components. And Kirigami is no different. These are some of the components that have been provided to you. And I think a lot of these are self-explanatory. I mean, you would understand what a unit says. Unit is basically just a class that lets you decide the spacing and stuff like that. You don't have a hard code. The minimal spacing between two rows or columns. So you can use something like units over there. And I mean, an application header again should really tell you what it is. Actions are basically menu items, so if I may say, and stuff like that. But I think a few important ones are, well, start of it. The application window, which is going to be your main window. And in QML, if you ever use QML, you will realize that you need a root component. I think just with, even with, do you have a root in HTML? I'm not sure, but of course, you need a root in QML. You need to have a root component. And all the other spacing and all the UI adjustments will be related to your root component. So this is the first thing you'll need in your application, the root QML component. And a global menu bar. And it's not really a menu bar, but it's the left pane that you just saw. On each application, there's a left pane. So it's like the global context for your application. So menu bar is not on the top. Because if you run a mobile, you don't want that, the custom menu bar. So it's going to be something like this. Right on the left, you can swipe it in and out. And then you come to a context drawer. Yeah, this is basically, once you move to a specific page, you want to be able to show some additional options to your user. And this context drawer allows you some space on the screen, which can just come in and out. And you can just kind of list the actions for you. And there's also an overlay drawer, which is again another UI element, which will come up on top of your main screen. Now there might be cases where you would not want to have your UI on an entirely new page, but you might just want to put some data on a new screen space. So this can just come up on top of your page that's already existing. And you can just swipe up. And it should go away. And the page again, well, it's within a root context, you push and you pop and push pages. Pages are basically your application logic motorless. So you push and pop pages inside an application window. And yeah, this is what I was talking about. There's again, more like an over-issue, just some modal dialogue they want to display. Yeah, so these kind of screens, these could be some modal dialogues. And if you swipe them all the way up, they go away. So the system is almost like a prompt or a modal dialogue they want to display. So these could also be taller than the screen size itself. So these dialogues will have a scroll option. And of course, if you scroll them all the way up, they go away. So I'm not on my laptop, so I'm not afraid. I might not be able to show you a demo, but why do I have some screenshots? And I'll list out what components we were talking about. So this is the public transport app that we just saw. And I think it's, again, listing some stops for Oslo and all that. So let's see, what components do we have here? This is the global drawer. This is basically your menu bar that we just spoke about. Needless to say, you would not have your menu bar on the top, as you would have in a desktop application. So we kind of move it to the left, and we keep it globally available. And these are actions. So all the entries that you see on the left are basically actions that you have, actions which will trigger new pages or any new actions, basically, any new commands that you might want to access from there. And I think this is quite evident as well. We are in a QML list view. It's a list of data that you're seeing. And each element out there is a basic list item. Kirikami has a class called basic list item. So you can arrange them in a list view. So it's much more easy to read. So Qt Quick also has a class called list element. So there's a list view class, and there's a list element class. And the Kirikami UI, I guess, it's just derived from the list element class, and we have a basic list item. So it just fits on the UI much better. And the rest are basically QML classes. These are not Kirikami classes. So you can write QML code, push in and push out. Kirikami code, you can have them all together. And they'll just look something like this. So this is basically a very simple UI. And if you notice, I really haven't used a lot of elements here. It's just very, very minimal elements. So there's a combo box. There's labels over here arranged in a certain way. So I don't know if I can point out. Yeah, so these are labels arranged in row. These are three combo boxes, and these are basic list items, arranged in row again, and action. So if you look at it, this really might look like a fighter-in-world UI, but there's really five components over here. Just this five components, and I have a working UI. So that's how simple it is. I mean, I don't know how you would achieve this in a web stack, but I think on a desktop stack, it's really, really easy. So well, my client wants to demo a Hello World application to you all, but because it's not my laptop, I can only give you the link to the code. So, well, but don't worry. I mean, well, I'm not sure if you can even access these. Can someone take a note of this, maybe? Yeah, OK, if someone's interested. Oh, you can always hit me up. I'll be around, so don't worry. Fine, I think I tried to keep it short, and that was pretty much it for an introduction. Any questions from any one of you? What was it the last time on there? Oh, it's just a Hello World application that you will find on the Kirigami documentation page as well. If you just Google for KDE Kirigami, you'll find the documentation page, and it's the exact same code. Same thing, but yeah, yeah, questions. So you have this transportation app, which is simple. How easy would it be to get it to work on it? Yeah, so I know it is. Oh, yes, so the question is, how easy is it to get it working on Android, right? Oh, sorry. Yeah, I don't know, repeat it again, so it would be, oh, no. Maybe not a good idea. Not a good idea. Sit down, no. Maybe it's two mites, I don't know. But can you hear me, though? Now it works, all right. All right, so if you know cute applications can be deployed on Android, so the procedure you would imagine is basically just the same. But unless your Kirigami application has a dependency like Plasma. So for example, the application that I just showed you, it's a Plasma public transport app, basically. So it depends on something called Plasma data engines. So the data you get is basically coming from a Plasma data engine. So it has KDE Plasma as a dependency. So if you can figure out how to compile or import Plasma as a dependency on Android, these steps are same. You basically do the same thing. I mean, it's a really well-documented process to run your cute application on Android. So that's nothing different as long as you don't have a fancy dependency. You don't do anything different at all. Yeah, I personally haven't given it a shot, but I really don't see why it should be any different. It is just QML, so. OK, so I should look at the GTSC documentation, because I couldn't find a lot of Kirigami documentation in that long. Well, you'll find it in only one place. It's in api.kd.otowaji, and that's where it is. But yeah, I don't know. Maybe you're right. Maybe there isn't a lot of Kirigami on Android, because I really don't think it's any different. It's just a cute application. So look up the cute documentation. I think they have an SDK and DK for Android. And don't introduce any fancy dependencies. You'll not be able to port on Android, so you'll be fine. Yeah, anything else? Anyone? Hello? Thank you very much. That's it, yeah. Sure. Before I leave, I'll leave you with some links. So if you have any questions, you can either shoot a mail to these couple of mailing lists, kddvel at kd.otowaji, or Plasma. So Plasma is the group that is currently maintaining Kirigami. Kiri is the more generic, overall Kiri development mailing list. And if you miss an audio thing, you don't want to wait for much longer. Just drop into IRC on FreeNode and enter hashplasma or hashkiri.dev. And if you're really interested in the public transport project, enter the Kiri Public Transport Channel. And there'll be a few people, but I think at present this person called Ike, he's really active, and you might be able to ping him. You'll also be able to ping me, but I'll probably respond after four or five days. So yeah, that was it for me. I hope some of you will actually try out Kirigami and Kirima, then let's see. OK, thanks.