“Designed to reference the typography textbooks many of us used in design school, this site does an excellent job of mixing the referential with the modern without letting any of it get in the way of the important content.” —Maria D’Amato
“A lot of detail has gone into this work, where craftsmanship meets history and sophistication.” —Martijn van der Does
Overview: Commissioned by the Projector Foundation, a nonprofit organization providing independent digital education for information technology and careers in the creative economy, Kyiv-based digital design firm Obys created Abetka, a website featuring a collection of modern Cyrillic fonts by Ukrainian designers. Abetka highlights Ukrainian alternatives to Russian typefaces, champions the country’s vibrant typeface industry to an international stage and highlights symbols of Ukrainian statehood. Thirty-three fonts by 33 designers each highlight one of the 33 glyphs in the Ukrainian Cyrillic alphabet.
A bespoke preloader showcases each of the 33 fonts through letter cards, displaying a Cyrillic letterform on one side and an image of a Ukrainian cultural symbol on the other.
The Abetka site grew into a large ad campaign that included print and video content.
Obys built the site using the static site generator 11ty and the compiler Pug.js. The site runs on a Strapi CMS with a little Obys magic trick, as the agency says.
Comments by Obys:
Did you learn anything new while creating Abetka? “It’s important to keep in mind that there is always something new to discover in every project, even if you have worked on projects like them in the same field. Some time ago, we created our website The Message to Ukraine, and we managed to showcase the essence of the Ukrainian people in a unique and innovative way. Throughout the process of working on this project, we discovered even more original ways to portray our country and culture.”
Were there any challenges unique to the project? “We had 33 letter cards and needed to make the page exciting, which is why we came up with the backstory to display at the beginning of the site. This unusual preloader was precisely what was difficult to implement: we needed to keep the scrolling movement of the card from overlapping with the content and, simultaneously, make its movement smooth and natural.
“It is also worth mentioning the management of such a complex project. Thirty-three articles require 33 authors. We needed to select 33 fonts; then, we needed to obtain permission to use the fonts. During the project, we worked with various partners, sponsors and consultants to make it happen, which was probably its most difficult part.”
How did time constraints affect Abetka’s final design? “Collaboration is key! The success of this project would not have been possible without the hard work put in by the team of foundation managers, type designers, editors, article authors, designers, developers, historical consultants and partners. And this is just a small part of the entire team involved. Therefore, it is important to be open to collaborating with new professionals from different fields—and not just stick to one’s usual circle.”
