Zilin Deng
Info
I'm a design student at York/Sheridan Program in Design.
Passionate about creating awesome products and experiences!
Finding opportunities to inspire, educate, and delight.
Some of my hobbies include...
Curating Playlists, Marathon Running, Bouldering
Actively seeking new opportunities!
Interested in working together? Let's grab coffee!
Thanks for visiting my website! ✌

Ezra Mono

Designing a colour-blind accessible typeface
to assist colour empaired developers in the programming environment.

If your interested in viewing the Typeface Specimen website.
I've provided a link here

Background

The concept for this project stemmed from the countless hours I have spent coding. There would be moments where a missing comma has costed me hours, sifting through lines of code.

Based on research conducted by the National Eye Institution, roughly 8% of males and 0.5% of females have some form of color vision deficiency.

If I thought this experience was frustrating, How might developers with visual empairments distinguish between the different levels of hierarchy when colour is used to differentiate the syntax language?

Would adjusting the text editor colours be a sufficient solution?

Atom Development Environment

The Problem

The consequences of color coding as a means for distinguish the syntax of a programming language presents accessibility challenges for the colorblind.

Although text editor provide users with the affordance to adjust the color schemes, the cone cells in a colorblind user eyes restrict their vision to simply two or three hues, as oppose to the standard seven.

User Research & Typography Analysis

Colour produced for the screen environment is a result of light illuminating from the screen. Users prefer lighter typography displaying on dark backgrounds, because the opposite colour combination causing strains in the eyes from prolonged viewing.

Monospace vs. Proportional

Due to the non-proportional nature of monospaced typefaces, symbols and character will occupy the same amount of horizontal space in the glyph. Performance-wise, monospace introduces more breadth to the code on screen, whereas proportional typefaces will tend to compress content towards the left hand side of the editor.

Stroke Contrast

The outcome of lower display sizes affects legibility at further distances, several typographic features like the crossbar are barely noticeable, the letterform loses key features which hinder its ability to be distinguished amongst other characters.

X-Height

When comparing a handful of select typefaces across different styles (Monospace, San serif, Serif). The x-height proportion stood out at higher percentage ratios when compared to the other letterform components.

Counter Space

Another component that was unique to monospaced font’s were their wider counter openings, it appears as if this technical decision was deployed for increased visibility at smaller sizes or further distances.

Letter Variations

Although each character in a typeface shares the same identity, their are instances where being nearly identical can cause both legibility and readability issues. Here the Futura’s “a” has a style very similar to the “o” which can be quite deceiving under certain circumstances.

The Solution

The proposal of a workhorse monospaced typeface designed to assist users with color vision deficiency. The most distinguishable features of this typeface comes from the variations in each letterform. Combining the capabilities of Python Scripts + OTF, users typing in a specific string of characters into their text editors, will trigger the computer to output the alternative character sets.

Work in Progress

Typeface Design has taught me a lot about the practical application of Agile & SCRUM Methodologies, as oppose to the Waterfall Methodology traditional education is familiar with applying.

Testing & Feedback

After drawing out the initial design, I went directly to testing out the legibility of the letterform. Getting feedback directly from the results of doing has been beneficial to the design process, allowing me to make quick decisions, rather than procrastinate.

Typeface Specimen Website

Heading into the final, we were responsible for creating a typeface specimen to showcase our letterforms. I put together an interactive website which allows users to play around with the typeface, and highlight the important design decisions in my process.

If your interested in viewing the Typeface Specimen website.
I've provided a link here

Reflection

The process of designing a typeface has taught me a lot about the iterative workflow. Due to the scope of the project, I was only able to complete one weight of the typeface. Moving onwards, I would have continued to refine and iterate over the existing letterforms.

Although the outcome did not match my expectations, this project was a successful learning experience that offered a number of lessons and values that can be applied to my personal development.