
Experiments in Code Typography (2014) - Flenser
http://research.microsoft.com/en-us/projects/liveprogramming/typography.aspx
======
asolove
This is an interesting topic and glad to see someone experimenting. I spent
some time on code typography a few years ago and wish I could have spent more
time on it. I like a lot of these ideas and hope we will see both structured
editing and structure-informed reading be more popular.

That said: this project could benefit from working with an actual typographer.
Even people who agree with the principles of these ideas will likely revolt at
the examples shown and think it's because the ideas are bad.

There is tons of purely optical tuning that could be done to make the snippets
look better. The leading needs to be increased if the horizontal spaces are
going to be so wide. The parenthesis should be centered around lowercase
letters, kerned more loosely, and made thinner at the curves. Many of the
operators and special characters could also benefit from a programming-
specific take. Typographic detail might also suggest other opportunities: for
example, spaces between items in a list might be made wider than those of sub
expressions within each item.

In my work I started by laying out the results I wanted in TeX, giving tons of
power over small typographical details, and it paid off. Even though some of
the ideas were duds, the presentation was aesthetically pleasing enoug that
many people were willing to try it.

~~~
ansgri
Can you show your work? Advanced LaTeX code typography is a very interesting
topic, especially for writing programming textbooks.

~~~
mgr86
I'm geuninely curious, is this how these books are typeset?

I was at a conference a few years back and one of my favorite presentations
was a guy from O'Riely. Up to that point most of their works were converted
from docbook with XSLT to pdf,epub, or html. He had been working on
HTMLBook[1] to write books in asciidoc, convert to (x)HTML5 and the
conversions were written in CSS and used an antenna house processor.

It was an XML conference, so all things latex was a bit taboo. But in general,
we handle a lot of XML in publishing.

[1] :
[https://github.com/oreillymedia/HTMLBook](https://github.com/oreillymedia/HTMLBook)

------
munificent
I really think it's awesome that Sean is experimenting here and there's lots
of good ideas. I disagree with one idea here, which I've also seen advocated
in places like the Hasklig font.

One of the first things that many people who get into code typography try to
"fix" is using the "real" mathematical symbols for the various operators that
programming languages represent in ASCII. Using × instead of `star` (ugh, no
way to escape an asterisk in HN's shitty markup format), ÷ instead of /, etc.

This is based on the assumption that the math notation is superior. Maybe
because it's older? Maybe because it's used in mathematical papers and texts?
Maybe because they assume readers are more familiar with that, or maybe new
programmers? Maybe just because of the general cachet of "correctness" that
math carries with it[1].

I'm not sure why, but either way, I disagree with this assumption. I do admit
that a new programmer has likely seen more × than `star`, but I think that's a
small hurdle. Certainly, at this point in _my_ life, I've seen != a hell of a
lot more often than I've seen ≠. != _is_ the canonical symbol for "not equals"
in my mind.

Sticking with the ASCII representation does have one real thing going for it:
it visually represents the way you type it. If I was a brand new programmer
coming to a program using Sean's UI, I might be able to _read_ the ≥· a little
more easily (though the dot would confuse me), but I wouldn't know how to
_produce_ it.

[1]: [https://xkcd.com/435/](https://xkcd.com/435/)

~~~
throwaway999888
You're right that "it's more like math" is a vapid argument by itself.
Personally, `star` versus (×) feels like a wash, in particular. Most of the
multiplication I've done by hand has been with a dot (•) and not a `star` or
(×), anyway.

The most compelling case for "looking like math" is when the ASCII
representation is clearly imitating something that could be rendered in a more
pleasant and smooth manner. Like a plain arrow (->).

> Sticking with the ASCII representation does have one real thing going for
> it: it visually represents the way you type it.

Which is why we should have easy ways to switch between views of code. There
might be views which are hard to translate between, but typography seems to be
one of the most low-hanging fruit.

~~~
noblethrasher
"Looking more like math" is not so vapid. As Leslie Lamport says, programming
is hard because thinking is hard. Fortunately, we long ago invented and mostly
debugged something to make thinking easier: _Mathematics_. But, it turns that
not only is mathematics a great tool for thinking, it's arguably the _best_
such tool we've invented so far.

The people that object to making programming look more like math seem to think
that the goal is to make programming serve mathematics, but the actual result
is that (just as with physics) math ends up in better service to programming.

~~~
throwaway999888
> "Looking more like math" is not so vapid.

Looking more like math _in itself_ is vapid. Sure, you can make cases for why
looking like math is good. But by itself it's vapid.

> Fortunately, we long ago invented and mostly debugged something to make
> thinking easier: Mathematics. B

Don't conflate mathematical notation with math itself. The great thing about
mathematics are the analytical insights, not how those insights are written
down.

Is it really the case that we "invented and mostly debugged something to make
thinking easier" in the _notational sense_? Math notation, like most notation,
seems as arbitrary as any other invented notation. Was there really some
rigour behind it which you can use to claim that it makes "thinking easier"?
The question itself of "making thinking easier" through notation is beyond the
scope of mathematics. But there are of course interdisciplinary
mathematicians.

~~~
Senji
Math notation is all over the damned place. It's like certain areas of math
are allergic to standardized notation or minimization of complexity.
Parameters to "functions" go after the function name, or in subscripts,
superscripts, in positional slots around symbols like Σ.

Lets not even go to the annoying tendency to use single letter variable names.

------
FBT
> Unlike Python, short one line blocks can be expressed after the colon as a
> form of syntactic brevity

The author might not be aware of it, but Python does actually have this syntax
feature, for this exact purpose.

------
r0muald
Some of these ideas are implemented in fonts like Fira Code
[https://github.com/tonsky/FiraCode/](https://github.com/tonsky/FiraCode/) and
Hasklig [https://github.com/i-tu/Hasklig](https://github.com/i-tu/Hasklig)
e.g. typing => gives ⇒

Both should be well known to HN readers.

~~~
mej10
PragmataPro has ligatures -- it is a great typeface for Haskell and Agda (in
general as well, but especially those!)
[http://www.fsd.it/fonts/pragmatapro.htm](http://www.fsd.it/fonts/pragmatapro.htm)

It isn't free, but it is very well designed and appeals to my sense of
aesthetic. Well worth the money.

~~~
WorldMaker
Apologies for the side rant, but wow, that seems way too condensed for my
tastes. One of my few complaints with FiraCode is a feel like its too
condensed (and compensate by upping it a point over what I tend to keep
Consolas at).

It's kind of surprising to me that in this day and age of 4k monitors with
crazy large dpi that Condensed is still a selling point for code fonts. As
cool as a matrix green screen full of inscrutable characters looks in film,
we've got modern tools to organize and navigate source files and can actually
afford whitespace these days. We no longer have to optimize for volumes of
code per screen and most of us are no longer paid by line of code, we can work
smarter than that.

~~~
OniBait
No need to apologize, I had the same reaction. Would be nice to have a version
of Consolas with ligatures though.

------
Isamu
Note the use of sidebars to indicate nesting without wasting much horizontal
space.

HN mobile devs, please take note! I like what you've done thus far to keep the
mobile view compact, but it is hard to see the indentation. Sidebars may help,
if kept grey and not too intrusive.

------
gioele
The Fortess programming language [1] was a Fortran successor (with a bit of
APL influence) that was meant from the beginning to be seen through a
"syntactic stylesheet", so that one would see and operate at the level of
mathematical operations and not with the ASCII source code. [2]

[1]
[https://en.wikipedia.org/wiki/Fortress_%28programming_langua...](https://en.wikipedia.org/wiki/Fortress_%28programming_language%29)
[2] [https://software.intel.com/en-us/articles/first-
impressions-...](https://software.intel.com/en-us/articles/first-impressions-
of-the-fortress-language)

------
mcphage
Having a pop-up that displays an error "not found" as soon as you start
typing—making it look like you made a mistake before you've even finishing
doing what you're doing, looks really annoying. You'd constantly see these
little red alerts appearing and disappearing below where you type.

------
ursus_bonum
I've been writing C code kind of like this using* Vim's "conceal" feature for
years. E.g. [http://superjer.com/lies/unicode-code-code-
code.png](http://superjer.com/lies/unicode-code-code-code.png)

I would NOT go back.

This, however, seems like a bit much.

*abusing

