Vladimir Khokhlov shares Lit­tle Voice’s ap­proach for de­liv­er­ing ac­ces­si­ble type across mul­ti­ple de­vices

net magazine - - CONTENTS - Khokhlov is cre­ative di­rec­tor and founder of UX/UI de­sign firm, Lit­tle Voice. Find out more about the com­pany’s work at: lit­tlevoice.io

Vladimir Khokhlov dis­cusses de­liv­er­ing ac­ces­si­ble type across mul­ti­ple de­vices

Ty­pog­ra­phy has to be ac­ces­si­ble and con­sis­tent, re­gard­less of what plat­form or de­vice it is viewed on. Of­fice print­ers, smart-home dis­plays and smart watches are viewed within dif­fer­ent con­texts and from dif­fer­ent dis­tances. Fur­ther­more, the phys­i­cal size of the ren­dered font de­pends on the font met­rics. This means Roboto will be dif­fer­ent in size to Avenir, even when both are set to the same point size. To com­pli­cate mat­ters, the same font will dif­fer in size de­pend­ing on the ren­der­ing engine.

Lit­tle Voice be­lieves ac­ces­si­bil­ity needs to go be­yond guide­lines and con­sider how the user ends up see­ing some­thing. This said, we strug­gled to de­ter­mine what font size was best for read­abil­ity. So, we drew on sci­en­tific re­search pub­lished in 2011 by G Legge and C Bigelow ( https://netm.ag/2zk29yc).

The Legge-Bigelow study, Does Print Size Mat­ter for Read­ing? A Re­view of Find­ings from Vi­sion Sci­ence and Ty­pog­ra­phy found re­stric­tions to the range of font sizes that of­fer op­ti­mal read­abil­ity. It ar­gued that to be ac­cu­rate in mea­sur­ing font size, you have to con­sider the an­gu­lar size in de­grees (pro­jected im­age size at the eye retina) and how it is con­tin­gent on the phys­i­cal size of type and view­ing dis­tance. An ap­prox­i­mate con­ver­sion is as fol­lows: an­gu­lar size in de­grees = 57.3 × phys­i­cal size ∕/ view­ing dis­tance.

We com­bined the re­search with the con­text and dis­tance users in­ter­act with de­vices. A user is three me­tres away from a TV, 65cm away from a mon­i­tor, 45cm away from a lap­top, 30cm away from a mo­bile phone and 18cm away from a watch. This led us to a dis­tinct ap­proach to defin­ing a font size in the UI.

We iden­tify a range in the view­ing dis­tance by the user and cal­cu­late the phys­i­cal di­men­sions of the font based on view­ing dis­tance and the an­gu­lar size for op­ti­mal read­ing speed. The phys­i­cal size can be cal­cu­lated as: phys­i­cal size = view­ing dis­tance × an­gu­lar size / 57.3. Once we have the de­sired phys­i­cal size range, we mea­sure the ren­dered font used on the par­tic­u­lar de­vice to find the cor­re­spond­ing point sizes to be used in the UI soft­ware code.

The sci­ence and the method en­ables Lit­tle Voice to choose the right font size and avoid the pit­fall of de­sign­ing for ac­ces­si­bil­ity in two di­men­sions.

Newspapers in English

Newspapers from Australia

© PressReader. All rights reserved.