Hoptype
Screen font for iPad applications for children
Screen font for iPad applications for children
Hoptype is a screen font I designed during Ala ma font(a) workshop in Katowice. The workshop was led by Martin Majoor, Filip Blažek, Marian Misiak, Eben Sorkin and Ann Bessemans and curated by Ewa Satalecka. The typeface is designed especially for iPad applications for children who are not yet fluent readers.
Initial research into interactive books on the iPad showed that design factors I had to consider were:
• the amount of words per line, the length of lines and the amount of lines per page
• the resolution, which is much lower than printed text
• change of direction. With mobile devices, there is a possibility of switching the view from horizontal to vertical by rotating the device. The size of the text changes, so that provides an additional challenge
• harmony of image and text. Since applications use full screen imagery, text must work on a colored background
Initial research into interactive books on the iPad showed that design factors I had to consider were:
• the amount of words per line, the length of lines and the amount of lines per page
• the resolution, which is much lower than printed text
• change of direction. With mobile devices, there is a possibility of switching the view from horizontal to vertical by rotating the device. The size of the text changes, so that provides an additional challenge
• harmony of image and text. Since applications use full screen imagery, text must work on a colored background
The main part of the design process based on Sue Walker’s research (2005) from Reading University showed that it is not the individual typeface design which makes text legible or readable, but the way it is used, that is in its line length, word spacing and line spacing.
An important part of my design research was to focus on the emotional aspect of text in children stories. Therefore, it would be useful to try and create a typeface that combined a legible serif with an emotional character set, to emphasize sounds and emotions.
Inspired by comic books I found, that they rarely contained onomatopoeic words of more than 4 letters and that the only consideration for creating onomatopoeic glyphs, was composition and space available within the frames.
An important part of my design research was to focus on the emotional aspect of text in children stories. Therefore, it would be useful to try and create a typeface that combined a legible serif with an emotional character set, to emphasize sounds and emotions.
Inspired by comic books I found, that they rarely contained onomatopoeic words of more than 4 letters and that the only consideration for creating onomatopoeic glyphs, was composition and space available within the frames.
I tried to develop a universal, digital form that would work with any imagery. This led me to the possibility of developing an OpenType contextual algorithm, that would make the letters hop.
It would then be possible to enhance the reading experience through play by linking sound and text, creating the use of a “hopping” style through the touch screen.
It would then be possible to enhance the reading experience through play by linking sound and text, creating the use of a “hopping” style through the touch screen.
Special character set was designed to make text more dynamic and to emphasize sounds and emotions in books for kids
The result was a typeface with ascenders much higher than the descenders. This makes the designer consider the use of leading in a body of text, creating more white space, which improves legibility and readability. The space between the base line and the height of the ascender is the space where the additional base line for the slanting, hopping letters are set. The slant adds a dynamic element to the text and allows it to function with changing base line heights. The typeface also has easily recognizable, wide serifs, based on simple geometric forms, which help to create a horizontal flow to letters, supporting the reading process, even in small sizes, rendered on a screen.
Ascenders in Hoptype are much higher than descenders, creating more white space when setting text and improving legibility
Hoptype test screen
