Skip to content

Sources of inspiration

Jiminy Panoz edited this page Mar 13, 2016 · 2 revisions

Soma was designed as a blueprint, it does the dirty work so that you don’t have to.

Though its typesetting is perfectly usable AS-IS, you may want to inject some custom styles of yours. Hence this list of inspirations.

We felt it was also necessary to add some notes as regards support and possible issues.

Craig Mod’s Art Space Tokyo

Art Space Tokyo’s design on iPhone

As seen in Platforming Books.

Notes

  • If you want to embed fonts, check their licences; not all fonts can be used in ePub and Kindle Mobi.
  • If you embed fonts, declare the font-family in body and let the children inherit from it—excepted headings if you are using a typeface combo.
  • If you are using border-bottom for links (underline), please consider some Reading Systems will apply text-decoration: underline anyway (e.g. Kindle).
  • Beware of night modes. Sometimes, it is preferable to keep a white background so that your illustrations be legible on dark backgrounds—the norm at the Reading System level is not inverting transparent PNGs.
  • Beware of float, as it may render text uncomfortable to read on small screens and trigger performance issues in RMSDK-powered devices/apps (up to 4 to 5 seconds delay at rendering the contents of the screen if there are too many floats in the same xhtml document).

Frank Chimero’s The Shape of Design

The Shape of design’s typography on an iPad and a Kindle eInk Reader

As seen in Designing in the borderlands.

Notes

  • If you want to align illustrations vertically, it is far easier to produce a fullscreen image (aspect ratio 16:9, text-align: center for wrap, height for wrap and img).
  • One font size fits all is a clever idea, especially as some eReader’s users are pushing the setting to 36 pt (accessibility). Make sure negative space and other styles clarify your layout.
  • Don’t rely on text-transform: uppercase when needed, type in upper-case.
  • Beware of text in color. Don’t forget it will be rendered as grayscale on eInk devices.
  • Beware of fonts, rendering is quite a complex issue so test your fonts on actual devices (nasty bugs).