Category: Responsive Design

01
Jul

COVID 19 , landing informativa

Punto de información COVID 19 para pacientes

El pasado mes de mayo de 2020 la Plataforma de Organización de Pacientes, con la coordinación de la consultora Nephila, nos encargó la confección de una landing informativa sobre la COVID 19.

En el espacio los pacientes disponen de:

  • Estadísticas de los diferentes casos actualizadas cada 24 horas (casos totales, UCI, hospitalizados y fallecidos)
  • Posibilidad de participación en una encuesta a nivel nacional para conocer el impacto de la COVID (#impactoCOVID)
  • Noticias de actualidad relacionada con la pandemia
  • Obtener datos estadísticos e informe sobre la encuesta
  • Enlace a la clínica legal de la POP

Además de todos los apartados mencionados anteriormente, la página cuenta con un formulario de contacto donde los usuarios pueden inscribirse y recibir noticias de forma periódica.

 

Indicadores ofrecidos en la landing

Indicadores ofrecidos en la landing

Sección de la landing informativa

Sección de la landing informativa

Colaboradores de la iniciativa de la POP

Colaboradores de la iniciativa de la POP

Si también necesitas una página informativa o página de ventas no dudes en contactar con nosotros.

 

08
Ago

Dolor de Cabeza

Asociación Española de Migraña y Cefalea

Hace algunos meses llevamos a cabo el rediseño web y programación de la nueva web de AEMICE coincidiendo con el cambio de naming de la asociación.

Dos de los grandes hitos del proyecto fueron el análisis, estructura y redacción de los contenidos que la asociación ofrece a sus visitantes de su web y el cambio y adaptación a un nuevo CMS más sencillo y moderno.

Rediseño web

El resultado es una web limpia, bien estructurada y con información modular ilustrada mediante iconografía.

Hay tonos fríos (azules) y cálidos (amarillos) con lo que la paleta cromática está basada en su imagen corporativa.

Además el cambio de contenidos y diseño de la web, se incorporaron herramientas para la captación datos como son newsletter y formularios de contacto. El newsletter está enlazado directamente con la plataforma de envío de emails de AEMICE agilizando procesos.

Las secciones de la página aportan información sobre la dolencia y sus tipos, consejos para aliviar el dolor y cómo vivir con el dolor de cabeza.

Dispone de apartados sobre actualidad de la dolencia y la asociación e investigación relacionada con la misma.

En la web también podréis conocer a toda la junta directiva de la asociación, visión, misión y valores así como descargar su memoria anual, estatutos, plan estratégico y cuentas anuales.

POSICIONAMIENTO SEO

También elaboramos un informe SEO con un keyword research, recomendación para la redacción del contenido y recomendaciones técnicas para programar la página web.

Todos los contenidos de la web fueron revisados y adaptados para cumplir con los objetivos del informe inicial SEO.

Desarrollamos el proyecto en colaboración con la consultora especialista en crear e impulsar iniciativas innovadoras dirigidas a pacientes Nephila.

09
Jul

Landing Congreso POP 2019

El pasado mes de Junio iniciamos el desarrollo de la nueva landing page informativa del Congreso de la Plataforma de Organizaciones de Pacientes (POP) que se celebrará en el mes de Octubre de 2019.

Landing, ¿para quiénes? Captura de pantalla de la home de la página web.

Página web del congreso (landing page)

La página web cuenta con diferentes secciones de interés para profesionales, pacientes y familiares que acudan al evento:

Programa. Información sobre los horarios y actividades que se llevarán a cabo durante los dos días que dura el congreso.

Inscríbete. Mediante un formulario de contacto el asistente puede inscribirse en el evento y elegir algunas opciones adiciones del mismo como es el almuerzo del día 3 de Octubre.

Captura de pantalla del formulario de inscripción de la landing para el Congreso POP 2019

Streaming. El día del evento podréis seguir las diferentes mesas de debate y presentaciones desde el sofá de casa o la silla de vuestra oficina a través de la retransmisión on-line del mismo en la landing page.

Prensa. Este apartado es específico para profesionales del mundo de la comunicación y prensa donde podrán encontrar material descargable (posters, notas de prensa, etc.).

Ediciones anteriores. Podréis acceder a información de interés de los dos congresos anteriores celebrados en 2017 y 2018.

Además de información que hay en la página web, podéis seguir los avances y noticias del congreso a través del hashtag #CongresoPOP en Twitter.

Plataforma de Organizaciones de Pacientes (POP)

La Plataforma de Organizaciones de Pacientes se creó en 2014 y defienden en España a 26 organizaciones de pacientes y a más de 10 millones de pacientes.

El objetivo de la POP es promover la participación de los pacientes y defender sus derechos en todos los ámbitos.

Generación de contenidos

El desarrollo del proyecto se ha llevado a cabo en colaboración con la consultora especializada en contenidos para pacientes Nephila.

Si también necesitas una página web donde focalizar la comunicación de tu evento o necesitas la redacción de los contenidos puedes contactar con nosotros.

16
May

El Nanoescopista

Diseño web al servicio de la ciencia

Hace mucho tiempo que no actualizamos nuestro blog para hablar de diferentes temas (diseño web, diseño gráfico, apps, etc.) debido al gran volumen de trabajo que tenemos (por suerte ;D).

Nos hace especial ilusión volver a escribir unas líneas en nuestro blog para hablar sobre uno de los nuevos proyectos que hemos desarrollado y en el cual colaboramos: El Nanoescopista.

Libro del Doctor Jordi Díaz Martos: Nuevas estructuras materiales
Libro del Doctor Jordi Díaz Martos: Nuevas estructuras materiales

El Nanoescopista es un proyecto del Doctor Jordi Díaz cuyo objetivo es acercar la ciencia de la nanotecnología de una forma divertida y rigurosa a niños y adultos.

Si os dais un paseo por la web podréis encontrar información sobre los diferentes libros que ha escrito, talleres y formaciones que imparte así como los diferentes eventos que organiza o en los que paticipa.

Os recomendamos que sigáis su blog para estar al día sobre ciencia.

Diseño web blog de ciencia
Blog de ciencia El Nanoescopista

En cuanto al diseño web de la misma es dinámico, fresco y con una excelente combinación de tonos cálidos y fríos.

El motor de la web es el famoso y conocido CMS WordPress, elegido por su facilidad de uso y su corta curva de aprendizaje.

Sobre Jordi Díaz Marcos

Jordi es doctor en química, ingeniero de materiales y experto en nanoscopía y nanotecnología en la Universidad de Barcelona y experto en comunicación cientifica.

Microscopista en la Universidad de Barcelona desde hace 20 años, Jefe de la Unidad de Técnicas Nanométricas del CCiTUB y Coordinador de Nanodivulga de la misma universidad.

Ha escrito varios libros sobre ciencia, obras de teatro y lleva a cabo varios talleres y cursos divulgativos.

Coordina proyectos de divulgación científica como el Festival nacional 10alamenos9 o proyectos educativos como nanoinventum o nanoeduca, recientemente premiado con el premio nacional de comunicación científica 2018

Portada de la web científica del Festival 10 a la menos 9
Portada de la web científica del Festival 10 a la menos 9

Podréis saber mucho más sobre él y los proyectos que lleva a cabo visitando su página web, redes sociales y/o perfil de Linkedin.

Si queréis una web como la de El Nanoescopista, o mejor, os podéis pasar por la sección de contacto ;D

03
Jul

Creación Nueva Web Responsive Inmobiliaria UISA SAPI

En Elucubración Estudio Creativo nos pusieron un reto. Crear una web 100% responsive para todos los dispositivos móviles del mercado y en la que se pudieran buscar a través de varios filtros todos los inmuebles de la empresa UISA SAPI de Barcelona. UISA SAPi tiene un amplio catálogo de inmuebles, por lo que el reto era aún mayor, pero el resultado fue excepcional. Lo podréis ver en:

http://uisa-sapi.cat/

Además, como ya hemos comentado, la web tenía que ser responsive ya que desde Elucubración ya no concebimos la creación de ninguna página web que no sea responsive. Más aún, teniendo en cuenta que Google penaliza aquellas páginas web que no tiene un diseño preparado para aparecer de forma correcta en todos los dispositivos. Aquí os dejamos un ejemplo de como es la web en versión responsive, pero lo podéis comprobar vosotros mismos entrando en la url.

 

Página web responsive UISA SAPIPágina web responsive UISA SAPI

Si vosotros también queréis que vuestra página web sea 100% responsive, Elucubración Estudio Creativo es vuestra agencia de marketing y comunicación de confianza 😉 ¡Esperamos vuestros emails y llamadas!

22
Dic

Generador de colores para Twitter Bootstrap

Generador de colores mediante una imagen

 Lavish es una herramienta gratuita on-line que os permitirá generar un plantilla de color base para vuestros proyectos con Twitter Bootstrap a través de una imagen.

La herramienta es útil y fácil en dos pasos:

  1. Subes una imagen a la plataforma
  2. Revisas los colores
  3. ¡Descargas o copias y pegas tú código CSS y LESS!

 

Paso 1: Sube la imagen sobre la quieras basar tu tema Bootstrap

Paso 1: Sube la imagen sobre la quieras basar tu tema Bootstrap

Paso 2: Modifica aquellos colores (customiza) que no acaben de convencerte.

Paso 2: Modifica aquellos colores (customiza) que no acaben de convencerte.

Paso 3: Descarga o copia y pega tu código CSS / LESS

Paso 3: Descarga o copia y pega tu código CSS / LESS

¿Es todo perfecto?

No es oro todo lo que brilla… es cierto que la aplicación comete ciertos errores. Hemos detectado que en la class btn-primary no tiene en cuenta el degradado natural de bootstrap, unos segundos en agregarlo y listo.

Pese a estas pequeñas correcciones creemos que es un gran generador de colores y sin duda una herramienta que debéis tener en vuestros marcadores, creednos… ahorraréis bastante tiempo ;D

A tiempo real

Otra de las grandes ventajas de esta aplicación gratuita es que podréis comprobar a tiempo real los colores que habéis generado y/o elegido, permitiendo modificar vuestro trabajo al instante para adaptarlo a las necesidades del Cliente o a la idea que tenéis en vuestra mente.

Para muestra un botón

No estamos muy conformes con el resultado automático generado :((( pero os dejamos con la prueba en el generador de colores con nuestra maceta.

 

 

 

04
Ago

Aplicación gestión de eventos y secretaría virtual

Aplicación gestión de eventos QR y NFC

El pasado día 24 de abril de 2014 vio la luz nuestra aplicación de gestión de eventos de la mano de DENTSPLY Implants en su simposio bianual.
La solución que ofrecimos a DENTSPLY Implants disponía de las siguientes opciones:

Gestión y control online de las inscripciones

Nuestra aplicación de gestión de eventos permite a los asistentes y/o invitados darse de alta y pagar su inscripción de una forma fácil y rápida además de proporcionar información a tiempo real del número de inscritos, fechas y horas de inscripción, métodos de pago y datos de los asistentes a la empresa organizadora del evento.

Aplicación de control de accesos

La solución para eventos dispone de una aplicación para móviles, en este caso para iOS, que permite leer las tarjetas de acreditación de los asistentes mediante un código QR. De esta forma evitamos accesos no deseados al evento y además disponemos información a tiempo real de cuales son los puntos con mayor afluencia de personas, horas elegidas para acceder y/o abandonar el evento.

Pantalla principal de la aplicación para eventos

Pantalla principal de la aplicación para eventos

Generador de acreditaciones

Uno de los puntos fuertes de la solución es el ahorro de tiempos y esfuerzos que supone el generador de acreditaciones. La persona encargada de las acreditaciones puede proporcionar un rango de usuarios para los que desea generar la acreditación. Automáticamente la aplicación genera un documento PDF con las acreditaciones para impresión.

Acreditación para el Simposio DENSTPLY Implants

Acreditación para el Simposio DENSTPLY Implants

Secretaria virtual

Factor humano elevado a la máxima potencia. Con personal profesional y cualificado con más de veinte años de experiencia en la gestión y organización de eventos, dotamos de valor añadido a nuestra robusta solución gestionando y filtrando los datos obtenidos, asistiendo al personal de la marca y a los asistentes al evento.

 

Aplicación de eventos y NFC

Una de las ampliaciones más destacables es la lectura de NFC. Con una pulsera, o en una acreditación convencional con un chip NFC adosado, podemos realizar la lectura de acceso y salida a los diferentes espacios del evento mediante radio frecuencia: Seguridad, rapidez y eficacia son algunos de los adjetivos de valor añadido que caracterízan a esta solución; las pulseras y chips son 100% personalizables, tanto el color como la impresión de logotipo de la Marca y numeración posterior de la pulsera.

Pulsera NFC

Pulsera NFC

Un aspecto que a buen seguro hará las delicias de Directores Financieros y defensores de la ecología es que las pulseras y chips son reutilizables y re programables ¡El ahorro de costes y el respeto por el medio ambiente no están reñidos!

Diferentes posibilidades que puede cubrir la tecnología NFC

Diferentes posibilidades que puede cubrir la tecnología NFC

Además de las funcinalizades comentadas anteriormente, la página web se realizó con el concepto responsive design incluyendo un Twitter Timeline – con el hashtag #SimposioDImostrando todos los tweets que se iban publicando antes, durante y después del evento.

Galería de imágenes del evento de DENTSPLY Implants

Galería de imágenes del evento de DENTSPLY Implants

Video resumen de las dos jornadas del Simposio 2014 de DENTSPLY Implants:

 

Podéis visitar la página web del Simposio DI 2014.

02
Jul

Responsive design o diseño web adaptativo

Recopilación de 10 infografias sobre responsive design

Desde el año 2012 el diseño adaptativo o responsive design está en auge y abre nuevas cuotas de mercado para desarrolladores, agencias y consumidores.

Por diseño adaptativo entendemos aquella aplicación y/o página web que adapta contenidos y formato al dispositivo desde el cual el usuario esta navegando, bien sea smartphone – teléfono móvil inteligente -, tablet y/o portátil u ordenador de sobremesa.

Tenemos muchas razones para migrar nuestras páginas web y aplicaciones – bien si tienes una empresa, organización y/o página personal- a un diseño adaptativo o responsive  design, entre ellas la mejora de experiencia de usuario navegando  por tu página web.  Piensa por un momento en la segmentación de dispositivos en el mercado en los últimos años: el usuario navega cada vez más mediante teléfonos de última generación – como el iPhone, Samsung Galaxy S5 o Sony Xperia X2- y en tablets.

Tal y como reza el titular del post no nos vamos a enrollar desde aquí y os dejamos con una recopilación de 10 infografias sobre diseño web adaptativo que, tanto si eres Desarrollador, agencia y/o cliente te ayudarán en la venta y toma de decisiones.

Por supuesto siempre os dejamos con una previa; una de las infografías que más nos ha gustado tanto por la calidad de los contenidos como por diseño y maquetación.

10 trucos sobre diseño web responsive o diseño web adaptativo, infografía

10 trucos sobre diseño web responsive o diseño web adaptativo, infografía

 

Uso de cookies

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies, pinche el enlace para mayor información. ACEPTAR

Aviso de cookies