19 de los mejores ejemplos de diseño de sitios web móviles – Veeme Media Marketing

by [email protected] (Rachel Leist) | Oct 16, 2018 | Marketing | 0 comments

1. Shutterfly

Shutterfly es un servicio en línea que permite a los usuarios crear álbumes de fotos, tarjetas personalizadas y papelería, y más. Debido a que cada vez más personas toman fotos y luego acceden a ellas con sus teléfonos inteligentes, Shutterfly reconoció la necesidad de crear una excelente experiencia móvil para sus clientes, y la entregaron.

Shutterfly logra dos objetivos clave en su sitio web móvil: [19659030] Es fácil para los usuarios encontrar información sobre sus ofertas.

Cuando llegue a su sitio móvil, verá el último centro de promoción de Shutterfly, así como un gran botón de inicio de sesión para los miembros que regresan, ninguno de los cuales domina la experiencia del usuario.

Desplácese hacia abajo y los usuarios verán grandes botones que facilitan a los usuarios seleccionar rápidamente el tipo de producto en el que están interesados. Una vez que los usuarios hacen clic en una de esas opciones, son recibidos con fotos grandes que muestran lo que Shutterfly es capaz de navegar con facilidad. [19659002]

2. Google Maps

Todos tienen su aplicación favorita de mapas o direcciones. El mío es Google Maps, que utilizo ya sea para caminar, conducir, andar en bicicleta o tomar el transporte público. Lo especial de su sitio web móvil es que es prácticamente indistinguible de su aplicación móvil descargable.

Las capturas de pantalla de abajo se toman de su sitio web móvil, pero si está familiarizado con la aplicación, notará que se ven exactamente lo mismo. La apariencia es idéntica, pero el sitio web móvil tiene la velocidad y la funcionalidad de la aplicación.

3. Typeform

Typeform es una empresa de tecnología con sede en Barcelona con una misión simple: "hacer que las formas sean impresionantes".

Sin embargo, para los usuarios de dispositivos móviles, reconocieron que los componentes de diseño complejos, como el video y las animaciones, podrían afecta significativamente el tiempo de carga de la página entre otras dificultades. Es por eso que en realidad eliminaron muchos de ellos, lo que ordenó el sitio y simplificó la experiencia móvil general. El sitio web móvil es una versión más simple de su sitio web de escritorio, y aún está bellamente diseñado.

Tome nota de los botones grandes en su página de menú, perfecto para tocar con el dedo en un móvil pantalla.

4. Etsy

Etsy es un sitio web de comercio electrónico donde las personas pueden comprar y vender artículos vintage o hechos a mano. La mayoría de los compradores que visitan el sitio web de Etsy están ahí para hacer una de dos cosas: o están buscando un artículo específico, o están buscando artículos en categorías que les interesan.

El sitio web móvil está dirigido a ambos tipos de visitantes de el principio. Cuando accedes por primera vez a su sitio web móvil, te encuentras con una opción para buscar artículos, tiendas o categorías específicos.

Inmediatamente debajo de la barra de búsqueda se encuentran imágenes en miniatura de artículos de tendencias que muestran algunas de las cosas más populares que puede comprar en Etsy. Los usuarios móviles pueden ver estos elementos de tendencia en un formato de collage, y las imágenes son lo suficientemente grandes para que puedan tocarlos fácilmente con el dedo.

5. Adrian Zumbrunnen

Este es el sitio web personal de Adrian Zumbrunnen, un diseñador de UX, escritor y orador. Cuando visite su sitio web, notará que hay algo muy particular: es un sitio web conversacional .

Casi parece una conversación de mensaje de texto que normalmente tendría en su teléfono: – Incluyendo los puntos suspensivos para mostrar que está "escribiendo". Los usuarios reciben dos opciones de respuesta al final de cada intercambio, por lo que es como una experiencia de "elige tu propia aventura".

Si bien la experiencia móvil y de escritorio son muy similares, el sitio web de escritorio se siente como si fuera hecho principalmente para dispositivos móviles – que podría ser la dirección en que irán los sitios en el futuro.

Y si prefiere no participar en el intercambio de conversación, simplemente puede desplazarse hacia abajo para obtener más detalles.

6. Elf on the Shelf

Elf on the Shelf es, relativamente hablando, una tradición navideña bastante nueva basada en un libro para niños. Si no está familiarizado, la premisa básica es esta: el libro cuenta la historia de los elfos exploradores de Santa Claus, que son enviados por Papá Noel para vigilar a los niños en sus hogares de todo el mundo e informar a Papá Noel.

Junto con el libro, los padres pueden comprar una figura de elfo, que colocarán sutilmente en algún lugar de su casa donde sus hijos puedan verla. Todas las noches antes de Navidad, los padres mueven al elfo a un lugar diferente de su casa para "demostrar" a sus hijos que los elfos exploradores son reales y que siempre los vigilan.

Cuando llegas por primera vez al sitio web de Elf on the Shelf Verá que en realidad hay numerosos tipos de productos de Elf on the Shelf que puede comprar. Pero en lugar de obligar a los usuarios a desplazarse a través de cada producto individualmente, los diseñadores web empaquetan cada producto en un mosaico grande y atractivo que describe el objetivo del viaje de cada comprador, con el artículo destacado en la parte frontal.

No está comprando su propio elfo o cachorro – estás adoptándolo . Es una experiencia verdaderamente enriquecedora en una pantalla tan pequeña.

7. BuzzFeed

BuzzFeed es una compañía de noticias conocida por su contenido viral y pruebas populares. También es una de mis fuentes favoritas de entretenimiento durante mi viaje hacia y desde el trabajo.

¿Y dónde crees que estoy revisando BuzzFeed durante mi viaje? Lo has adivinado: en mi teléfono. BuzzFeed sabe que muchos de sus visitantes visitan su sitio en dispositivos móviles, por lo que se preocuparon por crear una experiencia fluida para sus lectores en movimiento.

Cuando llega al sitio web móvil de BuzzFeed, lo primero Verá algunas de las piezas de contenido más populares que se muestran en un formato de collage simple con imágenes grandes que son fáciles de tocar con el dedo.

Para usuarios interesados ​​en categorías específicas, hay un menú en el que se puede hacer clic en la esquina superior izquierda de la pantalla que muestra todos los mensajes.

8. Evernote

Evernote es una aplicación que te permite almacenar notas, imágenes y artículos web y luego acceder a ellos en todos tus dispositivos. Debido a que los usuarios tienden a descargar la aplicación o acceder al sitio web en múltiples dispositivos, como computadoras de escritorio, teléfonos inteligentes y tabletas, es esencial que Evernote obtenga la experiencia móvil correcta.

Si miras la página de inicio de Evernote en tu computadora de escritorio, Fíjate en lo limpio que está el diseño. Las declaraciones de valor son breves y al punto, y los gráficos se agregan al posicionamiento de la marca pero no abarrotan la página.

Cuando miras En el sitio web móvil de Evernote, se puede ver que han mantenido intactos su color paladar y su estilo general de marca. El sitio web móvil de la compañía es limpio, simple y no resta valor al valor de la aplicación. La ruta de conversión de Evernote es obvia a partir de la llamada a la acción centrada: "Regístrate de forma gratuita".

9. Huffington Post

The Huffington Post es un conocido canal de noticias que informa desde todo, desde política y eventos actuales hasta entretenimiento y tecnología. Lo que hace que su sitio web móvil sea único es que en realidad modifican ligeramente los titulares de los usuarios móviles para que su contenido sea más fácil de escanear.

Si comparas los sitios web de escritorio con los móviles, notarás que el sitio web móvil tiene menos palabras en el página principal. Los titulares son más cortos y mucho más fáciles de digerir: perfectos para alguien que hojee o lea en una pantalla pequeña.

Al igual que con BuzzFeed, encontrará un clic Menú en la esquina superior izquierda de la pantalla con una lista de todas las categorías de publicaciones.

10. Express

Express es una tienda de ropa que atiende a hombres y mujeres jóvenes. Debido a que su audiencia a menudo visita su sitio web para buscar ropa, es importante que incluyan imágenes grandes y claras de su ropa, especialmente en dispositivos móviles, cuando los usuarios deberán tocar elementos en la pantalla con los dedos para hacer clic para información de compra.

Express lleva su experiencia móvil un paso más allá que la mayoría de los sitios minoristas en línea. Si desliza el dedo de izquierda a derecha sobre una imagen que muestra una pieza de ropa, la imagen cambiará para que pueda ver la ropa en una vista diferente. En otras palabras, los usuarios no tienen que cargar otra página para ver varias imágenes del mismo artículo de ropa.

Mire la imagen en la parte superior derecha en las siguientes dos imágenes para ver cómo cambia cuando se desliza a una. lado:

11. Nationwide Insurance

Nationwide Insurance proporciona seguros y servicios financieros. Podría pensar que una compañía financiera tendría un sitio web realmente complicado, pero en Nationwide Insurance se queda con la simple experiencia del usuario.

Cuando llegue al sitio móvil de Nationwide, verá dos pestañas en la parte superior que le permitirán identificar como uno de los dos tipos de usuarios para personalizar su experiencia: personal o de negocios. O, alternativamente, puede "Encontrar un agente" o "Encontrar un asesor financiero" para obtener más información sobre sus servicios.

Aunque la limitación de la experiencia a estas dos opciones excluye las funciones más detalladas de Nationwide, hace mucho Experiencia más fácil para los visitantes que utilizan pantallas pequeñas. Esta es una gran técnica para guiar a los clientes potenciales en la dirección correcta si aún no son titulares de cuentas y visitan el sitio web por primera vez.

12. Squaredot

Squaredot es una agencia con sede en Dublín, Irlanda, que ayuda a los anunciantes a desarrollar sus estrategias de marketing entrante. Su sitio web para dispositivos móviles es colorido, simple y facilita la navegación.

Lo que más me llama la atención son las combinaciones de colores visualmente agradables y la textura tridimensional en su página de inicio, así como los grandes puntos para hacer clic en el centro de en cada sección puede desplazarse a.

Estos puntos son botones de llamada a la acción animados, y al tocar los que están debajo de la pantalla de inicio se abrirá una página emergente con más información sobre Squaredot enfoque de marketing.

13. Zappos

Zappos es un proveedor en línea de zapatos y ropa conocido por su excelente servicio al cliente. Su principal prioridad en dispositivos móviles es ayudar a los usuarios a buscar fácilmente los elementos que están buscando en su sitio web, por lo que han colocado una gran barra de búsqueda en la parte superior e inferior de su sitio web móvil para que sea más fácil para ellos.

Así se ve la parte superior de su sitio móvil:

ABC

ABC es una compañía de transmisión de televisión conocida por sus programas populares como "The Bachelorette", "The Rookie" y "General Hospital". Los usuarios que visitan el sitio web de escritorio de ABC son recibidos con estas opciones y más. Vea el programa de televisión de la red, vea a los ganadores más recientes de los premios Emmy, vea algunos de sus programas de televisión favoritos o incluso vea noticias de entretenimiento relacionadas con esos programas.

Pero como casi todos los hogares de hoy en día son hogares con múltiples pantallas, ABC sabe que su experiencia en un dispositivo móvil debe ser simple y lista para ser vista.

Cuando visite el sitio web de ABC en un dispositivo móvil, verá un fondo oscuro para una experiencia de teatro con azulejos para cada programa que pueda quiero transmitir Los usuarios pueden explorar estas opciones y hacer clic en cualquier programa que quieran según el género, el orden alfabético, lo que es popular y categorías similares que también encontrará en la plataforma de transmisión de su TV.

15. Lean Labs

Lean Labs es una agencia de marketing que crea soluciones web atractivas, receptivas y de alta conversión. (También se incluyeron en la exitosa serie de televisión de ABC Shark Tank .) La gente de allí hace un gran trabajo al brindar una experiencia fluida a sus usuarios móviles, especialmente con respecto a sus técnicas de diseño y el énfasis que ponen en su "fórmula 10x" – que es evidente para los visitantes a los pocos segundos de aterrizar en su sitio móvil.

Observe cómo el sitio web móvil de Lean Labs utiliza escala, contraste y tipo de letra para distinguir ciertos elementos de su página. Incluso puede ver la foto sutil de un conjunto de montaña en el fondo del sitio web, obteniendo las alturas que su marca puede alcanzar como cliente de Lean Labs.

Y, como se explicó anteriormente, su fórmula "10x" es claramente visible y se divide en pasos sencillos para los usuarios móviles que se desplazan por la página de inicio, con iconos relevantes para emparejar .

16. SAP

SAP es una empresa de software empresarial que gestiona las operaciones comerciales y las relaciones con los clientes. El negocio mejora su experiencia móvil al condensar información, específicamente en un importante caso de estudio de video, que se puede reproducir desde la página de inicio en un dispositivo móvil.

SAP también combina algunas de sus llamadas a la acción en controles deslizantes, mientras que su sitio web de escritorio tiene estos CTAs dispuestos horizontalmente. Esto ayuda a mantener las cosas simples para que los usuarios móviles no se sientan abrumados con mucha información a la vez, y también asegura que ninguno de los CTA sea demasiado pequeño para leer.

17. KISSmetrics

KISSmetrics proporciona software de análisis para empresas. En su página de inicio, hay mucha información que explica qué hace el software junto con un testimonio.

Pero su sitio móvil se muestra de forma un poco diferente: en un dispositivo móvil, la información de su sitio se muestra en una lista con alternativas oscuras y módulos de luz. Esto facilita que los usuarios hojeen la página sin perderse en el texto.

También hicieron el texto y los campos en sus formularios grandes y fáciles de leer:

18. idig Marketing

idig Marketing es un proveedor de desarrollo y comunicaciones. Su sitio web móvil está diseñado de manera similar a su escritorio, pero me gustó especialmente la forma en que incorporaron los iconos del corazón interactivos en sus publicaciones del blog para que los usuarios puedan "Me gusta" en sus publicaciones.

Esto imita el icono del corazón "Me gusta" en Instagram y Twitter, que es fácilmente reconocible para los usuarios móviles familiarizados con esas plataformas.

19. IndiaMART

IndiaMART es el mercado B2B en línea más grande de la India, y su tienda móvil simple basada en categorías lo convierte en uno de los mejores sitios web móviles que hemos visto en la industria del comercio electrónico.

Página de inicio móvil de la compañía coloca la barra de búsqueda en la parte superior para que siempre puedas retirarte a una búsqueda personalizada si la navegación ya no es suficiente para encontrar el elemento que estás buscando.

Sin embargo, IndiaMART facilita la lectura de sus pasillos digitales clasificando cada elemento por tipo de elemento, y luego subtipos dentro de cada tipo de elemento: un movimiento de diseño inteligente para alentar a los usuarios a explorar más su sitio. En "Ropa y prendas de vestir", por ejemplo, tiene fichas fáciles de hacer clic para ver categorías de ropa más específicas, como ropa de caballero, vestidos de mujer e incluso trajes, saris y prendas similares nativas de la India.

Debajo de los mosaicos de navegación de IndiaMART, la compañía tiene su propia sección de tendencias específicamente para mercancías a las que la gente presta atención, similar a una lista de noticias de tendencias en una plataforma de medios sociales. Cada categoría de tendencias tiene un botón de llamada a la acción para dispositivos móviles que permite a los usuarios obtener cotizaciones de precios para el producto que les interesa.

¿Desea más información sobre cómo optimizar su ¿Negocio para dispositivos móviles? Descargue el kit gratuito sobre marketing móvil a continuación.

[ad_2]

Source link