By Brandon Johnson
A dyslexia awareness toolkit to provide a visual way to understand dyslexia, helping parents and educators gain a better understanding of dyslexia.
by Brandon Johnson
Filed Under:

The idea that people with dyslexia aren’t able to read is common a thought. Truth is they see the same things as you. They just read it differently. This can be hard for those who don’t have dyslexia to understand because they don’t see or experience these things.


That’s where my project comes in.

Dysoptic is a dyslexia awareness toolkit that provides a visual way to understand dyslexia.


So why is this important?

A lot of the research out there tends to be huge amounts of text-based information. These types of information are large documents or books that are text-heavy and no visuals. That’s a problem for those who are visual learners and people with dyslexia. Often times depending on the person, a large amount of text is intimidating, which leads to not reading.

That’s the goal of my project, to create this visual way of learning, targeting parents, homeschooling families, and educators.



When it came to the branding, I wanted my mark to represent both the letters b and d since those two are some of the most common letters to be flipped. The stationary logo is the in-between of the two letters.

As for my color palette, I wanted to keep it simple and not overwhelming. I choose the color blue as my primary color because in color theory, often, the color blue is referred to as a trustworthy color. My goal is to have parents and educators feel as if they can trust what I’ve created. Within my branding system, I introduced a pattern that’s based on my mark. The pattern can lead to some interesting texturing within the material I produced.


Branding of logo


Dysoptic zine

Yes, I know, a zine is a more text-based. However, I felt that it was important to include a zine within the toolkit. It’s a simplistic way to understand what dyslexia is, the history, and why, at least in my opinion, it’s not a disability. As you read the zine, it starts to get a little more chaotic, along with small spelling mistakes that are done on purpose. This helps give the reader a visual of what it’s like to have dyslexia. While still making sense and being easy to read and understand.



Dysoptic Poster

Dysoptic PosterI wanted to create a poster that could help promote the toolkit. I portrayed dyslexia as a positive thing rather than a negative thing to put a more uplifting approach to this. A lot of times, dyslexia can be shown as a bad thing and not talked about. In reality, it’s much more positive; it’s just a different way of thinking and reading. I illustrated the word dyslexia so that it looks like it’s vibrating. Which in some people with dyslexia, when reading fast words can seem as if they have wings or are vibrating, which makes it hard to read. So I tried to mimic that idea within this poster. Ideally, this poster would be hung up in schools and classrooms to help promote and spread the word. In the future, more advertisements could be made to promote dysoptic more.

Dyoptic Poster on wall


Visual Learning Worksheets

Visual Worksheet still

The Visual worksheets are the part of the project that shows off what I was trying to achieve from the start, creating a visual way to learn. I created four worksheets so far that represent different types of dyslexia. Each one has a different animation that plays, demonstrating the kind of dyslexia I am trying to show. The four types of I did are phonological, rapid naming, surface, and letter reversal dyslexia. I had a hard time getting the worksheets right in their design. The visual hierarchy was hard to follow, and a bit all over the place. After a while, I changed the way I was trying to lay it out. I was able to get it to work together a lot better as a whole.


Phonological Dyslexia

For this worksheet, I chose the word photograph because photograph uses the PH twice to make the F sound. The sound that letter F makes can be represented in 3 different ways; F, Ph, and Gh. I wanted to create this animation to be like a jackpot slot machine where the different symbol animations would juggle around until it matched with the correct spelling of photograph.

Phonological Dyslexia Animation


Rapid Naming Dyslexia

For this worksheet, I wanted to replicate the idea of reading too fast and forgetting what was just read or skipping over words. With rapid naming, this is a very common effect. I took a block of text and had it vanish certain words or skip some, as the words were displaying. This helps give off that effect. Then once the paragraph is finished, after a few seconds, the missing pieces fade back into frame so we can see what was missed—causing the viewer to reread it to understand what had happened.

Rapid Naming Dyslexia

Surface Dyslexia

For this worksheet, I decided to choose the word beautiful. For the longest time, I thought beautiful was four syllables and not 3. So I separated the u to make a fourth syllable. One of the first pronunciation rules I remember learning was that two ee’s make the sound e. So I changed the letter symbols to the double e’s. As the word tries to form back, ful can’t fit because there are too many letters. So then once it’s spelled correctly, it fits back to place. The most difficult part of this was trying to get the ful to make the bounce movement. It looks so simple. But it took forever to figure out how to get it to work properly.

Surface Dyslexia Animation

Letter Reversal Dyslexia

For this worksheet, I chose to use the letters, b,p,q, and d since they are some of the most commonly flipped letters with dyslexia. I wanted to show how these letters easily can morph into each other and how similar they are in their designs. At first, it wasn’t hard to morph the letters together as I did. However, the first version was very blocky and wasn’t all that smooth. It took me forever to figure out a way around this, but I was able to learn how to animate anchor points in after effects. Once that was figured out, I was able to move the points exactly how I wanted them to. I just had to get the timing right, and I was able to make the morphic effect look a lot more smooth and elegant, then it was originally.Letter Reversal Dyslexia Animation




Brandon Johnson was repsonsible for posting the content on this page. Any inqueries should be directed to the contact information listed above.