Hi! I’m SimonSenior Product Designer

With our recent release of Quick Fractions people practice solving various maths operations with fractions. In schools students are taught to write fractions as vertical fractions. A vertical fractions uses a horizontal virgule (a fancy name for “slash”).

or as they’re known in typography circles “nut fractions”. This style of fraction makes them easier to read for students who are still learning how to read them. It also make it easier to transpose numerators and denominators when necessary. Outside of your old maths text books, you’ll often see this style of fractions used in ingredients section of recipes.

Diagonal (or vulgar) fractions on the other hand usually use a diagonal virgule. This style of fraction is more commonly used when the fraction is used in a sentence. The diagonal virgule allows the numerator and denominator to both sit closer to the baseline. The fraction then fits in nicely with the surrounding text and doesn’t unnecessarily draw attention to itself.

Many typefaces come with predefined fractions as part of their extended character set. These are predefined fractions and are necessarily limited. For an app like quick fractions they aren’t practical because we need to create arbitrary fractions on the fly.

OpenType has features which allow you to specify a fraction as three or more characters “17/32” and it will then be converted by the software setting the type in into the style of fraction you’re expecting. Unfortunately this is reliant on the support for these features specifically being added to the software you’re using. Setting mathematics isn’t particularly common so it is quite low on the priority list for many developers.

On the other people who really need to type set mathematics have been able to do so with LaTex for quite a long time which minimises demand.

On the web, MathML is supported by many browsers and CSS3 adds support for many OpenType features, however these again depend on the browser developers to add support. MathML is well supported in WebKit based browser, however CSS3 OpenType font features aren’t well supported yet.

https://www.typotheque.com/articles/opentype_features_in_web_browsers

Most of this isn’t particularly relevant for Quick Fractions because it isn’t a webpage. We have to rely on Apple supporting the font features of OpenType. Apparently good, difficult to access.

With Quick Fractions we ended up manually specifying the weights of for numerators, denominators and whole numbers to visually harmonise the layout.