Accessible Digital Book SEAD/UFES
Accessible Digital Book SEAD/UFES
Accessible Digital Book SEAD/UFES
Promoting inclusion in distance learning through accessible and user-centered solutions.
Promoting inclusion in distance learning through accessible and user-centered solutions.
Promoting inclusion in distance learning through accessible and user-centered solutions.
Team
Rafael Moraes Hilario
Edson Rufino de Souza
Paulo Serpa Ramos
Dara Morati Lopes
Maria Victoria Coutinho
Semiramis Louzada
Hellen Rodex
Year
2024
The Accessible Digital Book was developed by the Superintendence of Distance Education at the Federal University of Espírito Santo (UFES) to promote the accessibility of knowledge in the digital medium. Recently, this product was selected for the Inova EaD (CAPES) public notice, which aimed to disseminate innovative solutions to improve teaching and learning through an investment of R$ 2.5 million. With the approval in the public notice, we were able to improve the product, making it more accessible and functional for different specificities.
The Accessible Digital Book was developed by the Superintendence of Distance Education at the Federal University of Espírito Santo (UFES) to promote the accessibility of knowledge in the digital medium. Recently, this product was selected for the Inova EaD (CAPES) public notice, which aimed to disseminate innovative solutions to improve teaching and learning through an investment of R$ 2.5 million. With the approval in the public notice, we were able to improve the product, making it more accessible and functional for different specificities.
The Accessible Digital Book was developed by the Superintendence of Distance Education at the Federal University of Espírito Santo (UFES) to promote the accessibility of knowledge in the digital medium. Recently, this product was selected for the Inova EaD (CAPES) public notice, which aimed to disseminate innovative solutions to improve teaching and learning through an investment of R$ 2.5 million. With the approval in the public notice, we were able to improve the product, making it more accessible and functional for different specificities.
Research
Research
Research
Problem discovery
Before the project's approval in the public notice, I worked alongside the team to analyze and identify problems present in the digital book. To ensure a comprehensive survey of the issues faced by users, we performed:
Accessibility analyses: In this stage, we checked the contrast, legibility, and general usability of the book using tools like Wave and WebAim.
Exploratory interviews: In this stage, we interviewed the professionals responsible for the book's layout, using a semi-structured script.
From the accessibility analyses, we identified critical problems that impact the user experience. The identified problems were categorized as general and specific:
Before the project's approval in the public notice, I worked alongside the team to analyze and identify problems present in the digital book. To ensure a comprehensive survey of the issues faced by users, we performed:
Accessibility analyses: In this stage, we checked the contrast, legibility, and general usability of the book using tools like Wave and WebAim.
Exploratory interviews: In this stage, we interviewed the professionals responsible for the book's layout, using a semi-structured script.
From the accessibility analyses, we identified critical problems that impact the user experience. The identified problems were categorized as general and specific:
Before the project's approval in the public notice, I worked alongside the team to analyze and identify problems present in the digital book. To ensure a comprehensive survey of the issues faced by users, we performed:
Accessibility analyses: In this stage, we checked the contrast, legibility, and general usability of the book using tools like Wave and WebAim.
Exploratory interviews: In this stage, we interviewed the professionals responsible for the book's layout, using a semi-structured script.
From the accessibility analyses, we identified critical problems that impact the user experience. The identified problems were categorized as general and specific:
General Problems (users):
Reading start button:
Contrast: 3.55:1
Ideal contrast (WCAG): 4.5:1
Course Location:
Difficulty locating courses both before and after logging in.
Reading start button:
Contrast: 3.55:1
Ideal contrast (WCAG): 4.5:1
Table of Contents:
Inactive links were not directing users to the selected content.
Certificate:
Questions about how to download the certificate.
Table of Contents:
Inactive links were not directing users to the selected content.
CTA button font:
Size: 10px
Minimum size: 14px - 16px
CTA button font:
Size: 10px
Minimum size: 14px - 16px
CTA button font:
Size: 10px
Minimum size: 14px - 16px
Cream mode:
The contrast of this mode (for dyslexia) did not meet WCAG requirements.
Post-login Information:
Lack of clarity inside the platform (navigation, location, information).
Cream mode:
The contrast of this mode (for dyslexia) did not meet WCAG requirements.
Reading adjustment:
It did not have a minimum font size, so the maximum reduction led to the disappearance of the text.
Registration:
Technical problems during signup on the website (mobile and desktop).
Reading adjustment:
It did not have a minimum font size, so the maximum reduction led to the disappearance of the text.
Search bar:
The search presented different titles than those searched for in the search section.
Search bar:
The search presented different titles than those searched for in the search section.
Search bar:
The search presented different titles than those searched for in the search section.
Specific Problems (users):
Chemistry Book:
The CTA button was not loading correctly.
Course Location:
Difficulty locating courses both before and after logging in.
Chemistry Book:
The CTA button was not loading correctly.
Human Rights Book:
Standardization errors in different parts of the book.
Certificate:
Questions about how to download the certificate.
Human Rights Book:
Standardization errors in different parts of the book.
Human Rights Book:
Recurrent HTML errors on the book's pages.
CTA button font:
Size: 10px
Minimum size: 14px - 16px
Human Rights Book:
Recurrent HTML errors on the book's pages.
Problems - Interviews (layout designers):
Tables of Contents:
Incomplete, they did not display the sub-items adequately.
Course Location:
Difficulty locating courses both before and after logging in.
Tables of Contents:
Incomplete, they did not display the sub-items adequately.
Audio description:
Proved difficult in the context of tables and graphs.
Certificate:
Questions about how to download the certificate.
Audio description:
Proved difficult in the context of tables and graphs.
Images and tables:
Due to space restrictions, the images and tables were very small.
CTA button font:
Size: 10px
Minimum size: 14px - 16px
Images and tables:
Due to space restrictions, the images and tables were very small.
Pre-submission to the public notice
Some of the identified problems, especially those related to development, were solved before the submission to the public notice. In this context, the team's work was essential for the project's approval and the fundraising.
Some of the identified problems, especially those related to development, were solved before the submission to the public notice. In this context, the team's work was essential for the project's approval and the fundraising.
Some of the identified problems, especially those related to development, were solved before the submission to the public notice. In this context, the team's work was essential for the project's approval and the fundraising.
Improvement of the digital books
Improvement of the digital books
Improvement of the digital books
Among others, I proposed adjustments for three problems in the Book's Web Evaluation. For the first problem, concerning the "reading adjustment" button icon, I discussed the confusion generated by the icon that was being used and proposed rotating the existing icon as a solution. In addition, I suggested including a description on the icon and an adjustable bar that disappears as the page is scrolled.
For the second problem, regarding the contrast between the background and text on the search page, I proposed changes to the color palette to meet accessibility criteria. The original contrast was 2.26:1, and I suggested increasing it to 18.42:1 (#141414). Additionally, for the table of contents bar, which had a contrast of 1.18:1, I proposed an adjustment to at least 3.03:1 (#949494), meeting the WCAG criteria.
I also discussed defining standards for the number of characters per line and the limits for increasing and decreasing the font size in the reading adjustment mode. The number of characters per line on the desktop was over 100, and I suggested reducing it to 80 based on WCAG accessibility guidelines, adjusting the width to 683px, considering the font size used. On the mobile version, the 39 characters per line were already within the appropriate limits. As for the font size in the reading adjustment version, I proposed a maximum limit of 36 or 48, following WCAG guidelines, and a minimum reduction to 16. This change was necessary because, until then, it was possible to reduce the text to sizes like 8 and even 0, making reading unfeasible.
Among others, I proposed adjustments for three problems in the Book's Web Evaluation. For the first problem, concerning the "reading adjustment" button icon, I discussed the confusion generated by the icon that was being used and proposed rotating the existing icon as a solution. In addition, I suggested including a description on the icon and an adjustable bar that disappears as the page is scrolled.
For the second problem, regarding the contrast between the background and text on the search page, I proposed changes to the color palette to meet accessibility criteria. The original contrast was 2.26:1, and I suggested increasing it to 18.42:1 (#141414). Additionally, for the table of contents bar, which had a contrast of 1.18:1, I proposed an adjustment to at least 3.03:1 (#949494), meeting the WCAG criteria.
I also discussed defining standards for the number of characters per line and the limits for increasing and decreasing the font size in the reading adjustment mode. The number of characters per line on the desktop was over 100, and I suggested reducing it to 80 based on WCAG accessibility guidelines, adjusting the width to 683px, considering the font size used. On the mobile version, the 39 characters per line were already within the appropriate limits. As for the font size in the reading adjustment version, I proposed a maximum limit of 36 or 48, following WCAG guidelines, and a minimum reduction to 16. This change was necessary because, until then, it was possible to reduce the text to sizes like 8 and even 0, making reading unfeasible.
Among others, I proposed adjustments for three problems in the Book's Web Evaluation. For the first problem, concerning the "reading adjustment" button icon, I discussed the confusion generated by the icon that was being used and proposed rotating the existing icon as a solution. In addition, I suggested including a description on the icon and an adjustable bar that disappears as the page is scrolled.
For the second problem, regarding the contrast between the background and text on the search page, I proposed changes to the color palette to meet accessibility criteria. The original contrast was 2.26:1, and I suggested increasing it to 18.42:1 (#141414). Additionally, for the table of contents bar, which had a contrast of 1.18:1, I proposed an adjustment to at least 3.03:1 (#949494), meeting the WCAG criteria.
I also discussed defining standards for the number of characters per line and the limits for increasing and decreasing the font size in the reading adjustment mode. The number of characters per line on the desktop was over 100, and I suggested reducing it to 80 based on WCAG accessibility guidelines, adjusting the width to 683px, considering the font size used. On the mobile version, the 39 characters per line were already within the appropriate limits. As for the font size in the reading adjustment version, I proposed a maximum limit of 36 or 48, following WCAG guidelines, and a minimum reduction to 16. This change was necessary because, until then, it was possible to reduce the text to sizes like 8 and even 0, making reading unfeasible.
Next steps
Next steps
In the coming months, we will conduct moderated usability tests with the books that have already been properly altered, including not only the changes I proposed but also those made by the other team members. The tests will be carried out with a sample of 50 participants—5 for each disability and disorder profile—including visual impairments (with different degrees and specificities), dyslexia, ASD, and ADHD.
To structure the evaluation stage, we conducted a literature review on the best practices for conducting these tests with audiences that have different accessibility needs. This survey allowed us to identify essential guidelines, such as the importance of using clear and accessible language and prioritizing short, direct sentences.
Regarding the design and presentation of the materials used in the tests, we will adopt a clean layout, with legible fonts, adequate contrast, and a visual structure that facilitates navigation, avoiding elements that could cause confusion, such as excessive hyphenation or cross-references that hinder understanding. Based on these guidelines and the documented best practices, the tests will be planned in a way that ensures accessibility and improves the quality of the data collected in this research stage.
In the coming months, we will conduct moderated usability tests with the books that have already been properly altered, including not only the changes I proposed but also those made by the other team members. The tests will be carried out with a sample of 50 participants—5 for each disability and disorder profile—including visual impairments (with different degrees and specificities), dyslexia, ASD, and ADHD.
To structure the evaluation stage, we conducted a literature review on the best practices for conducting these tests with audiences that have different accessibility needs. This survey allowed us to identify essential guidelines, such as the importance of using clear and accessible language and prioritizing short, direct sentences.
Regarding the design and presentation of the materials used in the tests, we will adopt a clean layout, with legible fonts, adequate contrast, and a visual structure that facilitates navigation, avoiding elements that could cause confusion, such as excessive hyphenation or cross-references that hinder understanding. Based on these guidelines and the documented best practices, the tests will be planned in a way that ensures accessibility and improves the quality of the data collected in this research stage.
In the coming months, we will conduct moderated usability tests with the books that have already been properly altered, including not only the changes I proposed but also those made by the other team members. The tests will be carried out with a sample of 50 participants—5 for each disability and disorder profile—including visual impairments (with different degrees and specificities), dyslexia, ASD, and ADHD.
To structure the evaluation stage, we conducted a literature review on the best practices for conducting these tests with audiences that have different accessibility needs. This survey allowed us to identify essential guidelines, such as the importance of using clear and accessible language and prioritizing short, direct sentences.
Regarding the design and presentation of the materials used in the tests, we will adopt a clean layout, with legible fonts, adequate contrast, and a visual structure that facilitates navigation, avoiding elements that could cause confusion, such as excessive hyphenation or cross-references that hinder understanding. Based on these guidelines and the documented best practices, the tests will be planned in a way that ensures accessibility and improves the quality of the data collected in this research stage.
Rafael Moraes © 2025. All rights reserved.
Interested in what you saw?
Let's start a conversation!
Fill out the form below. If you prefer, send me an email: rafaelmoraes2611@gmail.com
Interested in what you saw?
Interested in what you saw?
Let's start a conversation!
Let's start a conversation!
Fill out the form below. If you prefer, send me an email: rafaelmoraes2611@gmail.com
Fill out the form below. If you prefer, send me an email: rafaelmoraes2611@gmail.com
Rafael Moraes © 2025. All rights reserved.