Nuevo diseño web para empresa de maquinaria industrial

Hoy os queremos presentar uno de los proyectos en los que hemos trabajado este año: el nuevo diseño para la web Josep Muntal.

Se trata de una empresa dedicada al sector de la maquinaria industrial para la deformación metálica a nivel mundial, con más de 25 años de experiencia a sus espaldas y presencia en múltiples ferias internacionales.

diseño web

El encargo para nuestro equipo es el rediseño de la web, buscando una imagen más moderna, profesional y adaptada a las nuevas necesidades tecnológicas.

Así, el resultado es un diseño web 100% responsivo y coherente, usando los colores corporativos e intentando transmitir los valores de la empresa.

diseño-web

Ledel Branding sigue trabajando

En Ledel nos tomamos muy en serio la seguridad de nuestro equipo, así como nuestro fuerte compromiso con nuestro trabajo y clientes.

Ante todo, esperamos que tu estado de salud, así como el de tus familiares y allegados, no se esté viendo perjudicado por la crisis sanitaria que azota nuestro país actualmente.

Esta situación nos ha obligado a tomar las precauciones necesarias de seguridad para proteger a nuestros empleados, que a su vez nos permiten ofrecer nuestros servicios con la máxima normalidad posible. Así, tras las medidas impuestas en referencia a la crisis sanitaria, seguimos en activo en modalidad de teletrabajo.

Nuestro compromiso

 

El equipo creativo de Ledel Branding pone a tu disposición su conocimiento y experiencia, ofreciendo todos sus servicios con normalidad:

 

  • Diseño y desarrollo web: creamos la página que tu empresa necesita, centrándonos en su accesibilidad y en un diseño llamativo acorde a la temática del negocio.
  • Branding: damos forma a tu proyecto, analizando tu target y transmitiendo los valores de tu marca.
  • Printing: diseñamos todo tipo de piezas gráficas corporativas (catálogos, folletos, revistas…).

 

¿Y si aprovechas esta situación para impulsar tus proyectos y tu presencia online? Contacta con nosotros mediante el correo hello@ledelbranding.com y te asesoraremos en todo lo que necesites.

Ventajas de la intranet corporativa

Disponer de una intranet corporativa tiene muchas ventajas, ya que se trata de una herramienta de lo más útil que está cobrando especial importancia en la actualidad, dado el actual aumento del teletrabajo.

Es por eso que en esta entrada del blog os contamos los principales beneficios de crear una intranet corporativa o portal de empleados.

Comunicación centralizada y colaboración entre empleados

La primera de las ventajas de la intranet corporativa es que implica un sistema de comunicación único y centralizado, hecho que facilita mucho la transmisión de información. 

Es un sistema perfecto para hacer llegar mensajes al conjunto de empleados de forma rápida y práctica, fomentando también la participación de éstos.

Así, cada empleado tiene la oportunidad de interactuar y comunicarse tanto con la empresa como con sus compañeros, simplificando la colaboración y mejorando el ambiente laboral.

Ahorro de tiempo y costes

Crear un portal de empleados requiere de cierta inversión inicial, pero a medio y largo plazo supone un ahorro de tiempo y de costes. ¿Por qué? Porque al tener toda la información centralizada, los empleados tardaran menos tiempo y recursos a su búsqueda.

Además, el hecho de poder hacer llegar la misma información al conjunto de trabajadores que decidamos nos ahorra también mucho tiempo, ya que dicha información queda almacenada y puede ser consultada posteriormente.

Mejora de la seguridad

Implementar una buena intranet para tu empresa ayudará enormemente a la seguridad de ésta.

Gracias a esta herramienta, la empresa podrá poner documentación y/o archivos a disposición de los empleados que deseen. Por ejemplo, podrá ofrecer ciertos documentos a un grupo de usuarios determinados y no a otros.

¿Os parece poco? 

No dudéis en contactar con el equipo de Ledel Branding para conocer proyectos de portales en los que hemos trabajado y/o obtener un presupuesto para vuestra propia intranet corporativa.

Proyecto web para el estudio de arquitectura Pinearq

El proyecto de nuevo diseño web para el estudio Pinearq es un buen ejemplo de restyling y renovación de la página corporativa de una empresa.

Nuestro cliente es un importante estudio de arquitectura con sede en Barcelona y delegaciones en Italia, Portugal, Panamá y Perú, que cuenta con un amplio recorrido a sus espaldas. Se trata de una firma de arquitectura que se ha especializado en el sector sociosanitario y educativo, como puede verse con proyectos como la remodelación del Hospital del Mar (Barcelona) o la intervención en la Facultad de Económicas y Empresariales de la Universidad de Granada.

Página principal - Home Página principal – Home

El encargo para el equipo de Ledel Branding fue el nuevo diseño web del estudio, que incluía además un estudio de optimización y reorganización de los contenidos de la página. De esta forma se consiguió adaptar la web a los actuales estándares de navegación, con mayor número de contenidos gráficos y menor número páginas.

Así, la nueva web cuenta ahora con un menú superior con cinco elementos:

  • Estudio: da a conocer la historia de Pinearq, así como sus premios, principios y compromiso con la sostenibilidad. Incluye también un apartado final con el equipo del estudio, para añadir cercanía y proximidad con los posibles clientes.
  • Proyectos: muestra todos los proyectos de Pinearq, con opción a seleccionar y/o buscar con siete filtros.
  • Lab: compromiso del estudio en referencia a nuevas colaboraciones e ideas relacionadas con la creación de ambientes urbanos más saludables.
  • Noticias: blog corporativo, con opción a filtrar las noticias con filtros.
  • Contacto: mapa, sedes y formulario de contacto.

Contacto - Pinearq Contacto – Pinearq

Nuevo diseño web para H2B

El nuevo diseño web para H2B ha sido uno de los últimos proyectos en los que Ledel ha participado. Se trata de una empresa que, desde hace más de 10 años, ofrece soluciones hipotecarias personalizadas a sus clientes gracias a sus acuerdos bancarios privilegiados.

H2B nos encarga el diseño de su web siguiendo la línea creativa marcada por otros elementos gráficos ya preestablecidos como el logotipo.

Así, se crea un diseño web que mezcla la sencillez del color blanco con la viveza del magenta. Esta combinación cromática transmite decisión y confianza, valores fundamentales a la hora de contratar una hipoteca. Se elabora una landing page fluida que engloba los valores de la empresa, el equipo y el formulario de contacto.

Inicio

El punto fuerte de H2B es el formulario para recibir una propuesta hipotecaria personalizada, que se diseña siguiendo el mismo estilo que la página principal y que cuenta con una interfaz interactiva por pasos que proporciona una experiencia de usuario de lo más cómoda.


Primer paso del formulario

7 tendencias de diseño web para 2020

¿Quieres conocer las tendencias en diseño web para el próximo 2020? Ya seas diseñador/a web o simplemente un apasionado de este sector, en este artículo encontrarás las claves y herramientas que más se utilizarán de cara al año que viene.

Gigantismo

Tal vez una de las tendencias que ya se ha ido viendo durante este 2019 y que seguirá en el próximo año sea incluir una imagen que ocupe toda la pantalla del ordenador. Además, es buena idea acompañarla de una tipografía que acompañe su proporción, siempre teniendo en cuenta que se debe ajustar a los distintos tamaños y resoluciones de pantalla.


Ejemplo de gigantismo

Efectos hover

¿Sabes cuando pasas el ratón por encima de un elemento y éste cambia de color o se altera? Eso es el efecto hover, y parece que ha llegado para quedarse. De hecho, se espera que esta herramienta usada hasta el momento para pequeñas áreas de la web, pase a utilizarse a partes de mayor tamaño (bloques completos, imágenes…).

Colores llamativos y minimalismo

Siguiendo con esta tendencia de 2019, serán prácticamente de uso obligatorio los colores vibrantes y llamativos. Este tipo de diseño se adapta a la perfección a la navegación desde smartphones, ya que facilita mucho la navegación y tarda menos en cargar.

Nuestra web: minimalista y llena de color

Barras adhesivas

Son aquellos elementos que, a pesar de hacer scroll, se quedan fijos en la pantalla. Es bastante típico en webs de e-commerce ya que ayudan a aumentar las conversiones y ventas online, pero es importante estudiar bien su diseño para no entorpecer la navegación.

Diseños asimétricos

Lo que hace unos años parecía una imagen caótica y poco organizada, se convertirá en una de las tendencias más utilizadas. Es un tipo de diseño que casa muy bien con las tipografías y colores llamativos anteriormente comentados, pero hay que prestar atención a no crear un exceso de asimetría que resulte agotador para los usuarios.

Web con diseño asimétrico

Dinamismo y storytelling

Los elementos dinámicos seguirán siendo uno de los pilares más relevantes en el diseño web del año que viene; y de hecho, las animaciones serán un método excelente para el storytelling de la web. Es una herramienta original que aporta un resultado muy visual, pero hay que tener en cuenta que no sirve para todas las webs, sino que su uso dependerá de su tipo de contenido.

Contenido dividido o fusionado

Se trata de un recurso mediante el cual el contenido de la web se encuentra partido por la mitad, ofreciendo unas características diferentes en cada lado. Es una técnica muy atractiva y con tendencia al alza.

Ejemplo de contenido dividido, extraído de Max Camuñas

¿Cómo crear un buen portfolio?

En el mundo del diseño y las profesiones más creativas -fotografía, modelado, arquitectura, etc.- crear un buen portfolio que destaque entre los demás puede marcar la diferencia entre conseguir un empleo o no.

Se trata de tu carta de presentación, de una selección de los proyectos que has realizado a lo largo de tu carrera profesional o incluso aquellos creados por hobby. 

Acuarela

Pero, ¿cómo hacer que tu portfolio triunfe en un mundo tan competitivo?

Webs especializadas

Una de las primeras cosas que debes tener en cuenta antes de crear tu portfolio es decidir qué web vas a utilizar para ello, ya que es una herramienta fundamental en el sector artístico para auto-promocionarte.

Tal vez la web más usada sea Behance, en especial en el ámbito del diseño gráfico y la fotografía, y con proyectos realizados con el paquete Adobe. Es una web muy sencilla de utilizar que te permite etiquetar tus publicaciones con palabras clave que aumentan la visibilidad.

Otra opción muy válida es Artstation, plataforma de creativos en especial del mundo digital, concept artists, animadores 3D y similares. Se trata de una comunidad muy completa que incluye tutoriales, artículos de temática relacionado e incluso ofertas de empleo.

Homepage de Artstation.

Por otro lado, si dominas algo de diseño web tal vez la mejor opción para ti sea WordPress, ya que con él puedes crear y configurar tu portfolio de forma muy profesional. Cuenta con un sinfín de plantillas y plugins que permiten una gran personalización de la web. 

Pero si por el contrario no sabes nada de diseño web, tu mejor elección es Wix, un sencillo editor que te permite crear un portfolio a modo de web profesional.

Estas dos últimas opciones -Wordpress y Wix- son gratuitas, pero se puede pagar un dominio personalizado.

¿Y el contenido?

Una vez has decidido qué plataforma usar, toca escoger aquél contenido que se publicará, ya que no es recomendable subir absolutamente todos tus trabajos. Es mejor no saturar a la persona que vea el portfolio y publicar una selección de tus mejores obras

Artista dibujando en el metro

Asimismo, conviene que el contenido siga una misma línea gráfica y unas mismas tonalidades de color, ya que de este modo es mucho más estético y visual. En este sentido, debe haber una estructura coherente que una todo el portfolio, estableciendo cuidadosamente el orden de los trabajos.

Por ejemplo, conviene no poner al principio todo lo mejor, ya que provocaremos sensación de ir descendiendo en calidad. Así, es mejor ir alternando el contenido para mantener la atención del observador; pero eso sí, es importante cerrar el portfolio con un buen trabajo para que eso sea lo último visto. 

Otro detalle a tener en cuenta es la resolución de nuestros proyectos, que debe ser siempre la óptima para causar una buena impresión y transmitir calidad. 

Finalmente, uno de los detalles más importantes -y que a veces se nos olvida- es incluir nuestra información de contacto. Es muy importante asegurarnos de que ésta esté en un lugar visible y que sea fácilmente leíble.

Estos serían los aspectos básicos que deberías tener en cuenta a la hora de crear tu portfolio, ¡no olvidéis visitar el nuestro!

¿Cómo diseñar una buena homepage?

A la hora de crear una web, es de vital importancia pensar cómo queremos que sea su carta de presentación; o lo que es lo mismo, su homepage, landing page o página de inicio. Debemos ser capaces de diseñar una buena homepage que consiga que los usuarios quieran seguir navegando para así acceder a más contenido de nuestra web.

¿Qué incluir en la homepage?

La página de inicio debe exponer cierta información clave sobre la empresa o blog para que el usuario siga navegando, pero sin llegar ésta a ser excesiva para no provocar el efecto contrario. 

  • Debe incluir un menú principal que incorpore un resumen del servicio que ofreces, de la temática del blog, etc. Conviene una interfaz intuitiva y sencilla, seleccionando aquellos aspectos más importantes y sin demasiado texto.
  • El usuario debe encontrar fácilmente los datos de contacto, ya que de lo contrario se puede cansar y abandonar la página antes de contactar contigo.
  • Tanto en la homepage como en el resto de páginas, debe aparecer el logotipo de la empresa o marca, normalmente en la parte superior a la izquierda o en el centro.
  • Debe haber un footer o pie de página donde colocar toda la información corporativa y legal, así como los enlaces a redes sociales en caso de tenerlos.
  • El contenido no debe ser repetitivo pero sí es adecuado incluir palabras o conceptos que te ayuden con el posicionamiento web.

Es importante crear un diseño atractivo que llame la atención del visitante. En este punto entraría el uso de imágenes de calidad que muestren de forma realista el servicio o producto que ofreces.

Pensando en el smartphone

Algo a tener en cuenta es el incremento del uso del teléfono móvil o tablet para navegar por internet en lugar del ordenador. Es por eso que debemos buscar un diseño para la web que sea responsive, es decir, que se adapte perfectamente a los distintos tipos de dispositivo. Así, en los últimos años se suele priorizar un diseño web pensado en primer lugar para smartphone, y en segundo lugar para ordenador.

smartphone

Pero, ¿cómo se traduce esto al diseño de una página de inicio?

Para empezar, debemos tener en consideración el tipo de navegación que se utiliza en un teléfono: el scroll. Esta técnica de desplazar el dedo implica que el usuario emplea menos tiempo en leer el contenido, atendiendo solo a los elementos más destacados. 

Es por este motivo que muchas empresas optan por un diseño one page donde se concentra toda la información en una única página, prescindiendo cada vez más de amplios menús. En caso de optar por esta alternativa, es fundamental buscar un orden coherente para la información en función de la importancia que le des a cada aspecto. Conviene separar cada elemento dejando cierto espacio entre ellos para que el usuario pueda ver claramente que se trata de distintos bloques.

Otro aspecto relacionado con el diseño pensado para teléfono es el del tamaño de las imágenes. Cada vez se utilizan más fotografías de gran tamaño, para que éstas puedan ser vistas y apreciadas sin problemas desde una pantalla pequeña. 

 

Optimiza tu contenido

En función del producto o servicio que ofrezca tu web, conviene echar un vistazo a algunas recomendaciones: 

  • Servicios o portfolio: conviene incluir un resumen de lo que ofreces, a poder ser acompañado de imágenes u otros soportes gráficos para que sea fácil de visualizar.
  • Tienda online: incluye tu producto en la homepage, destacando los más importantes, ofertas o novedades, y con enlaces a “añadir a la cesta” para que el usuario pueda seguir navegando cómodamente.
  • Blog: se deben mostrar las entradas resumidas, con opciones de “leer más” para que el visitante pueda decidir qué post le interesa leer más.

Finalmente, te recomendamos que vayas actualizando la página web para que transmita novedad, movimiento y dinamismo; así el usuario sabrá que la tiene que volver a visitar.

Te dejamos aquí el enlace para que veas las distintas páginas web en las que hemos trabajado; y otro enlace aquí para que veas ejemplos de one page de distintos diseñadores.

Branding y diseño web para APSIA

Una de las empresas que solicitó nuestros servicios de branding y diseño web fue APSIA, dedicada a la atención psicológica a niños y adolescentes. El encargo que se nos pedía era crear una identidad de marca y una web corporativa que permitiera transmitir al público los valores de la empresa. A su vez, buscaban cierto posicionamiento y diferenciación del resto de competidores.

El logotipo

Al tratarse de una empresa dedicada al mundo de la psicología, decidimos jugar con el propio nombre APSIA y el símbolo de la psicología por excelencia: la letra Psi (Ψ). Esta letra del alfabeto griego se asocia con la palabra de origen griego Psyche, que anteriormente significaba “mariposa” hasta que fue evolucionando y llegó a “alma”. Así, la palabra “psicología” está formada por el prefijo Psico- (psyche, alma) y el sufijo -logía (logos, ciencia).

Por extensión, el símbolo Ψ se popularizó para hacer referencia a la ciencia del alma o de la mente. Por este motivo decidimos crear un logotipo para APSIA básicamente tipográfico, con letras de estilo clásico para combinar a la perfección con esta letra griega.

Branding - Logotipo para APSIA Branding – Logotipo para APSIA

Otro factor a tener en cuenta era el color que se iba a utilizar, ya que éste define un escenario de valores emocionales concretos que se deben tener en cuenta a la hora de plasmarlos en cualquier soporte de comunicación. Así, se opta por usar un azul (Pantone 319) y un gris (Pantone Process Black al 50%) que ayudarán a transmitir esa cercanía y confianza necesaria en una empresa de este tipo.

Además, ambos colores emanan profesionalidad y neutralidad, valores muy valiosos también en el sector de la salud.

Dossier de identidad corporativa Dossier de identidad corporativa

El diseño de la web

Posteriormente se nos pide el diseño y desarrollo de la nueva página web corporativa de APSIA, que continúa con el mismo patrón creativo. Se sigue haciendo uso de los dos colores seleccionando para el logotipo, el azul y el gris, que ayudan a comunicar esa sensación de proximidad, naturalidad y profesionalidad.

Diseño web - Home Diseño web – Home

El reto del diseño del proyecto EQO

El encargo del diseño del proyecto EQO, una consultoría internacional centrada en el sector del medio ambiente, ha sido todo un reto para nuestro estudio. Se trata de una compañía que tiene como principales campos de acción el cambio climático, la energía y la economía sostenible.

Branding

En el momento de su creación, EQO busca posicionarse en el mercado a través de una imagen limpia e innovadora, de modo que para el branding decidimos usar colores vivos que transmitan esa frescura deseada. Debido a que la consultoría tiene un importante compromiso con el medio ambiente, optamos por usar un elemento gráfico que recuerde a una hoja de árbol.

Diseño de tarjetas corporativas - EQO
Targetas corporativas

El diseño web

En cuanto a la página web, se realiza un diseño y una posterior maquetación sobre WordPress. Por tal de presentar los distintos servicios que ofrece la consultoría, se hace uso de iconografías y fichas, de manera que la información queda ordenada de forma fácil e intuitiva. Además, se añade un menú interactivo construido con JavaScript y SVG que realiza una animación siguiendo el puntero del ratón.

Diseño web - EQO
Menú interactivo de la página web

Printing

Para terminar, EQO solicita el diseño de una carpeta corporativa que a la vez sirva de presentación para sus clientes. Se tratará de un documento que deberá incluir un contenido extenso, de manera que se busca organizarlo de la forma más visual posible. Para lograr esta fácil lectura y una sensación de simpleza, se opta por usar elementos gráficos como iconos que permitan estructurar toda la información.

A su vez, puesto que se trata de una empresa joven y que quiere transmitir innovación y nuevas ideas dentro de su sector, se sigue en la línea de una identidad corporativa moderna. Esto se consigue gracias al intenso color naranja principal, que contrasta con los demás tonos más sobrios. Finalmente, el bolsillo interior porta-documentos queda perfectamente integrado en la carpeta, resultando prácticamente inapreciable.

Diseño de carpeta corporativa - EQO
Exterior de la carpeta corporativa

 

Diseño de carpeta corporativa - EQO
Interior de la carpeta corporativa

Gutenberg, nuevo editor de WordPress

Con casi 10 años de experiencia a sus espaldas, WordPress es seguramente uno de los sistemas de gestión de contenido (CMS) más conocidos a nivel mundial. Se trata de un software de código abierto que permite crear desde blogs hasta páginas web corporativas más complejas de manera gratuita e intuitiva.

Por si fuera poco, este práctico gestor de contenidos dispone de un gran número de plantillas en su página oficial, de manera que la experiencia de creación es altamente personalizable.

Pero aunque WordPress sea ya de por sí de uso sencillo, su creador Matt Mullenbeg anunció que quiere cambiar el editor por un sistema de bloques, el llamado Gutenberg. De hecho, este sistema ya existe como plugin dentro del propio WordPress, de manera que puede ser usado en su versión beta. Así, hasta su lanzamiento a finales de noviembre podrá utilizarse esta versión, siempre teniendo en cuenta las limitaciones que supone estar en una fase tan temprana de desarrollo.

Pero, ¿qué es Gutenberg?

Gutenberg busca revolucionar WordPress y basarse en un sistema de bloques muy visual y que simplifique la tarea del gestor de contenidos. Así, si probamos este nuevo editor podremos ver algunas diferencias con el editor actual de WordPress. Para empezar, el espacio de escritura de Gutenberg es bastante más amplio, haciendo que el usuario se centre principalmente en escribir sin preocuparse de otras distracciones.

Editor Gutenberg

 

Además, con el sistema de bloques, cuando queramos insertar una imagen, un encabezado o simplemente otro párrafo, nos limitaremos a hacer clic en “Insertar” y seleccionaremos la opción que deseemos en el menú desplegable que aparecerá.

Por otro lado, aunque el modo de edición HTML también está disponible con Gutenberg, éste está algo más escondido que con el editor actual de WordPress. Mientras que ahora la tarea de cambiar entre editor visual y HTML se realiza mediante un simple clic, con Gutenberg hay que seleccionar el bloque que queramos editar y desplegar un pequeño menú.

Las limitaciones

Debido a su temprana etapa de desarrollo, el sistema Gutenberg cuenta aún con ciertas limitaciones que afectan a su correcto funcionamiento. Son muchos los usuarios de WordPress que reportan problemas con el nuevo sistema de bloques, desde atajos de teclado que no funcionan hasta errores en el código HTML.

De momento, desde su cuenta oficial de Twitter, WordPress ya ha anunciado el lanzamiento de la versión 5.0 Beta 5, hecho que ha causado un gran revuelo en las redes sociales. Eso sí, cabe señalar que aunque al lanzar la versión 5.0 el editor predeterminado será Gutenberg, parece que seguirá existiendo la opción de usar el editor clásico para aquellos que tengan problemas de compatibilidad

Nuevo diseño web para REHACSA

Uno de los proyectos en los que Ledel Branding ha trabajado ha sido el nuevo diseño de la página web de la constructora REHACSA.

Se trata de una empresa que inició su trayectoria en 1989 y que se especializó en la reforma, rehabilitación, ampliación y adecuación de edificios, en patología de la construcción y en obra nueva. Gracias a su experiencia y a su trayectoria, es una de las empresas más reputadas en su ámbito, y desde el año 2014 forma parte del Grupo Empresarial ROGASA.

Así, nos llega el encargo del diseño de la web corporativa de REHACSA. Al formar parte del grupo ROGASA, se opta por unificar diseño y concepto y crear una misma línea para las dos. El resultado es una web con una imagen moderna e innovadora, pero sin perder ese toque de seriedad que requiere una compañía como esta.