Hoy voy a describir en pocos pasos como crear fácilmente una pantalla de inicio para iPhone, iPad o iPod con el efecto ‘Glow’ en los iconos de las apps de iOS. Antes de empezar, mira la imagen siguiente, es el resultado final al que pretendemos llegar. Ten en cuenta que este tutorial trata de mostrarte cómo hacer el efecto de manera sutil y clara. Este resultado final que se aprecia puede considerarse un ‘borrador’. Bien, vamos ya a crear el efecto ‘Glow’ para la pantalla de inicio del iPhone.
El efecto ‘Glow’ es un efecto ‘resplandor’, que como puedes ya intuir supone ser una luz muy difusa que nace desde la parte de detrás del objeto o sujeto en cuestión y progresa hacia todas direcciones.
Recuerda que se puede hacer mucho mas espectacular el resultado final, depende de tu creatividad e imaginación. El fondo en negro destaca el efecto glow, de ahí que sea el color/imagen de fondo que he elegido para el tutorial. Pero vaya por delante que puedes dejar volar tu imaginación y hacer el mismo efecto con tus propias imágenes de fondo.
En este tutorial te muestro de manera sencilla como mejorar la pantalla de inicio del iPhone con el efecto ‘Glow
Empecemos:
1.- Haz una foto estando a oscuras, o tapando la cámara de manera que el resultado sea una foto totalmente oscura, de color negro solido. También puedes buscar por la red una imagen que se totalmente negra e importarla a tu carrete de fotos. Recuerda que usamos una imagen en negro para que se aprecie mejor el efecto final.
2.- Haz de esa imagen negra que tienes en el carrete de tu dispositivo, el fondo de pantalla de tu iPhone, iPad o iPod. Ve a Ajustes > Fondo de Pantalla. O desde el carrete, selecciona la imagen negra y aplícala como fondo de pantalla de inicio.
CONSEJO: Si deseas ir un poco mas allá y con el fin de obtener un mejor resultado sería interesante que situaras los iconos de tu iDevice de manera armoniosa, es decir, que si te apetece y tienes un rato, puedes jugar con los iconos (que son tus apps) y distribuirlos de manera que queden organizados por colores o por niveles de grises. La idea es conseguir un efecto notorio, eso se logra si los iconos son mas bien claros y si en el caso de que tengan colores (como el azul del de Facebook) quedan organizados de manera visualmente atractiva. Una vez realices el paso 3, puedes volver a dejar tus iconos como estaban (si lo deseas).
3.- Ahora haz una captura de la pantalla de inicio de tu dispositivo con esa imagen en negro de fondo y los iconos de tus apps tal cual estén. Evita tener los globos rojos con notificaciones en los iconos de las apps.
Elimina las notificaciones de globos y captura la pantalla pulsando simultáneamente el botón de inicio y el de bloqueo/desbloqueo de tu iDevice. Con eso consigues en tu carrete, tener una captura de la pantalla de inicio de tu iDevice. Algo como esto:
4.- Exporta esa captura de tu iDevice a tu Mac mediante, por ejemplo, la app Vista Previa (conecta tu dispositivo al Mac y en Vista Previa, busca ‘Archivo’ en la barra de menus y selecciona ‘Importar desde…’). Haz click en la imagen para que tu Mac la importe.
Puedes importarla también sincronizando tu dispositivo con iTunes y buscar la nueva imagen en la carpeta de fotos sincronizadas. Podrías también lograr lo mismo si guardas la imagen en ‘fotos compartidas’ y accedes a ellas desde tu Mac.
5.- A esa imagen de la captura de tu pantalla de inicio, aplícale el efecto desenfoque a toda la imagen. Si usas Pixelmator o cualquier app similar, has de aplicarle a esa imagen el efecto de ‘Desenfoque Gaussiano’. Obviamente puedes probar otros desenfoques mas complejos. Pero para obtener el efecto deseado en este tutorial, usaremos ‘Desenfoque Gaussiano’ y lo aplicaremos en toda la imagen con un 15% de intensidad. El resultado ha de ser como aproximadamente como el de la siguiente imagen:
Cuanto mas desenfoque apliques, mejor efecto ‘glow’ conseguimos, pero por otro lado perdemos intensidad/brillo en la imagen final ya que se esparce demasiado. Así que aplicar un 15% está bien ya que es un resultado equilibrado. Pero puedes experimentar y desenfocar mas aumentando también el brillo general de la imagen para compensar y que no se “pierda” el efecto.
Si te animas, con Pixelmator o apps similares, puedes aumentar el brillo de la imagen en general con el fin de emblanquecer todos los iconos y que ganen nivel de “luz”… Así el efecto será mas intenso. Si no te importa perder el color, podrías también convertir la imagen a ‘blanco y negro’ para que el efecto glow sea como mas ‘celestial’.
6.- Ahora vuelve a alojar en tu iDevice la imagen con el efecto de desenfoque ya aplicado. Para ello, usa iTunes mediante tu carpeta sincronizada de fotos o usa iPhoto, fotos compartidas o cualquier otra app de transferencia de archivos que gustes. En mi caso lo hago con iTunes y la app FileApp.
En cualquier caso, has de hacer que la imagen con el efecto ‘desenfoque’, sea accesible desde tu iDevice. Lo más rápido podría ser usar fotos compartidas, de esa manera pasas la imagen de tu Mac a tu iDevice fácil y rápidamente.
Si has usado una app de iOS en tu iDevice para hacer los efectos, directamente guarda la imagen final en tu carrete, sin mas.
7.- Localiza esa imagen en tu iDevice y aplícala ya como fondo de tu pantalla de inicio. Recuerda que has de usar la opción ‘Profundidad: No’…
.
El resultado es una imagen limpia con un efecto ‘glow’ en todos los iconos. En este caso es un efecto limpio, discreto y sutil, pero que le aporta un toque distinto a la pantalla de inicio.
En este tutorial he usado una imagen totalmente en negro de fondo para que veas claramente el efecto ‘glow’ como rodea a los iconos creando ese efecto. Pero si te animas y te manejas bien las apps de diseño gráfico, puedes crear muchas mas variaciones. La imagen del fondo no tiene el porqué ser negra, puede ser un degradado, un fondo difuso o cualquier imagen que desees… (lo cierto es que sea la imagen que sea, se difuminará entera cuando le apliques el efecto de desenfoque Gaussiano). Lo importante es que captures tu pantalla de inicio y le apliques el efecto desenfoque con ese fondo y con los iconos. Así se crea un efecto ‘Glow’ interesante en la pantalla de inicio del iphone
Como ejemplo contrario al usado en el tutorial, he elegido ahora una foto con muchos colores y muy saturados como imagen de fondo de mi pantalla de inicio y he seguido los mismos pasos exactamente del tutorial. El resultado es menos vistoso en cuanto al efecto ‘Glow’, pero si te fijas, existe.
Busca un equilibrio. Un fondo uniforme, de uno o dos colores no demasiado saturados podría ser lo más acertado.