diseño: ideas creativas que ayudan a vender
DESCRIPTION
"Mejorando mi sitio web"Diseño: ideas creativas que ayudan a venderPresentación de Vanesa GambirazioTRANSCRIPT
Diseño para Pymes 2.0
Vanesa Gambirazio
Senior Web designer
ID4you Founder | Project and Account Director
@vaneid
Rediseñando sites ‐Interfaces 2.0: Diseños a medida vs. CMS
Características gráficas y estéticas de la web 2.0:
* Colores saturados y brillantes
* Bordes redondeados
* Brillo y volumen de los elementos
* Formas redondeadas ‐ iconografía
* Entorno de espacio suspendido
* Sombra inferior esfumada
* Fondos claros de interfaces
* Degradados suaves
* Estructuras contenedoras modulares
Interfaces 2.0Estilos gráficos de la web 2.0
Caracteristicas gráficas y estéticas de la web 2.0:
Estilos gráficos de la web 2.0
Características de los Diseños a medida:
• Requieren un diseño y estructura de la información únicos.
• Llevan muchas horas de trabajo para el diseño, maquetado e implementación.
• Tienen un costo elevado al inicio para el desarrollo del backoffice.
• No requieren upgrades de actualización. Ni mantenimiento.
• Para cada nueva actualización requiere horas de inversión para instalar nuevas
funciones y cambios.
• Es menos flexible a la hora de introducir cambios.
Ej: APSOT www.apsot.com
Diseños de sitios a medida
Diseño a medida para sitio institucional programación a medida en ASP.net
Apsot Diseño a medida para Cobertura médica
Diseños de sitios realizados con CMS (controladores de contenidos):
• Se trabaja el diseño sobre la estructura de un template.
• Llevan menos horas de trabajo para el diseño, maquetado e implementación.
• Tienen un costo medio al inicio para el desarrollo del backoffice.
• Requieren actualización de nuevas versiones de upgrades.
• Es más flexible a los cambios.
• Para cada nueva actualización las comunidades tienen desarrollos muy variados de
módulos que permiten actualziar nuestro site de forma más rápida. Ej. Un widget de
redes sociales.
Ejemplos de CMS:
Joomla ‐ Jomsocial (comunidad), Wordpress, Budypress (comunidad), Drupal, etc.
CMS Controladores de contenidos
Diseño modular y dinámico.
Customización de template de Wordpress
Diseño modular y dinámico.
Interfaces 2.0Customización de template de Joomla
Aplicaciones integradas en el diseño de un site. (Flickr‐ Nubes de tags‐ Rss – Redes Fb Tw)
Customización de template de Wordpress
Controladores de contenido. CMS para blog con Word Press
Customización de template de Wordpress
Controladores de contenido. Blog con Word Press
Customización de template de Wordpress
Comunidad Paw (Joomla sobre diseño a medida)
El cliente buscaba comunicar su tarjeta de beneficios para el consumidor final.
Comunidad con joomsocial
La implementación de un Jomsocial sobre template.
Found Organic (Joomla sobre diseño a medida)
Found organic.com.auCaso extremo de cómo se puede dejar de notar la estructura de template.
Controladores de contenido. Drupal para sitio MTV
Interfaces 2.0
Ecommerce 2.0: Tiendas online y tiendas en redes
a) Sistemas desarrollados a medida para productos y servicios:
• Se realiza sobre un diseño a medida. Permite mucha flexibilidad.
• Se desarrollan en los servidores del cliente.
• Permiten actualizar los productos, servicios y precios.
• Se administra a través de un backoffice y de bases de datos propias.
• Requiere más tiempo e inversión inicial, pero no tiene comisión por transacciones.
• Se puede realizar una integración con dinero mail o paypal, ó un envío de mail para
reserva de compra.
•Ej . www.ladrillosnorte.com.ar
E commerce y Tiendas online
a) Diseño y desarrollo a medida para corralón de materiales. www.ladrillosnorte.com.ar
E commerce y Tiendas online
b) Soluciones enlatadas:
• El diseño se trabaja dentro de las posibilidades que brinde la solución, o con selección de
templates que ofrezca la herramienta.
• Se instala dentro del servidor del cliente.
• Permiten actualizar los productos, servicios y precios.
• Se administra a través de un back que genera bases de datos compartidas.
• Es menos costoso a nivel de desarrollo, pero tiene limitaciones de estructura,
contenidos y campos, y requiere una inversión inicial.
• Algunos comisionan por transacciones.
• Ej : Shoppify, Virtuemart (joomla), etc
E commerce y Tiendas online
b) Virtuemart: carrito para integrar a sitio Joomla:
E commerce y Tiendas online
Paw Accesorios (Joomla sobre template)
Sitio desarrollado con Template Joomla. El objetivo del sitio era que los comercios minoristas puedan hacer su pedido online.
c) Soluciones enlatadas con costo fijo mensual:
• Se puede realizar e integrar un diseño a medida, o utilizar un template.
• Se instala dentro del servidor del cliente para la tiendaweb y en el servidor de la
empresa que brinda el servicio para Facebook.
• Permiten actualizar los productos, servicios y precios.
• Se administra a través de un back que genera bases de datos compartidas para ambas
tiendas.
• Es menos costoso a nivel de desarrollo, tiene un costo mínimo de Setup inicial para
diseños a medida
• Comisiona por transacciones y tiene un costo mensual.
Linked store ( carrito de compras con catálogo online en sitio web del cliente y misma
tienda en Facebook. )
E commerce y Tiendas online
Carro Accesorios (Diseño a medida para linkedstore)
Sitio desarrollado con Linkedstore. Diseño a medida para tienda online.
Tienda en facebook con Linkedstore.
Carro Accesorios (Diseño a medida para linkedstore)
Las redes sociales como nuevos canales de difusión para las empresas
Con la creación de las redes sociales y la conectividad a internet, los consumidores
Se convierten en generadores de opinión y tendencias.
Las marcas fueron evolucionando para acompañar este crecimiento.
:: Re‐diseño de logos de empresas de tecnología. Fuente: Neatorama
Evolución de las marcas al mundo 2.0
Branding en Redes sociales: Pinturerías Rex suma su canal de Facebook y Twwitter para promocionar descuentos y beneficios especiales a través de las redes sociales.
Evolución de las marcas al mundo 2.0
Branding en Redes sociales: Canal de Facebook de Pinturerías Rex
Evolución de las marcas al mundo 2.0
Branding en Redes sociales: Twitter de pinturerías Rex
Evolución de las marcas al mundo 2.0
Facebook: Aplicación dentro de sitio con FB Connect.
Evolución de las marcas al mundo 2.0
Facebook: Fan page Fb y Aplicación dentro de sitio con FB Connect.
Sedal 7 expertos – Fan page para comunicar los eventos de los diferentes salones de belleza en donde van a estar los expertos.
Evolución de las marcas al mundo 2.0
Twitter: Canal de expert salón para difusión.
Sedal 7 expertos –los usuarios pueden seguir los eventos de los salones vía twitter. Canal de twitter.
Evolución de las marcas al mundo 2.0
¿Cual es la clave para que funcione una campaña con redes sociales?
*) Idea creativa
*) estrategia y difusión
*) ESPACIO PARA LA CREATIVIDAD DEL USUARIO
¿Cómo podemos difundir un producto o servicio?
• Campañas SEO Adsense y adwords
• Difusión a traves de Facebook ads
• Landing pages:
(Diseño y armado de una página de llegada de una promo. Puede estar aparte del sitio
institucional promoviendo un concurso, o descuento especial.
= VIRALIDADProvocación a la respuesta.
Evolución de las marcas al mundo 2.0
Facebook: Fan pages
Dell Outlet. Publicación de Ofertas.
Facebook Fanpages y aplicaciones
Facebook: Aplicación dentro del hotsite con FB Connect.
Stella Artois. Jaques D`Azur no puede ir a Cannes.
Evolución de las marcas al mundo 2.0
Facebook: Aplicación dentro del hotsite con FB Connect.
Stella Artois. Jaques D`Azur no puede ir a Cannes.
Facebook Fanpages y aplicaciones
Facebook: Aplicación dentro del hotsite con FB Connect.
Stella Artois. Jaques D`Azur no puede ir a Cannes.
Facebook Fanpages y aplicaciones
Twitter: Lookeo de fondos como espacios de diseño y comunicación.
Tips para el lookeo:
* Aprovechar los styles que vienen predeterminados.
* Utilizar un fondo a modo inspirativo.
* Utilizar el fondo como espacio de difusión de un evento.
* Utilizar el fondo como espacio de información de contacto.
* Hacer una prueba crossbrowser/monitores.
Twitter: Lookeo de fondos como espacios de diseño y comunicación.
Twitter: Lookeo de fondos como espacios de diseño y comunicación.
Twitter: Lookeo de fondos como espacios de diseño y comunicación.
Twitter: Lookeo de fondos como espacios de diseño y comunicación.
Youtube: Lookeo de un canal personalizado. El cavernicola.
Youtube
Banners y rich media banners con medición de estadísticas:
* Publicidad como instrumento de medición de target.
* Permiten identificar tiempo de permanencia en el banner.
* Permiten medir selección de preferencias de productos.
* Permiten cargar info por Rss, audio y video.
* Tienen 3 años de crecimiento en expansión.
* IAB (Interactive Advertising Bureau) afirmó que este formato el año pasado se superó la cifra de 1,5 millones de dólares de inversiónes de MKT. 1/3 del capital invertido en estas campañas.
Banners publicitarios en medios
Ejemplos de banners Ejemplos de banners
¡¡Muchas Gracias!!www.slideshare.net/vanesaID
www.id4you.com
@vaneid
http://ar.linkedin.com/in/vanesagambirazio