Designing a Rusyn book with the help of crowds, prototypes, and JavaScript

Back in 2015, I got involved in a rather exciting side-project. My mother had been collecting stories about Rusyns who live in North-Eastern Slovakia and who survived World War II. She compiled the fragments of memories into a moving collection of six short stories. After four years of dedicated work, the book was ready for publishing.

I loved this project from the very beginning. The stories carry the unique legacy, and the job was full of exciting challenges. My role was to design the book cover, typeset the publication, and to manage the entire production. And the book had one peculiarity to overcome. It was written in Rusyn language featuring Cyrillic alphabet and its Latin transliteration.

I took part in this gig way ahead of its deadline, which gave a lot of space for experimentation with a process. I tried the crowd-based design critique for the book cover. I had a fun time with finding the appropriate page layout. I even coded few scripts to speed up the typesetting process.

I have learned a couple of things along the way that I’d love to share with you.

Bringing crowds to critique the design

I sketched a couple of variants and picked the promising ones to get early feedback. I provided a bit of context as well — the book plot, the intended audience and a thought process behind the initial ideas.

I got to admit, I was a bit skeptical about the concept of anonymous critique, and the outcome surprised me. Within a couple of days, I’ve received 30+ well-aimed design reviews. Reviewing all that feedback, I realized that my early sketches were a step in the wrong direction. I stepped on the wrong foot because I made a rookie mistake. I dwelled on one of the initial ideas and did not explore the other ways. I got hooked on it as it was a minimalistic concept, but it was missing the human aspect of the book.

So, I took the pencil and paper once again. I pushed myself to explore as many new concepts as I could until I ended up with another promising idea. The second sketch was well appraised in another round of online critique. I took all the feedback and redrew the whole illustration in Photoshop.

Early book cover sketches. Roughly, they are placed chronologically from the top-left to the bottom-right.

Honing the page layout and typography

I chose the 13 × 21 cm book size. Thus I could maximize the space within B-paper size — the paper size that books get printed on. And, as a bonus, it’s the pleasant-looking ratio of Fibonacci sequence.

I enjoyed a lot of fun finding the right text layout. I was experimenting with combinations of font, font size, line height and margin size to meet the following conditions:

  • When you hold the book in your hands, your thumbs shouldn’t cover the text,
  • The text that’s close to the spine should be visible, even when you cannot open a book properly,
  • The text should be legible for the intended audience.

First, I placed the prototypes into the similar books that are difficult to open. This test would help me find the right margins to meet the first two criteria.

It was a bit tricky to test the legibility. It could be an expensive feat to give it a proper examination. So, I scoped down my options by choosing a suitable typeface and common type setting. As for a typeface, I’ve selected Skolar. It has a generous x-height, robust serifs and low contrast which makes it an excellent option for smaller text. It also has an astonishing Cyrillic character set. Then, I’ve printed out about a dozen layout combinations. I reviewed them carefully and chose a few feasible options. Finally, I tested with my friends and relatives of various age and reading ability to pick the winner.

Page layouts differing in font size, line height or margins that I tested for legibility.

JavaScript to help with typesetting the language variants

Two language variants could only mean one thing — a duplicate editorial review. We would need to write Cyrillic and Latin version, and they both would need a revision. We wanted to avoid that. Otherwise, the entire book production would take longer, it would cost more, and the synchronization of two versions would be a mind-boggling pain.

That’s why I’ve decided to learn a bit of JavaScript. I actually created a transliteration script to automate the conversion between the two language variants. Thus, we only needed to review and proofread the master language version and generate the other language version out of it. I bet it saved us a lot of nerves.

By the way, if you would ever need to transliterate Rusyn, the script available for everyone to use at tota.sk/translit.

Translit in action

There was one more tedious thing that usually troubles when typesetting a publication, and that’s typos. The manuscript needed a little typographic love. I was facing the challenge to manage different typographic rules for both versions. So I started to look for a less exhausting way. I’ve built another a script that’s auto-correcting frequent typos in few languages (Rusyn, Slovak, Czech, and English). It helped me to fix the majority of errors and, in the end, it saved me a lot of work. Indeed, since then I use Typopo (that’s what I call the script) on an almost daily basis. And you can, too, at typopo.org.

Fixing microtypography in Rusyn language with Typopo
Fixing microtypography in Rusyn language with Typopo
Fixing microtypography in Rusyn language with Typopo

Summary

👋 Let’s be friends! Follow me here on Medium for more insights about product design. Connect with me on LinkedIn or Twitter.

As a freelance product designer, I help startups and software companies turn bold product ideas into thriving businesses.