10 Replies Latest reply: Jan 28, 2013 10:23 AM by Noel Carboni RSS

    Creating high-res screenshots without Retina display

    ashleykaryl Community Member

      I am currently writing a book that will initially be sold as a PDF but may later go on the iBook store, however I don't have a Retina display myself and I am wondering if there is any kind of workaround or best practice for making screenshots from a normal display look acceptably sharp on a Retina display?

       

      I have Photoshop along with the iOS simulator that shows how the iPad or iPhone will look if they can be used in some way but I mainly need to get menu items and dialogue boxes from various applications in OS X and Windows looking good on Retina screens. I really don't want to pay out for a Retina display purely for this task that would only take a few hours of work at most.

       

      Thanks

       

      Ashley

        • 1. Re: Creating high-res screenshots without Retina display
          Mylenium CommunityMVP

          You could always ask someone... Otherwise I'm not sure I see the relevance. People have been printing tech manuals at 300 dpi ever since most operating systems ran on tiny 640x480 pixel screens and nobody ever made anything of it. That being so, even "standard" 1920x1200 screenshots would look reasonably good even on a Retina display with a tiny bit of scaling. I really think you are obsessing about the wrong thing. and see it from the otehr side: What good do Retina screenshots do, when they have to be scaled down on otehr devices and the text becomes so tiny and lines so thin it is not readable there?

           

          Mylenium

          • 2. Re: Creating high-res screenshots without Retina display
            ashleykaryl Community Member

            You may well be right Mylenium but I'm struggling to guage just how good or bad normal screenshots will actually look in practice on a Retina screen. The print medium has always hidden an awful lot of supposed image defects including interpolated files or ones with heavy film grain that still somehow look great in magazine or book but this is a different display medium.

             

            When I take a screenshot done on my NEC display and then view that image using the iOS simulator the enlarged screenshot lacks crisp detail and I'm told it will look downright blurry on a real Retina display. There are various screenshot apps out there for automatically downsizing Retina screenshots for normal displays but I can't find any good information on doing it the other way.

             

            Retina images wouldn't need to be scaled down as such of non Retina displays. They would just be higher resolution within the same page dimensions.

            • 5. Re: Creating high-res screenshots without Retina display
              JJMack CommunityMVP

              I would think you will also get better results if you use the largest display you have the one that displays the most pixels and use the largest size font application User Interface supports.  Scale screen captures down in size for small displays and up in size for high resolution displays that display a larger number of pixels.  Relize text does not scale well.  So capture the largest readable text the you can the more pixels the text is created with the better off you will be.

               

              For electronic viewing on displays you may want to consider having a html version of your publication.  Using HTLM code you can support full screen mode find out the browsers window size and scale the included image for the current browsers window using image width and height sizes settings.  Have the actual screen capture files the largest you can possibly capture so the screen captures will scale well both up and down in size.  When scaling maintain the screen captures Aspect Ratio you do not want to be distorting text just scaleing.

              • 6. Re: Creating high-res screenshots without Retina display
                ashleykaryl Community Member

                This is done using the developer tools on my non Retina 23" NEC with a resolution of 1920x1200 and is far better than anything I've managed by uprezzing with Photoshop.

                 

                 

                http://www.sunnymede.net/screenshots/743.jpg

                • 7. Re: Creating high-res screenshots without Retina display
                  JJMack CommunityMVP

                  Yes the more pixels you start with the better off you will be.  The big difference between the retina then your non rentina is resolution. Your 1920x1200 display most likely has a resolution around 100dpi where the retina displays have a resolution around 250 dpi 2.5 time the resolution. 2.5 may look like a small number however when you convert that to pixels you will find that is actually a large number.   If the retnia display had only 2 times resolution 200dpi of you display to display the images the same size on the retina display you would need 3840x2400 pixels 4 times the number of pixels.  The retina display resolution is 2.5 you displays resolution to display your 1920x1200 displays image the same size on a retina display thas was the same phycial size of yuor display the imge would need to be  4800x3000 that is 6.5 times the number of pixels. Retina displays are smaller then your display.  Retina mackbooks have 13.4" and 15.5" displays.  Compareing mackbooks display image the same munber on pixel show  1/4 the size on a retinal display or  4 time the size on a not retinal display.   Retina displace have twice the resolution as the none retina display.

                  • 8. Re: Creating high-res screenshots without Retina display
                    Noel Carboni Community Member

                    ashleykaryl wrote:

                     


                    I really don't want to pay out for a Retina display purely for this task that would only take a few hours of work at most.

                     

                    As with anything in the professional realm, you may find that in order to put out work that is of cutting-edge quality, you will have to pay for cutting-edge tools to create it.

                     

                    Have you tried upsampling with an edge preserving tool such as On One Software's Perfect Resize or Alien Skin's Blow Up 3?

                     

                    -Noel

                    • 9. Re: Creating high-res screenshots without Retina display
                      ashleykaryl Community Member

                      Noel Carboni wrote:

                       


                      As with anything in the professional realm, you may find that in order to put out work that is of cutting-edge quality, you will have to pay for cutting-edge tools to create it.

                       

                      Have you tried upsampling with an edge preserving tool such as On One Software's Perfect Resize or Alien Skin's Blow Up 3?

                       

                      -Noel

                       

                      No I haven't tried anything like that so far and it all needs a bit of testing to see how it looks in practice. I will also need to include some Windows screenshots and they are looking pretty horrible at the moment inside Parallels when I use the developer tools in OS X to obtain the HiDPI resolution settings but I'm not entirely sure why.

                      • 10. Re: Creating high-res screenshots without Retina display
                        Noel Carboni Community Member

                        For your Windows captures you may need to adjust the ClearType Tuner font smoothing settings to get good Windows screenshots.  What works for LCD monitors generally doesn't work for print.

                         

                        -Noel