17 Replies Latest reply: Apr 6, 2012 10:09 AM by Steve Werner RSS

    Very low-quality exported EPUB Graphics (music notation)

    Ed Roseman

      Hi all.

       

      Short story: I've made a handful of attempts at InDesign-CS5.5-exported EPUB versions of two of my music books. The music notation is of unusably low quality. Anybody have any ideas why?

       

      Longer story: The music notation examples are mostly PDFs (with a handful of EPSs) created in (music notation program) Sibelius and linked to in InDesign, scaled in InDesign to percentages ranging from 60%-100%. The quality is fine both on-screen in InDesign (in high-quality screen mode… I'm assuming ID's display quality doesn't affect EPUB export), and in the printed-on-paper book. In contrast, the EPUB's versions range from fair (almost readable) to terrible (including many (music) staves with randomly missing staff-lines, note-stems, etc). The quality doesn't seem correlated to scaling—it's all various degrees of bad.

       

      This is all regardless of whether I view the EPUB in Adobe Digital Editions or Calibre. I don't have any actual e-reading devices, so am relying on these virtual ones on my Mac for now.

       

      This is all also regardless of the image export settings. I can't guarantee that I've tried every last combination of setting, but I've tried a bunch (including different export resolutions and formats), and figured I'd ask for help rather than blindly going through them one by one.

       

      Here's a link to a sample page that is fairly representative of how the page should look, in case that might help. Here are three screenshots of music notation from the EPUB:

      LowQualityScaleVsKey.png

      LowQualityCMajorScale.png

      LowQualityKeySigs.png

      This all on a MacBook Pro running OS X 10.6.8 w/2GB RAM with a 30" Cinema Display. Latest/current version of ID CS 5.5.

       

      Any ideas would most surely be appreciated, so thanks ahead of time!

       

      Edly

        • 1. Re: Very low-quality exported EPUB Graphics (music notation)
          BobLevine UGM

          Exporting graphics is not one of the strong points for InDesign.

           

          I suggest scaling the to the proper size in Photoshop.

           

          Bob

          • 2. Re: Very low-quality exported EPUB Graphics (music notation)
            Ed Roseman Community Member

            Hiya Bob, and thanks for replying. Unfortunately, the samples at 100% are just as bad as those that are scaled. So I'm afraid that's not the problem. And I don't have Photoshop anyway, so would have to scale them in Sibelius. But for what it's worth, those that ARE scaled are fine in the printed book.

             

            Here's a bit of one from the EPUB at 100%: LQ100%.png

             

            Other ideas, anyone?

             

            (And PS to Adobe, if ID doesn't scale graphics well, shouldn't the feature be disabled?? Should ID users have to have Photoshop too, just to scale graphics?)

            • 3. Re: Very low-quality exported EPUB Graphics (music notation)
              Steve Werner ACP/MVPs

              I faced a somewhat similar situation in one of the two EPUB docs I just finished. The document has passages in Sanskrit. There was no way to include the glyphs used in Sanskrit because they're not in the supported character set of EPUB files. So I turned them into JPEG graphics in Photoshop. (The image below is a 72 ppi screen capture and not representative of the quality on the iPad.)

               

              Sanskrit.jpg

               

              What made it easier is that you can control the resolution of each placed graphic with the new Object > Object Export Options dialog in InDesign CS5.5. You can set the resolution between 72 and 300 ppi. It took a little experimentation to find the right scaling value and resolution but it came out quite well. I ended up choosing 150 ppi because it most closely matched the resolution of the iPad.

               

              But you probably need to get access to a eBook device to do some testing. And it would also help to use Photoshop to work with the images. Each reader will display the scaled JPEG somewhat differently. In the end, I decided to make it look good on an iPad, and have the other readers just give a reasonable display.

              • 4. Re: Very low-quality exported EPUB Graphics (music notation)
                Ed Roseman Community Member

                Thanks, Steve, and again to Bob. My not replying to your replies sooner hasn't been out of lack of interest, but rather, I've been experimenting, asking around elsewhere… and have needed to take a break, out of sheer frustration . So far, none of my experiments have yielded results of sufficient quality. "My experiments" including resaving my music notation PDFs as PNGs, JPGs, and GIFs at various sizes and resolutions, and also going back to Sibelius and resizing everything (page size, margins, and staff size) in that, and then exporting directly to PNG.

                 

                For one, I'm struck by how many answers I've gotten (both on forums and from talking directly to various people) are of the variety of "I dunno, but I been told." I know eBooks are relatively new, and that they're optimized for text and simple graphics, but music notation saved in the form of the graphic formats listed above should be simply treated as graphics--pics or photos, if you will--by the virtual eReaders. I'm really having trouble understanding why this is not going better.

                 

                I was even told by someone at a major music publisher that music notation in eBooks is "difficult or impossible." Go figure.

                 

                Any further input from the InDesign community here? I figure that Interactive PDF is one possible avenue, but would like to see if there's any way of getting music notation to look as it should in (text-) reflowable eReaders such as the Nook and Kindle.

                 

                Thanks again, any and all!

                 

                Ed Roseman

                http://www.edly.com

                • 5. Re: Very low-quality exported EPUB Graphics (music notation)
                  Ed Roseman Community Member

                  Just now, in Sigil, I’ve been resizing the window bigger and smaller (more than I had previously, because I had Sigil, Calibre, ADE, InDesign, and Sibelius all open, and w/2GB RAM w/Snow Leopard, my poor Core Duo MBP was really struggling!), and only just now see something that might help diagnose the problem: every single version of the notations looks better big. Big, big, big (bigger, I think, than a Nook or Kindle's window). When I make the window, and hence, the notation examples, smaller, some versions look better at this size, others look better at that size, while still others look better at another size. Sigh.
                  For anyone who would like to look at the latest version of my experiment file, I'll post it at <http://www.edly.com/Notation.05.epub.zip>. BTW, some of the ones at the beginning are cropped on the left & right. I was hurrying, and I did that to make them fit on the ID page quickly, since the crop didn’t matter. But on that note, I believe it’s the very last example in the file that, in InDesign, didn't even fit on the (ID) page. I just hadn’t gotten around to resizing it. I believe less than a quarter of it fit on the page in ID. I was curious to see what would happen. Go figure, but somehow it was made to fit. What a mystery-filled procedure!!
                  So, from this latest batch of playing around with window size, it looks like the notation doesn’t like being reduced beyond a certain point, regardless of what graphic format it’s in. But some of the notation examples in the file were redone in Sibelius at 450x550 or so pixels, which supposedly is an e-book-friendly size. But they're no better than others; in fact, too small. But, or and, if I remember correctly, even though I set up the Sibelius document at 450x550, when I exported (I think, PNG @ 300dpi), they came out too big, so I resized them in Preview.
                  I would think that some combination of parameters in Sibelius (doc setup and graphic export), Preview (for resizing), and ID (for everything else) would work. But that's a whole lot of parameters to play around with, using the oh-so scientific method of trial and error! I'm no expert on graphics formats and resolutions, etc. I wish the path from point A to point B were clearer.
                  Any more ideas, people?
                  Edly

                  • 6. Re: Very low-quality exported EPUB Graphics (music notation)
                    MichaelToronto

                    Ed (and others): I've been having the same problem with an image that is mainly letters.  It appears scratchy, with some letters thing, other thick.  As you see, below, it appears heavily pixelated, although in an eBook reader you don't really see the pixelation per se.  It looks lovely in Photoshop or ID5.5, but not in ePub.  I've tried jpeg, gif, and png.   . . .  Have you found a solution?    Thanks, Michael 

                    Capture.PNG

                    • 7. Re: Very low-quality exported EPUB Graphics (music notation)
                      Ed Roseman Community Member

                      Michael T. (and others):

                       

                      Below is a response from an anonymous employee from a major music publisher, in case it's of help to anyone. (I figured I'd get more definitive answers from a publisher who, theoretically, at least, would have the most experience with this.) For my part, I became sufficiently discouraged that I shelved any idea of doing any kind of music ebook for now, and have returned to a tradional print book project that I'd stopped to research the music ebook thang.

                       

                      Edly


                      Begin forwarded message (and sorry for all the redundancy):

                       

                       

                      Short story: I've made a handful of attempts at EPUB versions of one of my music books, Edly's Music Theory for Practical People. In the EPUB, the music notation is of unusably low quality, while the rest of the graphics (scanned line drawings) are fine. Any ideas why?

                       

                       

                      We [anonymous major music publisher] are dealing with the same issues when it comes to musical graphics or illustrations in EPS format looking sub-par. We've found that PNG @ 300DPI is your best bet for optimal quality. Also make sure to size your graphic appropriately to fill the (tablet) screen. In a perfect world, designers/authors would be able to use the SVG format or "Scalable Vector Graphics". Unfortunately we cannot use that format because Adobe doesn't allow SVG import. So until the EPUB powers-that-be and Adobe figure out how they want to handle vector based graphics, we will have to raster them into a format that works best for the situation.

                       

                       

                      Longer story: The music notation examples in the book are PDFs created in Sibelius and linked to in InDesign, scaled in InDesign to percentages ranging from 60%-100%. (I was told that PDFs would not work for e-books, period, so I've also tried exporting the notation from Sibelius as PNGs, JPGs, and GIFs of various sizes and resolutions. Same not-good-enough quality. More on that below.) The PDF quality is fine both on-screen in InDesign, and in the printed-on-paper book. In contrast, the EPUB's versions range from almost readable to terrible (including many staves with randomly missing staff lines, note stems, etc). The quality doesn't seem correlated to scaling—it's all  various degrees of bad. This is all regardless of  InDesign's image export settings, which I've toyed with quite a bit

                       

                       

                      Same as above!

                       

                       

                      This is all also regardless of whether I view the EPUB in Adobe Digital Editions or Calibre. I don't have any actual e-reading devices, so am relying on these virtual ones on my Mac for now.

                       

                       

                      EPUB readers in general, from Adobe's Digital Editions to Sibilius or Calibre all render the EPUB differently. There is absolutely no consistency whatsoever. This can be extremely frustrating for designers. If you are planning on selling your EPUB on iBooks, then your main target is the iPad. The iBooks app on the iPhone, iTouch and iPad all use the "webkit" rendering engine which is the same that Safari uses. It is the closest approximation of the iPad that we've found to date. However, you'll have to crack open your EPUB or expand it. Once you have that opened up, all the individual files are actually HTML files that open natively in Safari.

                       

                      I would really suggest, if possible, that you proof your ePUBs on the device intended. There is no substitute for the actual device itself. It is probably impossible to get all the devices out there, but an iPad and/or Kindle are great options to proof on.

                       

                       

                      If you'd like to look at the latest version of my experiment file, it's posted it at <http://www.edly.com/Notation.05.epub.zip>. BTW, some of the ones at the beginning are cropped on the left & right. I was hurrying, and I did that to make them fit on the InDesgin page quickly, since the crop didn’t matter. But on that note, I believe it’s the very last example in the file that, in InDesign, didn't even fit on the (ID) page. I just hadn’t gotten around to resizing it. I believe less than a quarter of it fit on the page in ID. I was curious to see what would happen. Go figure, but somehow it was made to fit. What a mystery-filled procedure!!

                       

                      There are numerous ways to export your InDesign file to EPUB. Too many to attempt to list here. However, one of the options that could be missed is the "Preserve Appearance from Layout". If this option is selected, InDesign exports your graphics exactly as you see them in InDesign. Strokes, drop shadows, rotation and cropping are maintained. This may address the cropping problem you had mentioned. Other solution is opening up all of your graphics and sizing and cropping them in Photoshop prior to placement. That way InDesign doesn't have to do anything. There are bugs that seem to pop up here and there, but for the most part, this method works well.

                       

                       

                       

                      So, from this latest batch of playing around with window size, it looks like the notation doesn’t like being reduced beyond a certain point, regardless of what graphic format it’s in. But some of the notation examples in the file were redone in Sibelius at 450x550 or so pixels, which supposedly is an e-book-friendly size. But they're no better than others; in fact, too small. But, or and, if I remember correctly, even though I set up the Sibelius document at 450x550, when I exported (I think, PNG @ 300dpi), they came out too big, so I resized them in Preview.

                      I would think that some combination of parameters in Sibelius (doc setup and graphic export), Preview (for resizing), and ID (for everything else) would work. But that's a whole lot of parameters to play around with, using the oh-so scientific method of trial and error! I'm no expert on graphics formats and resolutions, etc. I wish the path from point A to point B were clearer.

                       

                      I wouldn't do anything special to your Sibelius EPS files. Basically InDesign is converting those to either GIF, JPG or PNG. I understand the iterations you've gone through. We've done the same. PNG at 150-300DPI seems to show the best results. One other trick for graphic sizing: the iPad maximum viewing area in pixels is 600 x 860 and is nicknamed the "Magic Dimension". You can accomplish a couple of things knowing this. First is that if you make any graphic exactly that size, iBooks creates a "page break" because nothing else will fit on that page. So if you take that information and make all of your musical files 1200pixels wide at 150-300 dpi in PNG format, your graphic file will look good in reading mode or even better when they expand the graphic to its maximum size.

                       

                      There are a couple of great references that are great sources for all EPUB adventurers. First resource is Liz Castro's "EPUB Straight to the Point" paperback book or EPUB. Second would be the Adobe website. Their training sections have many free overview that are very handy. Also on iTunes, there are a few podcasts that cover some of this material also. Terry White's "Adobe Creative Suite" podcast shows many of these steps covered above.

                       

                      One other source that isn't free but is so worthwhile, is Lynda.com. There is a new course from Anne-marie Concepcion that covers EPUB from creation to delivery. It is very comprehensive and just about answering everything I needed. For $37.50 for a 1 month trial, you can take as many classes as you can fit it." The course is approximately 5-6 hours and is excellent.

                      • 8. Re: Very low-quality exported EPUB Graphics (music notation)
                        BobLevine UGM

                         

                        This is all also regardless of whether I view the EPUB in Adobe Digital Editions or Calibre. I don't have any actual e-reading devices, so am relying on these virtual ones on my Mac for now.

                         

                         

                        EPUB readers in general, from Adobe's Digital Editions to Sibilius or Calibre all render the EPUB differently. There is absolutely no consistency whatsoever. This can be extremely frustrating for designers. If you are planning on selling your EPUB on iBooks, then your main target is the iPad. The iBooks app on the iPhone, iTouch and iPad all use the "webkit" rendering engine which is the same that Safari uses. It is the closest approximation of the iPad that we've found to date. However, you'll have to crack open your EPUB or expand it. Once you have that opened up, all the individual files are actually HTML files that open natively in Safari.

                         

                        I would really suggest, if possible, that you proof your ePUBs on the device intended. There is no substitute for the actual device itself. It is probably impossible to get all the devices out there, but an iPad and/or Kindle are great options to proof on.

                         

                        This cannot be repeated enough. Creating Epubs without the device they will be rendered on is like designing websites without checking them in a browser. I'm sorry, but you will absolutely need to buy an iPad if you're going to iBooks.

                         

                        Bob

                        • 9. Re: Very low-quality exported EPUB Graphics (music notation)
                          BobLevine UGM

                          Oh...and I'll +1 the advice on AM's Lynda.com tutorials. If you're interested, here's a link for one week trial: http://bit.ly/fcGpiI

                           

                          Bob

                          • 10. Re: Very low-quality exported EPUB Graphics (music notation)
                            [Jongware] MVP

                            Ed Roseman wrote:

                            Begin forwarded message (and sorry for all the redundancy):

                             

                             

                             

                            [...] In a perfect world, designers/authors would be able to use the SVG format or "Scalable Vector Graphics". Unfortunately we cannot use that format because Adobe doesn't allow SVG import. So until the EPUB powers-that-be and Adobe figure out how they want to handle vector based graphics, we will have to raster them into a format that works best for the situation.

                             

                            Nonsense. Adobe doesn't have anything to do with the ePub specifications, or with the devices that are supposed to display them. iBook on the iPad, for example, is perfectly able to display SVGs (although you cannot really zoom in, which is a pretty darn shame).

                             

                            "Adobe" -- I'm presuming you mean "InDesign" by that -- doesn't 'allow SVG graphics' to be placed into an ePub, but then again InDesign is not advertised, nor designed, nor especially useful, to create ePubs from scratch. I, for one, have no moral qualms on deconstructing an InDesign-based ePub into its separate components, manually tweaking them, and then re-assembling to exactly get the output I intend.

                            • 11. Re: Very low-quality exported EPUB Graphics (music notation)
                              BobLevine UGM

                              It’s a good thing you have no qualms about it since getting a decent epub without doing that is pretty near impossible.

                               

                               

                               

                              Bob

                              • 12. Re: Very low-quality exported EPUB Graphics (music notation)
                                AnneMarie Concepcion ACP

                                Why not crack open your epub and inspect the images folder? You can open each of those files and see what resolution they have in Photoshop, see if you can figure out why they're such low quality.

                                 

                                Keep in mind that your PDFs/EPSs are vector artwork and your JPEGs/PNGs/GIFs are raster, and for musical notation (as opposed to say, landscapes of rolling hills) the degradation of quality will be jarring.

                                 

                                I'd recommend you create a sample doc with about 4 spreads with various notation art and experiment. Setting the conversion of images to 300 ppi PNG as recommended is a good start ... you can do that for all images automatically in the Export to EPUB dialog box, or on a case by case basis with Objects > Object Export Options. I might also try GIF instead of Automatic (which makes them all JPEG usually) since JPEG is more suited to continuous tone art like pictures of people and landscapes. To get them as large as possible in the EPUB, scale them in InDesign larger. See what happens.

                                 

                                Until you get an iPad, two free ways to preview an EPUB on a Mac are with IbisReader.com (web-based reader) and the ePubReader extension for Firefox. I use both.

                                 

                                AM

                                • 13. Re: Very low-quality exported EPUB Graphics (music notation)
                                  Ed Roseman Community Member

                                  Thanks, AnnMarie. When I finish the traditional-book project I'm now back to working on, I'll certainly pursue this, and any of the other suggestions. For now, I'm honestly happy to be back to NOT dealing with the ebook thang for a while. Thanks so much for your input!

                                  • 14. Re: Very low-quality exported EPUB Graphics (music notation)
                                    jon u Community Member

                                    Has MichaelToronto or Ed Roseman had any luck with this?

                                     

                                    I have the same issue! I have a series of grouped text/images and when I export, the image and text are poor (almost grainy, just like Michael's and Ed's exemples).

                                     

                                    I understand if the image was poor (which they aren't), but the images and text are perfect when I export to PDF. It's just when I export to ePub something goes wrong. I have each group rastered to the same 150ppi and file type (jpeg). I've tried changing them to 300ppi and png, with no improvement. 

                                     

                                    I have scoured the internet and watched every adobe TV tutorial - no luck. Any help would be appreciated. I'm sure a lot of other people are having the same issue.

                                     

                                    ****Edit: I thought this was an issue, but just turned out the epub viewers/simulators just didn't show it correct. When I view it on an acutal device, the poor quality is gone!!!!

                                    • 15. Re: Very low-quality exported EPUB Graphics (music notation)
                                      Valery_S Community Member

                                      So why not to use SVG in InDesign to get better images quality in EPUB? SVG KIT for Adobe Creative Suite gives you direct support of SVG format in InDesign and Photoshop http://svg.scand.com

                                      • 16. Re: Very low-quality exported EPUB Graphics (music notation)
                                        Steve Werner ACP/MVPs

                                        I just looked at their website. Looks interesting but they don't appear to support Mac OS X 10.7 (Lion), although they support Leopard and Snow Leopard. I just wrote an email to the Support Department to confirm that. I moved to Lion over six months ago and couldn't fully  recommend them if they didn't support mature versions of Mac OS X.

                                        • 17. Re: Very low-quality exported EPUB Graphics (music notation)
                                          Steve Werner ACP/MVPs

                                          Good news. The SVG Kit does support Lion. You just have to manually install Java (as you do for many other programs).