Optimizing Input: Building your own customized keyboard

Speaker 1 [00:03]

Okay. Hello, beautiful people. Thank you for coming to my talk. I am Daniel Rios. I am Mr. Rios on Twitter. I've been a Python programmer since 2013 and a Django developer since 2014 and a Django contributor since this year in the summer. I've had three pull requests accepted and I'm working on my fourth one. So let's begin. First, we're going to have a history lesson. The history of the keyboard actually begins with the piano. You'll notice a few parallels here is that they both have keys, they're both on the board, and they're both using input devices, one outputs sound and one inputs text. Actually, if you have an electronic piano, it's actually known as a keyboard. So the motivation for these early typewriters was actually the telegraph operator. For those of you too young to remember telegraph, it was the original instant message. So you'd give a message to an operator, and they would go tap, tap, tap, and send your message in Morse code with a keyboard with only one key, which is this one. It traveled through the wires to another operator who would listen to the message and write it down and hand it over to the person on the other end. So, given that a telegraph operator could send Morse code at 70 words per minute but could only understand them at 30, they needed a new system to write faster. In 1846, Royal Earl House, which is his real name, introduced the printing telegraph machine. So, an operator pressed a key, they were all labeled with letters, it would automatically output the Morse code, send it over the wire to another machine on the other end, and print the letter on this ticker tape for you. So these were the prototypes for the early typewriters. This is the first typewriter to use a semicircular block, which you'll see here, that would then print the letter to the middle of the paper. This one was patented by Samuel Ward Francis of Newport, Rhode Island in 1857. Because it printed a C in the middle, when you hit the middle key, instead of playing a C note, it was known as the literary piano, instead of a regular piano. So this is a keyboard piano from the Smithsonian. In 1866, you have Christopher Latham Scholes with his own typing machine. Scholes is important to note because he is essentially known as the inventor of the typewriter. He starts here and works the typewriter to what it is today, or at least to what it was in 1878. So you didn't need to get a big full-working prototype, but something that conveyed the gist, which is why this literary piano only has fewer keys than, you know, the 26. This is one of the early typewriter layouts. Samuel Scholes rearranged the letter, so instead of being in two rows like you have on a piano, you have three rows. And this is sort of the prototype for the QWERTY that we have today. If you notice the placement of the M on the right, it's different, and then the C and the X are swapped. The grid is not actually a perfect grid, and this is because of the mechanics of the way that a typewriter works. You have to have the levers, the key presses, and they have to go in and then do mechanical stuff here. So you have them arranged in a row. And the only way to do this was to stagger the letters that they have, like you have right now. This is actually the reason why all modern keyboards have this weird stagger, if you've ever taken a close look at one. This is the result of that pattern. The Remington, the firearms producer, decided to branch out and produce other things made out of metal. And this is the first Scholl and Glidden typewriter. The exact same layout as on the patent. So there's a common myth that he rearranged the letters so that the typist would type slower. But in fact, he actually optimized it so that the typist would type faster. At this time, people were really only typing with two fingers, something that a lot of people still do today. This is the revised QWERTY layout, or rather the final QWERTY layout from the Remington No. 2 typewriter, which came out in 1878. And this is the layout that's been frozen in time for 141 years. So shortly after the Remington 2 came out, William Wyckoff of Ithaca, New York, began to teach a six-finger typing method. He didn't teach it to telegraph operators, but to shorthand writers, because essentially they would write their text in shorthand and shorthand is essentially writing a bunch of squiggly lines to transcribe what is said in real time and then they would essentially type it out. In 1882 a couple years after Elizabeth Longley presented her eight finger system at the first annual international congress of shorthand writers in Cincinnati Ohio. This is when touch typing really took off and at this time no one that owned a typewriter because these machines are very expensive, did the hunting tech method. If you owned one of these, then you really, really knew how to touch type. So my first tip to you today is, can you touch type? Touch typing is one of the things that everyone in this room should learn, especially if you're a programmer or really, you know, for the general population, anyone that has to touch a computer. I had a difficult time of this in high school, you know, over many, many years ago. I didn't know if the teacher wanted speed or efficiency and it turned out she wanted both. So I barely passed the class but eventually I got really good at typing. I discovered that when you touch type you essentially don't think about individual letters and where they are on the keyboard but you rely on your muscle memory to type out patterns and movements and you essentially type words. In the same way that you read phrases you type phrases by just going. So the you see them come instantly on the screen as you type. So words passed through your fingers at the speed of thought. Or, you know, actually just 80 words per minute. Back to the history lesson. As early as 1920, so when you had the typewriter coming out, you had a lot of shoulder issues, RSI, carpal tunnel. These are still issues that are with us today because you have essentially a small board and everyone's scrunching up to type at it. The typewriter also required that you hit the key presses hard enough that it would make the hammer strike the paper and imprint the letter. In 1926, it was suggested by researcher E.A. Klokkenberg in his book Rationalisierung der Schreibmaschine und ihre Bedienung or Rationalization of the Typewriter I live in Berlin, so it's not that hard. Rationalization In English it's harder. Rationalization of the typewriter and its operation, he suggested that typists could relieve shoulder pain by splitting the keyboard to be shoulder-width. This book came out in 1926, so almost a hundred years ago. My second tip to you is to split the keyboard. A hundred years ago, you couldn't do this because you essentially had a locked-in standard. If you wanted to split the keyboard, you'd have to develop a niche product, you'd have to convince people, and after the magnificent invention of the typewriter, it wasn't something that people really wanted. But now, in the age of plastic, silicon, and wires, you can even buy a few off the shelf if you don't feel like building a keyboard yourself. So we go from the cheapest to the most expensive. The one on the upper left is a Microsoft Sculpt keyboard at about €75. The one on the upper right is a Kinesis Freestyle, which you can actually split properly, €120. On the bottom left is the Ergodox EZ, which sets the standard for split keyboards today. And at 450 euros, you have the Maltron on the right, which if you've ever seen one of these in person, it essentially takes up a whole desk. So we come to the next big event in keyboard history, and that is in 1936 with the invention of Dvorak. If you look really closely at this electric typewriter, you'll notice that it doesn't have QWERTY, but some other crazy layout. In 1936, August Dvorak scientifically studied the existing QWERTY layout and proposed an alternate layout. The thing though was that it didn't really catch on because, you know, the locked-in mechanism of QWERTY, people had to re-learn to type. So my third tip to you is to use an alternate layout, Dvorak being one suggestion. Why? Well, let's take a closer look at Dvorak. So Dvorak took the most common letters in the English language, including the vowels, he put all the way on the left side, on the left-hand. And I think the most common ones are something like shurdulu etawain. So he took most of the the most commonly typed letters and put them in the home row, at least the most common letters in the English language. So this lesson's thing about travel time because you didn't have to keep moving your fingers up and down. So the stats on this section are from this excellent Carpalks website where someone wrote an algorithm to study keyboard layouts and you know which is the best one as compared to QWERTY and the author also had a layout that essentially reduced your typing efficiency threefold so it was three times as inefficient as QWERTY but for our case in the home row for QWERTY and if you look up top that's actually the Dvorak keyboard so you get a closer look at it because everyone knows the QWERTY keyboard in the QWERTY keyboard you have 34% of your most typed words are on the home row. Half of them are actually on the top row, so half the time you're just reaching up to the top row to type your letters. On Dvorak you have 71% which is almost twice of the most typed letters on the home row and the next row here is hand alteration. So hand alteration is important because when you type, if you're typing two letters that are on the same side of the keyboard you actually roll your hands over but if you are typing two letters on alternate sides you're actually much faster because as one finger is pressing the key press the other one's getting ready to press the key press so you just go so dvorak has hand alteration at 62 which is pretty high um overall there's other factors but the effort reduction from the uh qwerty to dvorak is about 30%. So I tried Dvorak a decade ago, and I could not get into it. A lot of my favorite shortcuts, Ctrl-Q, R, Ctrl-Q for quit, Ctrl-W, and the X, Z, V, Y, and Z were just, you know, in places that I couldn't figure out where they were. I couldn't retrain my muscle memory so easily because I am, after all, a computer user. So I looked for another layout, and I discovered Colmac. So Colmac has similar statistics as the Vorac. 74% of the most type keys are in the home row. Hand alteration is comparable to QWERTY. It's a bit inefficient in that respect. But overall, given other factors, it has a reduced effort of about 40% compared to QWERTY. I really love using Colmac. It's my favorite layout. I love that I'm not moving my hands all over the place. And for me, it's not about speed, because in the beginning, of course, When I was retraining myself, I was typing really slow, but it's about having comfort in typing, about not moving your hands all over the place all the time, making all these micro-movements. The great news is on a lot of the Linux distros, you actually have Dvorak and Cormac, along with a few others, pre-installed. On the Mac, it's a similar situation. On Windows, I know that you have to download Cormac and install it, but I'm pretty sure that Dvorak, because it's much older, is already pre-installed. Of course, you'll have to reinvest a couple weeks to teach yourself to type, but if you don't know touch typing already, you can just train yourself once. More history. With the introduction of the electric typewriter, you no longer had to press the keys to make an impression on the paper. I mean, you did have to press the keys, but you didn't have to do it with force, because when you pressed down on the key, a switch would send an electrical signal that would then make the hammer strike the paper. It had all these electrical components so it had a bit of reduced effort. The problem here is that this is a missed opportunity to reinvent the keyboard for modern uses. I mean you have the stagger here, you have QWERTY, you no longer need these things essentially, but the problem is something that economists called path dependence, that people relied on the system that they already knew so they just continued that system. So computer started to become more common and they needed a form of input because people already knew how to type on typewriters and programming started becoming more text-based. They needed a way to get the letters from the typewriter or from the user onto the programs. The first computer keyboards were electric typewriters connected to the mainframe as this is Remington's from the 70s or maybe the 60s. This is an electric typewriter modified to write directly to the magnetic tape, which is at the top, that was then used in the UNIVAC computer. Also in the 70s, you had ergonomics expert Carl Kroemer. He undertook research into the keyboard and eventually came upon split keyboards. For his experiment, he developed this keyboard that was ergonomic and adjusted the natural angle and placement of the hands. In 3D, this keyboard actually comes down, so the person is typing at an angle, as you've probably seen some different keyboards do. So you'll notice here that the stagger is different. On the regular keyboard, the stagger goes diagonal, whereas this one has the keys in a straight line, and then the keys conform to the natural curvature of the hand at rest. Going a little bit forward into the 80s, you have the infamous Model M from IBM. This was built like a tank, and it also was as loud as a tank because it had buckling springs, which would essentially make it go clack clack clack clack clack clack. This is the device that changed our relationship with computers because it was one of the first input devices that was such a high quality that it still survives to this day. This essentially became the benchmark for what input devices could be. If you find one of these, they're still worth a lot of money and there's people on eBay that are willing to pay for them. You can also restore it yourself. In 1984, the Cherry Corporation had been making switches for everything, and they actually introduced this, the MX switch, which is important because this is essentially the switch that ended up in almost every keyboard that followed for the next essentially three centuries, or the good keyboards at least. They have three types of switches. You have clicky switches, which you've probably heard in your office go click, click, click, click, click. And the click is the point in which the leaves make contact and send the signal input to the computer. You have tactile switches, which give you a little bit of a bump when you press them, so you know that you've closed the switch. And linear switches, in which you press it down, but you don't actually know when you've closed the switch until it actually shows up on the screen. Another side to the way keyboards work is that you actually have an electrical matrix. When you press the key on the top left, it sends an electrical signal down. You know the two wires that connect the matrix. When you press the key next to it, it does the same. When you press this key next to it, it does the same thing. But there's a problem called ghosting in which if you press the three keys in the corner, the key in the middle also gets registered because you're sending electrical impulses from the top two rows and the leftmost two columns. The way this is solved is that you have diodes, which are electrical components that force electricity to flow in a single direction. So then the microcontroller can know, you know, this is where the signal is coming from based on the direction of electricity. So with everything in hand, we can now come to building a custom keyboard. Since 1984, there's been a great ability to create DIY projects, but it's really been in the last decade that the culture surrounding DIY has really taken off. In this time, there's a few things that have happened that have made building your own keyboard a lot easier. The first is the rise of maker or DIY culture. So 3D printers have become a lot more common, especially in the home, And there's Maker Labs, which give people access to things such as laser cutters or 3D printers in case you can't afford one yet. 3D printers allow you to print just about anything that is geometrically possible. So this is how keyboards take any shape, even conforming to the curvature of the hand. This is a dactyl manifold, and it conforms to the hand when the hand is at rest. So instead of typing with your hands outstretched, you just sort of rest your hands on the keyboard, and then you type. The next thing that happened was microcontrollers. The most commonly used ones, at least in the keyboard world, are the ProMicro and Teensy 2.0. Both of them are good solutions, but they're not great solutions. Because the ProMicro has a bad habit of snapping off the USB port if you plug it and unplug it too many times. With keyboards, I actually have broken one, and I've replaced it with... So last year, the keyboard community simultaneously introduced two drop-in replacements for the ProMicro. You have the Elite C on the left side and the Proton C on the right side. Both of them are guaranteed not to break, and they use the very modern USB-C connectors. They're a bit pricey. They're 20 euros instead of 5 euros for a cheap ProMicro clone, but they're very, very well worth it. So some examples of keyboards that use these microcontrollers, you have the ErgoDox, which is one of the first popular split keyboards. This is actually an open-source project, so you can make all the parts yourself without violating copyrights, or you can buy a kit that you can put it together yourself, or you can just buy one for €250, as seen on the split keyboard slide. So my friend Mark last year, who couldn't be with us, last year at DjangoCon, he let one of these keyboards slip from his bag, and I thought I'd seen every keyboard imaginable, but this was totally crazy. This eliminated the side-to-side movements of a styrofoam keyboard and had the keys in a perfect grid. You can actually buy this keyboard. it's called a prionic without the number row it's called the plank and you can get a plank easy fully assembled ready to use for 180 or 180 dollars and the best thing about it is that it's fully programmable so you can put any keys anywhere a year ago i built a split version of this keyboard it was my first keyboard and i have it here with me today if you want to see afterwards but my favorite layout so far has been the iris um this takes from the chromer keyboard um from the 70s uh the research in the 70s and also has like the ergodox and ergo linear layout in which the rows the stagger conforms to the shape of the hand i've actually tried ergodoxes at meetups and i feel like they have way too many keys and you're always reaching you know for keys that you rarely use. This is the keyboard I have at home, and I also have it on me as well. So this is my work keyboard. It's the same keyboard as this. It's the Iris. You might come up to me after my talk. Well, probably not anymore. But you'll say, but Daniel, I need all 105 keys on my keyboard. If you have a laptop, you're already using only about 80 keys. If you have a phone, you're using only about 30 keys. But how do you manage to not use 105 keys? The trick here is layers. When you hold down a key, much in the way that you would hold down the control key, you can program it so that one key, you hold down the key, and then you have a number pad on the right side. Or you can do other tricks like your enter key becomes your control key when you hold it down, or even shift if you're into that. The point here is that you make use of enough layers which you know from phone usage that you can squeeze all 105 keys into a keyboard with 56 keys or even one with 42 keys the third event is code sharing so anyone who's been programming longer than github has been around knows how difficult it used to be to share code this does not include me because when i learned to program github was there i signed up right away but you only have to go back 11 years to 2008 when github was founded to have this So using the power of Git and the internet, a lot of code found a single home and it became easier to share. So the ease at which open source projects are created and collaborated has a lot of projects like QMK to come into being. This allows you to configure your own keyboard and flash it onto the microprocessor. If you want to double tap the spacebar and have it act as delete, you can do that. You can have the numbers on a layer and have them under the home row so you move your hands less. or you can make your number pad into a macro keypad that outputs strings like class or def or other things you use most. This is part of the configuration file. This is what a keyboard layout looks like. Sadly for us, trailing commas are not allowed. But essentially, it's just the top is the comment and the bottom is actually the key commands. QMK has amazing documentation. So this is actually pretty great to use. So now we come to the present. When I was building my Pyboard-based keyboard, I thought I'd program the keyboard myself, but being a Django developer, it was a bit out of my reach. But as with most projects on the internet, I found a GitHub repository. User mcameron had actually written it for me. So I got to building it. I was reflashing the Pyboard, but there's no debugger for input devices, so I ended up having to read the code, understand the code, fork the code, adapt the code, because my diodes were in the wrong direction, so sending electricity wrong way around. Eventually, I got it to work, and there's no time for a live demo right now, but it actually does type. Okay, there's a few libraries in the keyboard world it that use Python. The first one is actually a GitHub library that has these mini PCBs that you can break off and create your own custom layout. The first library down here, PyKeyb, allows you to create your own open CAD file for a keyboard layout. So whatever you can imagine, you can program with Python. The one on the bottom, KMK Firmware, is going to be the firmware for my next keyboard and it uses pure python um it's similar to qmk in its power um and only supports the um the feather m4 so i'm going to get one of those um how to get started on your own build there are certain resources that i recommend the top one is uh the reddit the subreddit olkb which stands for ortholinear keyboards and they are basically the support forum for qmk um mechanical keyboards and ergo mech keyboards on Reddit are also good to have ideas. And the number one question that I got at DjangoCon this year when I started using my keyboard, everyone came over to me and they said, where can I buy all these parts? These are four vendors that I've actually used in Europe that I know are reliable. If you do end up building your own, you can send me a message on Twitter. I'm at MrRios. I just tap, tap, tap it through your telegraph and have the little blue bird whisk it over to me thank you do we have any questions could you just pull one slide back so I can take a picture good question great talk do you remember how How long it took you to be efficient with the ColorMark layout? I believe it took me about a month to get maybe two-thirds up to speed to where I was. I didn't have a typing job where I typed a lot, but it was a significant issue. Because I had done two weeks of Dvorak beforehand, it was much easier to transition to Colmac and not have to go back to QWERTY, because then it was something else that was new. I had my Ctrl-Q, Ctrl-W back. So for me, that increased efficiency. I mean, I don't recommend taking this path of doing Dvorak and then Comac. Hey, thanks a lot. Loved it. You might have seen that coming. Do you have any tips to Vim on Comac? Unfortunately not. I actually am a Vim user on Comac, and you have the HJKL keys on the left side of the middle column. So you're essentially using your index finger for Vim on Cormac. And I actually have special keycaps for it. But aside from that, I really wouldn't mess with the Vim internals. Maybe I'm not advanced enough, or maybe I don't mind just using one finger to navigate in Vim. Oh, and I actually have a layer that if I press the layer, these actually become arrow keys as well. um there is a an intermediate step between like uh having a like different uh layout and building your own keyboard which is like building your own uh layout programmatically yeah have you have you ever messed with uh for example in linux like a x keyboard uh config and this kind of I have not, not in the sense that I've done my own layout. Actually, that's not fully true. I did a version of Comac for German keyboards. You can find it under my GitHub, github.com slash MrRios, like my Twitter handle. And I had to use XKB in order to map an existing QWERTY keyboard into Comac. So I have some experience with that. I can send you the link to that. But aside from that, I haven't gone that deep down the rabbit hole. Do we have any more? One more for me. What layout or any other type of improvement do you find most productive for you as a developer? Oh, no. I thought I'd covered it all. Now, one of the things that I have not got around to that I really want to try is tenting. So, if you look at Cromer's studies, his keyboards, he did, I believe it's called ulnar deviation, in which you have the keyboard like this, all the way up to like this. Oh, no, not like that. Like this to like this. And one of the things that exists is called tenting, in which you actually have your keyboard at a 15-degree angle, which is supposed to mimic the angle of the hand at rest. so this is another thing that I would look into thank you thank you