Why are keyboards built the way they are?

Most of us use computers on a daily basis. We are so used to them we take almost everything around them for granted. Even the shape of the keyboard.

Damn, we are so familiar with this shape we even use this keyboard on smartphones! The younger ones do not even know where this shape comes from (some of them are curious enough to wonder).

How was the QWERTY layout (and all others) created? And why are the columns shifted from a row to the next?

Continue reading Why are keyboards built the way they are?

Simple script to minify web resources

A couple of years ago, I blogged about a way to minify HTML with sed. Now, I streamlined this in a script.

How it works

The script will copy the original directory (or single file) and leave it untouched, while removing any useless space and comments from any .htm, .html, .php, .css and .js file in the copy.

Running the script

Easy one:

If the target already exists, it will be removed first (you will need to confirm).

The code

The basics

Much is transparent or commented. The minification is the only really interesting part. So let’s go at it!

The minification

I used the trick I wrote about yesterday.

Basically, the minification is all done here:

This code is commented and should not require more than is already said.

Now, the essential enhancement I made since the sed era is the removal of all comments and correction of my code to remove all new lines.

I abandoned sed and went to Perl because sed does not support the non-greedy operator, which greatly simplified my work when removing delimited patterns (typically multiline comments).

Getting the full script

It is available on Github. Don’t hesitate to fork and make it better.

Note: the competition

There is none: this is not a tool I would recommend in production environment (for lack of test, for instance).

Why this script is good

It is a quick fix for simple and mostly static websites. It removes potentially sensitive information (many website have their .git repository deployed, containing everything in it, and comments can be a source of leak too, be it only be advertising the technology behind the scenes).

Why this script is bad

And yet, many tools were specifically designed for this purpose. See Grunt or Gulp plugins for JavaScript projects, or wro4j for Java projects. I imagine tools exist also for ASP or PHP projects.

I needed something working quickly and without effort. This is it.

Combine it

You can use it on your server to automatically deploy the latest version of your website. Imagine:

How to make a regex pattern that matches except if…

Short answer

We will take an example: match all /* ... */-type comments except when in string (in our example: JavaScript, so both single and double quotes will have to be excluded).

  1. Write the regex for what you want to match (later called m; our example: /\*.*?\*/1).
  2. Write the regular expressions for matching your exclusions (later called e1, e2, e3; our example: '[^']+' and "[^"]+").

Regex #1

  1. Write your final regex: e1|e2|(m) (our example: '[^']+'|"[^"]+"|(/\*.*?\*/)).
  2. Match group 1 instead of matching group 0.

Note: This requires code to parse the result. If you need something simple (sed? Which you would replace with a Perl command? Or just something you can use with match), see below.

Regex #2: alternative for Perl and PCRE (PHP)

  1. Write your final regex: (?:e1|e2)(*SKIP)(?!)|m (our example: (?:'[^']+'|"[^"]+")(*SKIP)(?!)|/\*.*?\*/).
  2. Match group 0 as usual.

Note: You can execute this expression as a Perl command: perl -pe '(?:\'[^\']+\'|"[^"]+")(*SKIP)(?!)|/\*.*?\*/'

You can test the regex and have it explained at this link.

Something more detailed

Continue reading How to make a regex pattern that matches except if…

A new logo for KeyboardPlaying

I’ve been meaning to do this for a long time and now the time has come: KeyboardPlaying has a new logo. Which means it will soon have a new website too.

You can find it on Github. Fork if you have any way to make it better (either better looking or just a better construction of the SVG).

Now, this lays the foundations of the future graphical style of the website. The colors were inspired from the Material Design Lite, which I’ll use for the next version of the homepage. It is also flat as I like the current trend to minimalism and flatness. I find it much more soothing than all the fashion of imitating reality, making things 3D like with shadows and so on (though I loved it in that time too, but I was a bit younger; time to be an adult… Or maybe not totally).

No, for the website, just a bit of patience, please.

Publishing the v2.0 of my Excel timesheet

The origins

Why, oh why?

I am a consultant developer. This means I move from client to client and share their time constraints. This includes deadlines, but also work time.

It so happens that some clients have a time clock, like in the old days.

Time clock in the Museum at Wookey Hole Caves (Source: Wikimedia)
Some have these time clocks…
Electronic clocking terminal (Source: Wikimedia, February 2009)
… but this is more likely.

My problem is: while most of my client’s employees can see what the clock stores, I, as an extern, cannot. I do not like to be blind, so each time I am in this situation, like many people I know, I make an Excel sheet where I log my check-ins and -outs.

Sharing my timesheet…

On my latest mission, we were several on the team from the same company. I spent some days without my usual timesheet and when I grew tired, I sent my first basic version, with some conditional formatting, to all members there.

Since they did not seem very interested if I asked whether something standard was available, I did not expect much. But instead, I quickly got some feedback: they asked new features, signalled some bugs, …

The team grew, the requests followed. The possibilities of the timesheet were ever greater, and therefore so was its complexity.

… with the whole world

Finally, using e-mails to track the feedback and release the changelog and user manual became too heavy. I thought of a bug tracker. This led me to create a Github repository. The wiki would come in handy for the user manual too.

Thus the work on version 2, which should make the sheet less specific to our context and more widely usable, began.

And now version 2.0 is here!.

The construct

Choosing the format for storing revisions of the timesheet

The choice of using Excel for the timesheet comes with a consequence: the file we edit is a binary. We know one thing about GIT (and most RCSs) is that it is not that efficient with binaries.

But we also know that a .xlsx file is just a zip of XML files, so we chose to save it as the exploded version of the .zip file.

The only thing we lacked was a way to easily switch to and fro between both forms.

Searching for the tool

I ambitioned at having one script that could be used with an argument to do this. It is easy in Unix. I even found a solution using PowerShell for Windows. But this required to maintain two scripts.

I looked at the build tools I know and some I did not: Maven, Gradle, CMake, …

But all these are oriented towards a specific technology and all of them require to install something on your computer.

Making the tool…

I am a developer after all, and this is within my area. So I went for an executable .jar. Only thing you need to have on your computer? An up-to-date version of Java.

And I came up with a basic Swing interface.

The construct
The construct

It may not look like much, but it does the job…

… and enhancing it

… and it will do more.

Do not hesitate to head over to the repository and fork it to tailor it to your own needs or make this one better.

In the end, it will make developing the xls-time-tracker timesheet and managing its versions easier.

Just wait and see…

Monoid is a perfect font for coders

When you are a coder, you use a monospaced font. But finding one easy on the eyes is not that easy.

Andreas Larsen did his best to find a solution and he has come with something pretty interesting. In a few keywords, it is clean, sharp, a bit geeky, …

With more words:

  • It does not have Courier’s serifs.
  • Every character is easily recognizable. In Java for instance, you need to be able to distinguish without mistake an o from an O or a 0, or an l from a 1. After all, 42l and 421 are not the same thing at all. Riddles are based on this single possible confusion.
  • The character spacing is smaller than the usual, allowing to see more on your screen when you have long code lines (which I do not recommend though).
  • It’s Open Source and alive, with a Github project, issues and therefore the chance for the people who use it to make it better over time.
  • Purely geeky: it comes with funny ligatures. Take a look at the HTML comments in the sample below.
  • Edit (2015-08-01): The authors have integrated FontAwesome as ligatures into a variant of Monoid called Monoisome. Useful when you develop web projects with FontAwesome.
  • Tailored to your preferences: you can download it with different line height, character spacing, with or without ligatures, …
Monoid, HTML sample
Monoid, HTML sample

This takes the place of Ubuntu Mono as my favorite monospace font for coding. Way to go, Monoid!

Go to the Monoid website to download it.

Source: Found via Lifehacker

Sonder: a customizable keyboard with e-ink keys

Remember the Optimus, right? A keyboard with a screen for each key, thus allowing for full customization, changing layout, displaying icons, and so on. But in the end, it never got out. Only ever-delayed.

The concurrence may finally be out: an Australian company answers to the Russian concept with something similar, using e-Ink instead of more traditional screens.

Some shortcut configurations on a Sonder keyboard
Some shortcut configurations on a Sonder keyboard

Backlit, customizable, … Just fine…

I wanted an adapter in order to use always the same keyboard (thought of a Das Keyboard or a Code keyboard when they make them as AZERTY), but this could be an alternative solution too.

(via Clubic [FR])

Use StringBuilder, not StringBuffer

Java comes with two similar utilities called StringBuffer and StringBuilder. The latter was introduced in Java 5 and here is what the API doc says about it:

[StringBuilder] provides an API compatible with StringBuffer, but with no guarantee of synchronization. This class is designed for use as a drop-in replacement for StringBuffer in places where the string buffer was being used by a single thread (as is generally the case). Where possible, it is recommended that this class be used in preference to StringBuffer as it will be faster under most implementations.

So, in a nutshell: StringBuilder is a non-synchronized StringBuffer (and is, as a consequence, faster). When does it make sense to use a StringBuffer therefore? The only case I see is when your buffer is a field of a class used by several threads. I must admit I do not see this case.

I often see a StringBuffer created inside a method which will return a String, or passed as a parameter to a method, and my first reflex is to change it for a StringBuilder.

Trivia

Did you know that when you write:

Your compiler replaces it with something like:

If you did not, well, now you know how to optimize your code regarding to String construction: append all in one time or manage the StringBuilder yourself to avoid creating and releasing many instances, which leads to poor performances.

Image courtesy from Alcibiade (CC-Attribution 4.0)

Idea for a keyboard adapter

The case

Keyboard layouts are numerous. Some time ago, friends of mine tried to persuade me to settle for a Dvorak layout. They proposed the BÉPO, though the programmer Dvorak would be more adapted to my professional life.

The idea was attractive. I never settled, though. Why, do you ask? The answer is simple: to be efficient on a keyboard, you need to know its layout by heart and be able to blind-type. This comes naturally after some practice.

However, switching to a keyboard layout has a learning curve. I would not mind if I were able to use the same layout everywhere, but when at work, I must comply with the hardware and rules (“Do not change the configuration of your machine! Get accustomed to your keyboard.”). And sometimes the access restrictions too (“Your rights are not sufficient to configure your clock.”).

In my not-so-long career, I have already had to use several variants of AZERTY and QWERTZ. I sometimes guess type on the Alcibiade‘s laptop, which is an AZERTY configured in international QWERTY. And then I come home and meet yet another variant of AZERTY.

How then to go and try to learn yet another layout?

One time when confronted with a QWERTZ and the explicit order not to change my configuration (as it could mess things up if they ever needed to remote control my machine), I imagined something.

Continue reading Idea for a keyboard adapter

Some thoughts on UX

A year ago, our company tried to put up a team specialized in UX — we dubbed ourselves the UX Avengers, hence the illustration for the post — and wanted its members to trigger some awareness in other developers about the associated issues. This post is translated from the introduction I wrote for the first newsletter we sent.

What is UX?

This notion is sometimes blurry and often confused with UI. UX is the short for User eXperience. According to Wikipedia and the ISO 9241-210 standard, it is “a person’s perceptions and responses that result from the use or anticipated use of a product, system or service”. The name defines the notion.

Obviously, better the experience is, better are the satisfaction and acceptance of the application.

What should you focus on to make your app’s UX better?

The interface

There is a reason UI and UX are so easily confused: the interface is the only thing the user perceives of the application (the look-and-feel). He might be more willing to spend some time on a sober and aesthetically pleasing screen than on a colorful and overloaded screen.

Dilbert designed a UI

The ergonomics

We just spoke about it, though you may have failed to realize it: a screen, as beautiful as it is, cannot be crowded with controls. Your application must be easy to apprehend and understand if it is to capture the users. It is the biggest secret of some well-known companies…

Simplicity

The technology

Even if you have the vision, you need the tools to make it concrete, preferably in an elegant way. The arsenal at your disposal is very wide and evolves rapidly. One of the purposes of this newsletter is to allow you to keep in touch with the latest evolutions.

Resources

Images

Others