¡Es ese momento otra vez! Es hora de nuestro Divi Showcase mensual, donde echamos un vistazo a diez increíbles sitios web de Divi creados por los miembros de nuestra comunidad. Cada mes mostramos los mejores sitios web de Divi enviados por nuestra comunidad y hoy queremos compartir con usted los diez mejores sitios web para el mes de octubre. A lo largo de la publicación, señalaré algunas de mis características de diseño favoritas que me atraen a cada uno de los sitios web.

¡Espero que te gusten!

Divi Design Showcase: nuevas presentaciones a partir de octubre de 2019

1. Bots vs Contras

Este sitio web fue presentado por Wade McMaster. El sitio utiliza una paleta de colores oscuros con texto blanco y azul claro y resaltados en todo. El menú es delgado y está separado de la sección de héroe con una línea azul. La sección del héroe muestra una imagen de fondo con el logotipo y la descripción del sitio en texto grande. Una sección Acerca de muestra información en dos columnas. Me gusta la sección del blog, que se muestra en paralaje sobre una imagen de fondo con una superposición de estilo. Muestra la última publicación de blog con texto a un lado como un CTA para ver el blog y una publicación de blog por el otro en un diseño de tarjeta. Las páginas Fondos de pantalla y Blog muestran publicaciones de blog con un encabezado, una imagen de fondo y una barra lateral. La página de suscripción también es interesante. Muestra el formulario de registro como un CTA con viñetas en un lado para mostrar los beneficios de suscribirse.

Visita la página web

2. Match Design Media

Este sitio web fue presentado por Sam Nicholson. El sitio muestra un video de fondo de pantalla completa con una superposición de degradado. El primer plano muestra el logotipo y los diseños de línea. El logotipo se acerca al pasar el mouse y dos de los elementos de línea desaparecen para crear un interesante efecto de desplazamiento. El elemento más interesante es la forma en que el sitio usa divisores de sección. Coloca una imagen de fondo detrás del divisor y luego coloca un degradado sobre eso. Se colocan contadores numéricos o contadores circulares sobre ellos. El sitio utiliza muchos degradados y texto con estilo para que coincida. Los botones incluyen los mismos gradientes que los fondos. Los servicios se muestran con un diseño alternativo e incluyen imágenes que se inclinan al pasar el ratón. La sección Carreras y la sección Contacto incluyen el mismo efecto de inclinación. Tiene muchas animaciones pequeñas, como líneas que se inclinan al cargar.

Visita la página web

3. Propiedad Pop

Este sitio web fue presentado por Kaelynn Midgley. Muestra un degradado de fondo de ancho completo con un CTA en un lado y una imagen dentro de un dispositivo móvil en el otro. El desplazamiento revela información en un lado con un CTA e imágenes de propiedades en el otro con una imagen colocada dentro del contorno de una computadora portátil. Diseños similares continúan en todo el sitio. Mi favorito es la sección sobre la comunidad. Incluye un diseño de dos columnas con una imagen de fondo con una propagación superpuesta que incluye una imagen, texto y un botón, e información en el otro lado. La página Cómo funciona muestra cada paso en pantalla completa con un color de fondo diferente para cada uno. También me gusta la página del blog, que incluye una sección de héroe, texto de información, un divisor y luego las publicaciones del blog. Las publicaciones agregan una sombra de cuadro a la imagen presentada. El menú incluye un CTA.

Visita la página web

4. Patria

Este sitio web fue presentado por Jerome Bestel. Incluye muchos gráficos en todo el sitio, comenzando con la sección de héroe, que muestra un gráfico grande a un lado y un CTA en el otro. El desplazamiento muestra una sección de dos columnas con un gráfico más pequeño a un lado con un botón de llamada en el que se puede hacer clic e información en el otro lado. Este diseño se alterna hacia abajo en la página a medida que se desplaza. Se proporciona otra información dentro de blurbs. Un control deslizante le permite mover un cursor y seleccionar un precio. La información sobre el equipo se proporciona con imágenes borrosas e incluye gráficos para imágenes. El sitio utiliza un diseño minimalista y mucho azul para que el texto y los fondos atraigan al público objetivo. Cada una de las páginas sigue un diseño similar pero aún tiene algo único. El menú incluye un CTA de contacto y un enlace de llamada en el que se puede hacer clic.

Visita la página web

5. ChangeUp para la caridad

Este sitio web fue presentado por Dickon Kent. Tiene un degradado de fondo de ancho completo con un gráfico en un lado detrás de un CTA y un conjunto de imágenes en el otro lado que muestra la aplicación en teléfonos móviles. Las siguientes secciones muestran texto con un divisor y un título azul a la izquierda y un teléfono inteligente con una imagen de la aplicación y gráficos circundantes a la derecha. El texto y los gráficos se deslizan a su lugar a medida que se desplaza. Un control deslizante muestra logotipos sobre un fondo estampado con un degradado. Un control deslizante testimonial de ancho completo incluye la imagen, el testimonio y la navegación de puntos y flechas sobre el fondo azul que coincide con el sitio. La información se proporciona dentro de borrones que incluyen íconos dentro de un círculo que coinciden con el estilo del sitio. El sitio hace un excelente uso de los colores y degradados de marca azul y verde.

Visita la página web

6. Rebbl

Este sitio web fue presentado por Dickon Kent. Este sitio utiliza un mega menú interesante con texto más pequeño debajo del texto principal. Al pasar el cursor sobre uno de los enlaces, se abre el menú para mostrar más enlaces e imágenes. La primera sección de la página de inicio muestra una imagen de ancho completo con espacio en un lado para un CTA y los productos en el otro lado. El desplazamiento revela un CTA de ancho completo que muestra el producto y proporciona un enlace a la tienda. Una sección de blog muestra categorías como tarjetas de blog. Al hacer clic en uno, se abre la página de archivo de esa categoría de blog. Las publicaciones del blog se presentan en tarjetas grandes con la categoría centrada entre la imagen y el extracto. Un formulario de suscripción delgado muestra el texto y el formulario sobre un patrón de fondo. La información sobre la compañía y los productos se muestra en una sección de dos columnas con grandes CTA. Me gusta el video CTA que muestra un video de fondo con un título y un botón en la superposición. Un control deslizante de Instagram incorporado proporciona información sobre el desplazamiento y abre la información en un modo al hacer clic.

Visita la página web

7. Juventud, ¡habla!

Este sitio web fue presentado por Michal Teska. Es un diseño de una página que muestra una imagen de fondo de pantalla completa en paralaje con una superposición altamente opaca. La superposición incluye un eslogan y un gráfico. Todas las secciones tienen un diseño de dos columnas con texto en el fondo en paralaje con un gráfico en primer plano y texto en el otro lado. Este diseño se alterna a medida que te desplazas. Una de estas secciones tiene conmutadores diseñados para coincidir con el sitio. La información sobre las personas involucradas se crea con imágenes borrosas que tienen una imagen en miniatura a la izquierda y su nombre y ubicación a la derecha. Los logotipos de los socios se muestran en escala de grises y cambian de color al pasar el mouse.

Visita la página web

8. AWEOS

Este sitio web fue enviado por Christos Papadopoulos. Un fondo animado crea el efecto de una configuración submarina con gráficos de dibujos animados. Un CTA con un lema y una imagen animada se asienta sobre el fondo. Un mega menú revela tres columnas de enlaces e imágenes. La siguiente sección proporciona información e incluye un enlace de llamada en el que se puede hacer clic y un enlace de consulta. Los miembros del equipo se muestran con una imagen, nombre, título, descripción y un botón para escuchar un mensaje de audio de esa persona. Los servicios se muestran dentro de borrones que incluyen iconos debajo del texto. La página del proyecto muestra ejemplos dentro de una tarjeta que se desplaza al pasar el mouse. Cada una de las páginas de Servicios sigue un diseño similar, que incluye un encabezado con una descripción y un enlace, seguido de información detallada. La página del blog y las publicaciones siguen un diseño de encabezado similar.

Visita la página web

9. Marci Angeles

Este sitio web fue presentado por Marci Angeles. El encabezado y el pie de página permanecen en la pantalla mientras se desplaza. Son transparentes, por lo que el diseño se muestra a través. La página de inicio muestra un fondo azul y varias imágenes de muestras de trabajo. Al hacer clic en una imagen, se abre la página de ese proyecto donde puede ver los detalles sobre el proyecto. Cada una se muestra como una publicación de blog e incluye una imagen destacada, descripción, imágenes, navegación a las publicaciones anteriores y siguientes, y un formulario de contacto. El pie de página no permanece en pantalla en las páginas del proyecto. El encabezado y el pie de página tienen un diseño simple y limpio. El encabezado incluye enlaces a otros sitios por parte del propietario, que usan colores suaves similares como este. El pie de página incluye enlaces a las redes sociales. Ambos tienen líneas que los separan del cuerpo del sitio.

Visita la página web

10. ATG Europe

Este sitio web fue presentado por Camiel Bos. El encabezado de pantalla completa muestra un video de fondo con un título y un eslogan en la esquina inferior izquierda de la pantalla. Tiene un mega menú y muestra enlaces y publicaciones al pasar el ratón. En el desplazamiento, verá que el menú se vuelve blanco y tiene un borde curvo y refleja la parte inferior de la sección de video. La información se proporciona en la siguiente sección e incluye un gráfico que coincide con el tema del sitio. Las industrias que se atienden, las soluciones y los servicios se muestran en imágenes en paralaje. Un CTA de contacto muestra el título y el botón sobre una imagen de fondo e incluye divisores de sección curva para la parte superior e inferior para crear un diseño interesante. El sitio utiliza muchos divisores de estilo, patrones de fondo y elementos superpuestos que se destacan muy bien y conservan un diseño limpio.

Visita la página web

Por Prunaestudio

Por Prunaestudio

Prunaestudio es un estudio de diseño web ubicado en Valencia (España). Estamos especializados en el diseño web basado en WordPress con la plantilla premium de Elegantthemes, Divi.

* Todos el contenido pertenece y se ha traducido del blog de Elegantthemes (Divi Resources)

Nuestras últimas entradas

You have Successfully Subscribed!