{"id":25126,"date":"2017-05-17T16:43:01","date_gmt":"2017-05-17T15:43:01","guid":{"rendered":"https:\/\/www.snapsurveys.com\/support-snap11\/?page_id=25126"},"modified":"2018-10-04T12:43:22","modified_gmt":"2018-10-04T11:43:22","slug":"using-logos-images-high-density-devices","status":"publish","type":"page","link":"https:\/\/www.snapsurveys.com\/support-snap11\/worksheets\/using-logos-images-high-density-devices\/","title":{"rendered":"Using logos for Retina and high density devices"},"content":{"rendered":"

In this guide:<\/p>\n

    \n
  1. Understanding pixel density<\/li>\n
  2. Logos on high density\u00a0screens<\/li>\n
  3. Creating\u00a0images for both low\u00a0and high density\u00a0screens<\/li>\n
  4. Worksheet: Using high density\u00a0logos in Snap<\/strong><\/li>\n<\/ol>\n

    Skip straight to the guide \u2193<\/a><\/p>\n

    1. What is a ‘high density’ screen?<\/h2>\n

    Over the past few years computer, smartphone and now TV screens have more than doubled in pixel resolution. This means the individual pixels that make up the screen have become so tiny they are virtually imperceptible to the human eye at a typical viewing distance. Apple first named these high resolution screens Retina<\/strong>\u00a0displays, though the generic industry-wide names are\u00a0HDPI<\/strong> (high dots per inch),\u00a0high density<\/strong>, and more recently\u00a04K <\/strong>or UHD\u00a0<\/strong>though these are usually just TVs.<\/p>\n

    \"Diagram<\/div>\n

    In this guide we’re focusing on smartphones as these are the most common high density devices.<\/p>\n

    2. Logos\u00a0on high density screens<\/h2>\n

    Due to high density\u00a0screens having such tiny pixels, logos\u00a0created for traditional low density\u00a0screens would be displayed much too small on modern devices. To correct this, high density\u00a0devices typically double the size of these images to make them look the same physical size as seen on low density screens. Unfortunately, the result of this re-sizing\u00a0is images that appear blocky or blurry on high density\u00a0screens.<\/p>\n

    \"Diagram<\/div>\n

    But there is a solution…<\/p>\n

    3. Creating\u00a0images for both low\u00a0and high density\u00a0screens<\/h2>\n

    If you want your company or brand logo to look its best on both low and high density screens, use an image that is double\u00a0<\/strong>the pixel resolution required on a standard low density\u00a0display, then set the dimensions to\u00a050%<\/strong>. This way it will look its best on both low density desktop screens, as well as modern high density\u00a0screens like\u00a0smartphones and tablets.<\/p>\n

    Now let’s look at how to do this in Snap Desktop…
    \n    <\/a><\/p>\n

    4. Worksheet:\u00a0Using high density\u00a0logos in Snap<\/h2>\n

    For this\u00a0worksheet, our example survey logo on a standard definition screen is a 300px wide image, but we want it to look sharp\u00a0on high density\u00a0devices.<\/p>\n

    Step 1<\/h3>\n

    First, obtain or create a 600px wide version of the normal 300px logo. Your graphics or branding department may need to help out.<\/p>\n

    Step 2<\/h3>\n

    Using Insert \u203a Image<\/strong>, choose the 600px\u00a0logo to insert into the survey.<\/p>\n

    \"\"<\/div>\n

    Step 4<\/h3>\n

    Using the Zoom<\/strong> input, change the value to 50%<\/strong>.<\/p>\n

    \"\"<\/div>\n

    Step 5<\/h3>\n

    Click OK\u00a0<\/strong>to insert the image.<\/p>\n

    \"\"<\/div>\n

    Note:<\/strong> The logo may look a little blocky at this point. Don’t worry, that’s just how Snap Desktop previews scaled images to prevent slowing down your computer.<\/em><\/p>\n

    Step\u00a06<\/h3>\n

    Publish your survey to test on various device screens. It should look good on low density screens and sharp on high density devices.<\/p>\n

    Dos and Don’ts<\/h2>\n