 Hello and thank you very much for tuning in. I'd like to thank the LibroGraphics meeting for organizing this conference and moving it online. I'm really delighted to be here. I've been wanting to meet and interact with this community for years. I feel at home here. I'm a practicing designer for 15 plus years and I've always been paying close attention to software as an important part of my practice. And there is also a feeling of new or new business. In the last couple of years only free software and design have really combined in new and much more concrete ways for me in my practice. I switched to Linux about a year and a half ago and this culminated in starting my new job last November on CripPad which I'm going to talk about today. So CripPad is an encrypted and open source collaboration suite. It's a collaborative office suite and we aim to offer similar tools and features as the big platforms but with privacy as a guiding principle. Everything is encrypted and the user is a browser but you can still collaborate in real time but the server never sees any of the content. It has literally zero knowledge of any of the contents of the documents. It's made by a French company called X-Wiki where I work. It's been public facing since 2016 with a lot of the key features such as Drive etc being added in the last couple of years. It's licensed under the AGPL which means we have our flagship instance at CripPad.fr which is about 30,000 active users but there are also over 400 other instances at least that we know of. It's funded at the moment mostly through research grants so at the moment we have projects specific features that are funded by AnonNet Foundation Next Generation Internet and we recently received a small CEDA award from Mozilla open source support. Our goal is to become sustainable from user subscriptions only within the next couple of years. We've seen a huge growth in usage since the COVID-19 pandemic. We had about 14,000 weekly users in February and that went up to 50 during the lockdown and now it's settled back down at about between 30 and 40,000. I'll give you a quick tour. We have a drive to organize your files and your content and to share folders. We have a rich text editor which is an integration of a CK editor where we've recently added comments functionality. We have codepads or markdown pads where you can write markdown. We're integrating a CK editor and making a preview with marked.js. Here we've recently added a color by author for all the etherpad fader listed feature. We have spreadsheets which are integrated from OnlyOffice using our encrypted real-time collaboration. Kanban boards which I recently redesigned and this is using Jkanban and building on that. We have slides similar to markdown using CK editor and marked where you can write your slide decks in markdown. This is what I'm using to present. We have wide board using Fabric.js and poles which is due for an imminent redesign in the next few months. So my role started as a designer in November 2019. I've joined the existing team of mainly three. So Aaron McSween is the project lead. Jan Florey is a privacy engineer. We get the occasional support with marketing and promotion but also with the code itself from Ludovic Dubost who's the ex-weekly CEO. I was brought on to basically improve the usability quote unquote UI UX. I was particularly interested in communicating the trade-offs of the platform. So as I get into there's a few things that are different from what people users of Google Drive or Office 365 may be used to. We think it's for good reasons but the UI needs to reflect some of the quirks and overall to improve visual communication CripPad has been without a designer since the start and I think part of what I want to do is have a visual identity that does justice to the to the project and allows it to to stand alongside bigger projects with many more resources in terms of communication and looks. A lot of what I've been doing so far is basically getting to grips with what was already there and consolidating it so making the existing language more coherent rather than radically changing things. I've been getting to grips as well with writing for product so we're doing our translations are on web late and the role of language is something I may have underestimated but I'm doing a lot of writing for interface and recently as well I've been trained or like at least introduced to questions of accessibility and so this is something I'm going to be watching out for across the platform as well with the goal to make everything at least double A in the next year or so. So I'm going to run through a few recent features I might give you a sense of the work I've been doing and also as I was mentioning the kind of peculiarities of CripPad. So the first thing is this functionality called Burn After Reading or at least that's what we called it internally. This is the ability to share a document and to force the recipient to delete once it's been opened for the first time and so while we sometimes look to Google Drive to see how they do things and what our users might be used to or recognize this is something that doesn't exist at least to my knowledge on any other platform so it was a real challenge to communicate what was going to happen. So we've opted for basically messaging that's attempts to use words like self-destruct and things like that to really make it clear that this is not a drill. This is what the the recipient sees when they receive the pad so once again self-destruct and then giving the option to come back at a later time if you're not ready to proceed and then communicating that the pad's been deleted from the server once it's once it's been opened. Another key feature I've worked on is the introduction of access lists so we had a few requests to manage access and revoke access especially. This wasn't possible on Crip Pad because if you sent the link to someone the keys are in the link so once someone had the link they basically could not you basically could not revoke the access but so with this feature this adds a layer of granularity to the way the access is managed so even if someone has the keys to your document you can add a list to further restrict who can who can view and who can edit so it is it can be used in effect for the use case where you'd want to revoke access to a pad and so we took this opportunity to group different functionalities together we grouped it with the notion of ownership which is really key on Crip Pad owning a document or a pad is gives you a lot of power basically you're the only one that's allowed to delete the document but also to manage and remove other owners and also to add the access list as I've as I've just mentioned so this was part of a move on my part to consolidate and to try and make these really key but sometimes are unclear features into one notion so in this case access and so the two key things going forward will be grouped under share for the links and the sharing with the Crip Pad contacts and access for managing all this kind of granular permission stuff the third feature I want to show is this deleting history option so basically because of the way that Crip Pad works which is with an append only log the longer the older the document the larger its history and that increases its size and so for a platform that's only our only limitation is storage space so at the moment we offer a gigabyte of free space for any registered account and then our subscription plans are basically only adding storage all the features are the same so we thought it was a good idea to allow people to clear the history basically the way that we we build the history is that every so often we make a checkpoint so we don't have to recreate the whole history every time you open the pad so there is a bunch of history that effectively could be could be trimmed with this we introduced a little UI touch which is a confirm button and this is I think for me the the kind of finer details that's going to help avoid mistakes and make things a bit clearer across the board while keeping a language that's consistent with what was already there so in terms of how we get things done coming back to the theme of the conference obviously we we live in Crip Pad so this we it's our product but it's also our daily work environment so we're constantly confronted with our with our work and our mistakes in terms of introducing design to this I've I've tried to kind of bend the platform to and to find search for ways and workflows and strategies to to publish and share design mockups so one thing that I'm commonly doing now is dropping images into a codepad and then this gets annotated and comment it on as we go and then Jan draws directly from this I see implements things into the code or I might try and implement something as well something that is quite interesting especially at the start is that obviously all the a lot of the styles are available the Crip Pad styles are available if you are treating the codepad like an html for html markup so I'm also doing markup markups directly in the pad as a kind of way to avoid redrawing the results of html which is something I really hate doing so writing markup directly and then having a lightweight style sheet at the bottom of the of the pad has been a nice and quick way to to mock things up and so I guess for me more more generally it's been about finding some kind of sweet spot between engaging directly with the code base which is something I'm doing and something I want to do more of but not always the more the most efficient way of going about things and then using Figma to sketch new possibilities and and come up with with new changes etc so I found that although I'm committing some small things directly to the code base and wanting to do that more and more in terms of design there is kind of a trade-off between being in the direct contact with the code and learning that that curve but effectively the end result of that route is that you're just able to reproduce how things currently work and so on the other side you have tools like Figma where you're redrawing pictures of html which is also highly unsatisfactory but is maybe more conducive to having radically new ideas or concepts that improve the platform and so I'm aware that uttering the word Figma in the context that we're in is probably like highly heretic and this has been the conflict for me since the start and something I really want to pay attention to is that yes I want to use only free software in my free software job that that is the ideal but at the moment using Figma is basically making the open source software that I'm working on better and I think this is because the the landscape of kind of UX design tools especially on Linux is pretty dire I mean it's pretty much a desert at the moment but I'm really looking forward to some super exciting projects on the hopefully near horizon that will help to change this so I'm watching Akira UX very closely this is a sketch alternative on GTK and it's looking like they're going to have an alpha very soon and I was also super excited by the first demo of a UX box which looks like an open source Figma killer so these two these two projects I'm kind of refreshing GitHub eagerly to get to try their alpha versions but there is something I think beyond beyond that because even if these these projects come to their first release which know that they will do and I'm really looking forward to them they will still be about drawing pictures of HTML which is somewhat unsatisfactory and I wonder if there are there are there are other routes where we could more tightly integrate a design tool with the code base so something along the lines of craft js craft js is a kind of component based page editor which takes a library from a code base and and kind of mixes in these more visual ways of designing this is for a react which for us for me it doesn't work because we we are not we don't use react the crypt pad is vanilla javascript but it's it's making me think about the potential intersection and closer integration between a design tool and a code base that I think would be super interesting and I want to really look at that as part of my work in the in the coming years and to contribute you know on this on this front as well not just on the open source product itself but also on how to design for the open source product so to close I just wanted to give you a quick preview of the of a new UI improvement that may or may not be released before this gets streamed to you if not it'll be soon after basically a whole overhaul of the toolbars across crypt pad where I've surfaced a lot of hidden functionality and also really centered those share and access buttons as you may be able to to see on the on the slides here so this is something I'm really excited about and will be followed soon after by Closeligio and the static pages as well so thank you very much for for listening here is a bunch of ways to get in touch with us we're on github on mastodon we have a matrix channel if you have any questions or if you are thinking about setting up an instance yourself we're on twitter as well for those who still use that and then my personal details are also here if you want to get in touch thank you very much and I look forward to the questions and discussions coming out of this thanks yes so now we're well we're in terms of myself himself question let me just turn off the lc I don't know if that's the reason why I'm here myself is crypt pad profitable already profitable or past the breakeven point we are fully funded by research projects so as I mentioned at the moment this is annulet foundation next generation internet and a little bit from moss but so we're we're not making profits we're fully funded um we our goal is to shift the income stream from these grants to being fully funded by our subscribing users and we're hoping to do that in the next two years at least that's our goal at the moment um myself himself uh not well understood do you plan to embed a ux till inside of crypt pad um ux designers are not I don't think the the main target I think I'm I'm more talking about something that would be I don't know to think about the workflow um of designing crypt pad uh whether that's something that plugs into the codebase somehow I have no concrete ideas uh about this at the moment it's just pointing forward something I want to think about but I doubt that it will be a crypt pad app um the question uh is it possible to have my own server with crypt pad uh to have your own crypt pad instance yet absolutely at the moment um there are about 400 plus uh instances aside from r1 which is the main one at cryptpad.fr um it's I'm not I haven't set this up myself we use a lot of safety features like um content security policies and stuff like that so I think the setup is a little bit tricky and we currently have funding for um documentation which is a big lacking point at the moment so we're currently working on user documentation but also admin and install documentation so we're hoping that will get easier um to do within the next uh couple of months um but yes absolutely you can set up your own instance uh a little uh one of the key features in closed source alternatives is the ability to move from offline tools to online editing and back and forth high script pad in these terms and related to this can nodes communicate with each other and if yes how do you work with the challenge of making a decentralized system intuitive from a UX perspective uh okay lots of stuff in there so um the first question basically relates to import and export and particularly I think for a lot of people um it's important to have import and export from FIS formats um we have uh xlsx exports from our sheets uh which I think is currently only working in Chrome because of some reason that I forget but Firefox hasn't implemented something that Chrome has um and we're currently working at the moment on uh doc or docx export from the rich text uh so yeah we're a bit lacking still on this uh inter probability but um hoping to bridge that gap fairly soon and then the instances cannot communicate with each other at the moment but this is something um so basically federation uh is something that we're thinking about and um might look at in the next I would say in terms of the next couple of years in terms of roadmap and yes once we do that there will be huge UX challenges in terms of making that understandable or intuitive any opinion to share about web RTC is this reliable enough for peer-to-peer streams so I'm not this is not really my expertise so you're talking about making um this peer-to-peer I I think that would be interesting um um we saw the the first time Ludovic's presentation at first time was right after yjs as well which you know we discussed doing that peer-to-peer that's not the current architecture we do have a lightweight server at the moment which handles the basically the syncing of encrypted patches um but yeah I think that's it's definitely not out of topic it's interesting but I can't tell you much more about that um who are the most users of Crippad students companies but countries so on Crippad.fr the more than half of our user base is from Germany and from the support tickets that we get it seems to be a lot of students and teachers the German pirate party have an instance um one of the the bigger instances out there that's not our own and they I think they handle basically Crippad is we translate Crippad in French and English and German translation happen almost instantly and they I think they're handling that um so Germany is a is a big um user pool basically um kind of circle did you try inkscape 1.0 I've seen people using blunder to design yeah so I've um I've tried inkscape inkscape I really like uh that's pretty amazing progress with um um 1.0 and designing UX using blender sounds interesting uh I've tried it off I have used blender for three but um we'd love to know more about that if you have any any links um as I mentioned there was a couple of mistakes in my talk uh I said that we were using ck editor um when I it should have been code mirror so I've corrected those and um put them on my slide deck which is on Crippad is there anything any other questions the um new toolbars that I showed uh at the end uh are not on Crippad.fr yet but they should be the release will be um shipped today I think at the end of the day question can web web dev backhand be used for versioning revisions or even git um maybe it can but that's not um how we currently do it we have um an append only log called uh chainpad that handles um the all the string of patches that are applied and handles also all the the conflicts basically when two people are typing at the same time another question uh are you full time yes I'm full time uh since November and we are uh full time on Crippad we're three people so it's myself uh Aaron McSween who's the project lead and Jan Florey who's uh the engineer and we so with the three of us uh we do everything from replying to support tickets to writing code to um um translations all of it okay well yeah thank you so much everyone for tuning in and I really look forward to um the rest of the conference uh lineup looks super interesting so I'm gonna keep listening thank you have a good day