Simulando una pantalla sin retinas

Como eres un programador de JavaScript y necesitas ver tus SVG en un navegador, hay dos soluciones potenciales. Primero, puedes usar las herramientas de desarrollo de cromo para simular una pantalla que no sea HiDPI (Retina Display) en el navegador. O puedes usar el EasyRes para cambiar rápidamente la resolución de toda su pantalla.

Solución 1

Pasos para ver los sitios web como diferentes dispositivos en Google Chrome:

1. Abre la página deseada en Google Chrome y habilita las herramientas de desarrollo para la página ⌥ + ⌘ + I

2. Haga clic en la barra de herramientas del dispositivo situada en la parte superior izquierda de la ventana de herramientas de desarrollo ⌘ + ⇧ + M

3. Haga clic en el tipo de dispositivo en la barra de herramientas superior y haga clic en editar para añadir un nuevo dispositivo para emular

4. Ahora en su caso quiere ser capaz de emular una pantalla sin retinas, así que añadiría "Ordenador portátil con pantalla MDPI" a su lista de dispositivos emulados. Si quiere emular cualquier otro dispositivo, añádalo a esta lista. O por ejemplo, si quiere emular una pantalla para la retina, elija "Ordenador portátil con pantalla HiDPI". Nota: Si quieres cambiar rápidamente entre ambas resoluciones para comparar, añade también "Ordenador portátil con pantalla HiDPI".

5. Cierre la ventana de dispositivos emulados y haga clic en el dispositivo que el cromo actual está emulando (en el lado izquierdo de la barra de herramientas encima de la página web) y cámbielo a "Laptop con pantalla MDPI".

6. Para obtener una mejor vista de la página web, desactive la ventana de herramientas de desarrollo en una ventana separada haciendo clic en las opciones de menú (los tres puntos verticales en el lado derecho de la ventana de herramientas de desarrollo) y la selección de la opción más a la izquierda para el "lado del muelle". O use este atajo ⌘ + ⇧ + D . Esto hará que las herramientas de desarrollo salgan en una ventana separada para que puedas ver toda la página como si estuvieras navegando normalmente.

7. Entonces tu navegador debería tener este aspecto. También puede cambiar las opciones de zoom de la página web emulada en la barra de herramientas para adaptarse mejor a sus necesidades.

Solución 2

http://easyresapp.com/

Enlace para descargar EasyRes de Mac App Store.

Además, aquí hay un enlace a un video de demostración de EasyRes

Podrías usar Diseñador de afinidad que tiene modos para trabajar con resoluciones regulares y pantallas HiDPI. Puedes cambiar entre ellas sin problemas. Incluso muestra el alias que ocurre en resoluciones regulares, que es probablemente lo que quieres comprobar.

Aparte de eso, tendrías que poner una pantalla sin retinas en tu Mac y mover todo allí. Es lo que hacen algunos diseñadores de interacción para comprobar los iconos de las diferentes pantallas. Sin embargo, si tienes dispositivos específicos como objetivos, es mejor usarlos, ya que las resoluciones de pantalla y la densidad de los píxeles son muy diferentes de una pantalla a otra y los diferentes sistemas operativos también aplican diferentes algoritmos de antialiasing. Normalmente es mejor utilizar los respectivos dispositivos de hardware/pantallas.