11 Análisis funcionalidades nuevo site Fripan Barcelona, 25 de abril de 2012 Todos los derechos reservados a Comunica alternativas mk.

Presentación del tema: "11 Análisis funcionalidades nuevo site Fripan Barcelona, 25 de abril de 2012 Todos los derechos reservados a Comunica alternativas mk."— Transcripción de la presentación:

1 11 Análisis funcionalidades nuevo site Fripan Barcelona, 25 de abril de 2012 Todos los derechos reservados a Comunica alternativas mk

2 2 ANTECEDENTES En septiembre de 2011, Fripan contacta con nosotros para realizar el rediseño de su site. Después de analizar el espacio, se recomienda empezar de cero, ya que el gestor actual que nutre de contenidos el site tiene innumerables puntos débiles. ¿Dónde estamos ahora? Fripan, después de varios incidentes en las actualizaciones realizadas en este tiempo, aprueba el cambio a un nuevo gestor de contenidos (WordPress), así como el rediseño a partir del nuevo logotipo que han creado. ¿Cuándo tenemos que estar listos? Septiembre de 2012, momento en que se lanza el catálogo de otoño, es la fecha de lanzamiento tanto del site como de todo el rediseño que se ha realizado en línea gráfica.

3 3 ¿QUÉ NECESITAMOS? A.Un site atractivo y versátil. B.Un gestor muy intuitivo y con mayores prestaciones.

4 44 A. El site

5 5 A.EL SITE Vamos a trabajar a partir de la propuesta 1 que presentamos, pero adaptándola a la nueva imagen de Fripan: -Logotipo. -Gama cromática  marrón y gris. -Tipografías (en la medida de lo posible en el medio on-line).

6 6 A.EL SITE Logotipo

7 7 A.EL SITE Tipografías

8 8 A.EL SITE Gama cromática

9 9 A.EL SITE Gama cromática

10 10 A.EL SITE Árbol de navegación HOME INICIONUESTRO COMPROMISO CATÁLOGONOVEDADESPREGÚNTALE AL EXPERTO MATERIALES PLVCONTACTOÁREA PRIVADA BUSCADORENG | FR Actualidad Grasas Trans Decálogo del Pan Hechos con corazón Sin conservantes ni colorantes Pan Bollería Tus propias creaciones Patisserie Valérie Productos de temporada Ver organización catalogo en página 12 Manual de buenas prácticas Las recetas Concurso Cocinero del Año Concurso Culinario Fripan Expositores / bolsas / merchandising Productos recomendados Restaurante Hotel Cafetería Boutique del Pan

11 11 A.EL SITE Árbol de navegación CATÁLOGO PANBOLLERÍATUS PROPIAS CREACIONES PATISSERIE VALÉRIE PRODUCTOS DE TEMPORADA EXPOSITORES / BOLSAS / MERCHANDISING Gran Reserva Clasicos Sabores Hogazas Pan saludable Minute Fácil Clásica Pastelería casera Repostería artesana Repostería gourmet Tradicional Rústicos Chapattas Pan blanco Pan HORECA Integrales y cereales Frikorn Bio y salud Pan Minute Restauración Gourmet Dots y berlinas Muffins y tûlipes Aun Marian Bollería Croissants y napolitanas Hojaldres Mini chics Caprice Snacks Croissants Caprice Croissants rectos Mini croissants Ensaimadas y napolitanas Mangas madalena Bases y planchas Cocas San Juan Roscones y torteles FAMILIA GAMA SUBGAMA

12 12 A.EL SITE Nuestra propuesta

13 13 A.EL SITE La propuesta del cliente

14 14 A.EL SITE - Comentarios sobre propuesta presentada HOME: -Nuevo logo en zona central -Menú debajo del logo, de lado a lado, sin pastillas. -Incluir sección de NOVEDADES (no irá dentro del CATÁLOGO). -Situar el buscador en la línea del menú, tal y como lo tenemos ahora, con el botón textual “BUSCAR”. -Las RS las dejamos en el footer. -Idiomas (ES | ENG | FR), en lateral derecho en lugar de en la zona superior. -Mantenemos el footer: -Pendiente mapa web según estructura definitiva -Pendiente confirmar suscripción al newsletter con sistemas.

15 15 A.EL SITE - Comentarios sobre propuesta presentada CATÁLOGO: -Organización: -Nivel 1: familia (catalogo.jpg) -Nivel 2: gama (catalogo1.jpp) -Nivel 3: subgama (catalogo2.jpg) -Nivel 4: producto (fproducto.jpg)

16 16 A.EL SITE - Comentarios sobre propuesta presentada CATÁLOGO - Nivel 1: familia + gama (catalogo.jpg) -Sólo tendremos la imagen de familia: -PAN -BOLLERÍA -TUS PROPIAS CREACIONES -PATISSERIE VALÉRIE -PRODUCTOS DE TEMPORADA -EXPOSITORES/BOLSAS/MERCHANDISING -En la zona derecha listaremos las gamas de cada familia. Ver ejemplo PAN. -Podemos hacer 2 columnas para minimizar el scroll. -Los PRODUCTOS RECOMENDADOS (4 grupos) no tendrán imagen sino naming + icono (ojo que en la propuesta nos los dejamos)  ahora son azules pero tenemos que ajustarlos a gama cromática. -GRAN RESERVA -TRADICIONAL -PAN SALUDABLE -PAN HORECA -XXXXXXXXXXXX CAFETERÍA

17 17 A.EL SITE - Comentarios sobre propuesta presentada CATÁLOGO - Nivel 2: gama (catalogo1.jpg) : -OK a propuesta gráfica  menú en la izquierda con imagen familia. -IMPORTANTE: las nuevas fotos serán con fondo blanco, hemos de buscar un recurso que actué de delimitador, de marco. -En el menú lateral: -La familia no puede ser accesible (no tenemos página genérica) sino que la hacer click se desplegarán las gamas por familia. -Faltan los PRODUCTOS RECOMENDADOS. -Debajo del nombre de la gama ha de poder ponerse un subtitulo descriptivo (máx. 1 línea).

18 18 A.EL SITE - Comentarios sobre propuesta presentada CATÁLOGO – Nivel 3: subgama (catalogo2.jpg) : -3 columnas de listado de productos para minimizar scroll -El cliente quiere poder hacer subdivisiones, dentro del listado de productos, según características del productos para que el usuario vea una clasificación lógica. Por ejemplo en pan: -Barras largas -Barras bocadillo -Individuales

19 19 A.EL SITE - Comentarios sobre propuesta presentada CATÁLOGO – Nivel 4: producto (cfproducto.jpg) : -Texto descriptivo de lado a lado de la foto. -Bajamos la ficha técnica para poder darle más ancho cuando sea necesario. -En algunos casos, de un mismo producto tendremos varias referencias con características diferentes. -Añadiremos tantas columnas como sean necesarias a la derecha, sólo con las referencias y los datos descriptivos. Ejemplo: -Valorar cambio zona de logos  ¿qué ocurre si hay 2? Por ejemplo, de gama (La antigua tahona) y de premio (Best pack). -Validar canales para compartir  ¿Buzz?

20 20 A.EL SITE - Comentarios páginas no trabajadas aún gráficamente NOVEDADES: -En la página de discriminación, ha de permitir tener 3 catálogos activos, visibles. -En el interior de cada catálogo: -No repetiremos la portada del catálogo, sólo temporada más titular (Ejemplo: NOVEDADES PRIMAVERA 2012 – Beneficios para tu negocio). -Tendremos más zona para los productos y para una organización más atractiva, minimizando scrolls. -El contenido se presentará en forma de ficha: -Foto producto -Nombre producto + referencia -Titular -Beneficios (3-6) -Logotipos (gama + beneficios)

21 21 A.EL SITE - Comentarios páginas no trabajadas aún gráficamente NUESTRO COMPROMISO (actual FRIPAN): -Página inicial con texto introductorio: filosofía Fripan. -Contenidos secciones menú lateral: -“Grasas Trans” y “Decálogo del pan”  imagen cabecera + texto explicativo -“Hechos con corazón” y “Sin conservantes ni colorantes”  enlace a página externa (nueva pestaña o ventana). -Añadir sección “Actualidad”: -Página inicio: Titular + subtitular + imagen (más grande que la actual) -Opción a subir documento.doc,.ppt,.pdf  si tenemos la nota de prensa externa podremos optar a ir al documento directamente. -Si no va directamente a doc externo  página desarrollo noticia: -Titular + subtitular -Posibilidad de textos en negritas -Posibilidad de incorporar imágenes en el cuerpo de la noticia -Posibilidad de descarga de documento.doc,.ppt,.pdf (cuando no sea la propia nota de prensa)

22 22 A.EL SITE - Comentarios páginas no trabajadas aún gráficamente PREGÚNTALE AL EXPERTO (actual “Consejos del chef”): -Página inicial “Pregúntale al experto” (ahora “Consejos de nuestro experto”)  cambiamos orden interno de organización: -Formulario  evitamos scroll para llegar a él. -Listado preguntas y respuestas  orden de más reciente a más antiguo. -Dividir en varias páginas para minimizar scroll, manteniendo siempre el formulario. -Menú lateral: -Más visual  icono diferenciador como en el catálogo. -4 secciones: -Manual de buenas prácticas -Las recetas -Concurso Cocinero del año -Concurso Culinario Fripan

23 23 A.EL SITE - Comentarios páginas no trabajadas aún gráficamente PREGÚNTALE AL EXPERTO (cont.): -Manual de buenas prácticas  mismos contenidos. -Las recetas: -Menú superior por categorías: -Recetas gourmet -Comidas exprés -Ideas para cenas informales -Postres cada día -Especial vegetarianos -Mostrar sólo las recetas de la categoría activa  no scroll con todas. -Organizar las recetas como el catálogo de nivel 2 (catalogo1.jpg) -Ficha: -Maquetar como ficha de producto -Posibilidad de incluir logo -Posibilidad de compartir. -Si es una vídeo receta, abrir en una pestaña nueva  Vimeo.

24 24 A.EL SITE - Comentarios páginas no trabajadas aún gráficamente PREGÚNTALE AL EXPERTO (cont.): -Concurso Cocinero del año: -1 única página -El concurso  COCINERO DEL AÑO (año) + nombre ganador (posibilidad de foto) + enlace a web www.concursococinero.com -Las recetas de Beatriz  texto introducción + listado (maquetar como el catálogo de nivel 2 (catalogo1.jpg) -Concurso culinario Fripan: -Misma estructura  texto intro + ganadores. -Eliminamos galería de imágenes dinámica  sólo imagen cabecera.

25 25 A.EL SITE - Comentarios páginas no trabajadas aún gráficamente MATERIALES PLV: -Misma estructura que página subgama: -Título -Subtítulo -Texto descriptivo -Galería de materiales para descargar  3 columnas -Nombre -Subtitulo -Texto descriptivo -Imagen -Botón descarga

26 26 A.EL SITE - Comentarios páginas no trabajadas aún gráficamente CONTACTO: -Página inicial compaginada en 2 bloques con columnas cada uno: -Fripan en España -Fripan en el mundo -Formulario de contacto  lo simplificamos: -Nombre y apellidos -Nombre del establecimiento -Correo electrónico -Tipo de establecimiento  desplegable -Es cliente  si/no -Mensaje -Sí, deseo recibir información

27 27 B. El gestor

28 28 B.EL GESTOR PUNTO DE PARTIDA -Todo actualizable por el cliente o Comunica. -Un único gestor para los 3 idiomas para no triplicar trabajo  por ejemplo, cuando creemos una ficha de producto que dé opción a crearla en los 3 idiomas a la vez o sólo en los que queramos. -Organizar según la estructura y nomenclatura del site  no inventar nombres sino que todo tenga la misma correspondencia. -Indicar siempre: -Máximo caracteres  ¿posibilidad de contador inverso tipo Twitter? -Tamaño imagen -Color  selector tipo editor correo -Permitir encuadrar y escalar las imágenes como en Facebook (foto de perfil). -Todos los textos editables: negritas / colores / enlaces

29 29 B.EL GESTOR PUNTO DE PARTIDA -Posibilidad de marcar y desmarcar desde el exterior, no tener que entrar para activar o desactivar  editar / eliminar / visible. -¿Cómo solucionamos la selección de orden cuando haya muchos ítems?  no podemos hacerlo de memoria como ahora porque es muy complicado, por ejemplo en el catálogo con 20 productos o más por subgama. -¿Podríamos hacerlo desde el exterior? Por ejemplo en las descargas con μTorrent, se pueden priorizar con una flecha de subida o bajada el orden de descarga.

30 30 B.EL GESTOR NUESTRO COMPROMISO (actual FRIPAN): -Página inicial: -Texto introductorio -Grasas Trans -Título -Subtítulo -Imagen cabecera -Texto -Imagen en texto  ¿podemos marcar la situación? -Decálogo del Pan -Título -Subtítulo -Imagen cabecera -Texto -Imagen en texto  ¿podemos marcar la situación?

31 31 B.EL GESTOR NUESTRO COMPROMISO (actual FRIPAN): -Actualidad -Titular -Subtitular -Fecha -Nota de prensa  subir.doc,.ppt,.pdf -Mostrar sólo nota de prensa  cuadro check. -Imagen exterior  marcar si se usa la misma foto en interior -Imagen interior  sólo posible si no se ha marcado el cuadro anterior -Texto -Imagen en texto  ¿podemos marcar la situación? -Subir documento .doc,.ppt,.pdf

32 32 B.EL GESTOR CATÁLOGO: -Mantener los mismos nombres que hemos dado en este documento: -Familia -Gama -Subgama -Producto -Añadir “Productos recomendados” (actual “Sectores de segmentación”): -Posibilidad de abrir tantos grupos como sean necesarios. -Archivo de productos por grupo (creados a partir de la opción “Producto recomendado” de la ficha de producto)  posibilidad de editar sólo el orden de visualización de los productos.

33 33 B.EL GESTOR CATÁLOGO: -Familia  para generar tantas como sean necesarias -Nombre -Subtítulo -Texto descripción -Color familia  selector -Imagen principal -Logo -Orden

34 34 B.EL GESTOR CATÁLOGO: -Gama  para generar tantas como sean necesarias -Familia  desplegable -Nombre -Subtítulo -Texto descripción -Imagen principal -Logo -Orden

35 35 B.EL GESTOR CATÁLOGO: -Subgama  para generar tantas como sean necesarias -Familia  desplegable -Gama  desplegable, carga según familia seleccionada -Nombre -Subtítulo -Texto descripción -Imagen principal -Logo -Orden

36 36 B.EL GESTOR CATÁLOGO: -Categoría  para generar tantas como sean necesarias -Familia  desplegable -Gama  desplegable, carga según familia seleccionada -Subgama  desplegable, carga según familia seleccionada -Nombre

37 37 B.EL GESTOR CATÁLOGO: -Producto  en una misma ficha es posible que tengamos varias referencias (= producto, ≠ formatos) -Familia  desplegable -Gama  desplegable, carga según familia seleccionada -Subgama  desplegable, carga según gama seleccionada -Categoría  desplegable, carga según subgama seleccionada -Nombre -Productos recomendados  desplegable con todos (esta selección nutrirá el archivo de “Productos recomendados” – pág. 30) -Texto descripción -Imagen principal -Logo -Enlace receta -Enlace vídeo -Orden  en función de cómo se solucione -Características referencia 1  única si no se añaden más (se repetiría mismo esquema) -Ver página siguiente

38 38 B.EL GESTOR CATÁLOGO: -Producto -Características referencia 1  única si no se añaden más (se repetiría mismo esquema) -Referencia  texto libre -Tamaño  texto libre -Tipo  seleccionar Longitud / Diametro / Ancho x Alto -Longitud  texto libre + “cm.” fijo -Diámetro  texto libre + “cm.” fijo -Ancho x Alto  texto libre + “cm.” fijo -Unidades por caja  texto libre + “uds.” fijo -Peso Crudo  texto libre + “g.” fijo -Tiempo descongelación  texto libre + “min.” fijo -Tiempo fermentación  texto libre + “min.” fijo -Temperatura de cocción  texto libre + “ºC” fijo -Tiempo de cocción  texto libre + “min.” fijo -Plancha  texto libre + “min.” fijo -Orden  posición dentro de las referencias que haya de producto -Añadir nueva referencia  replicar ficha características

39 39 B.EL GESTOR CONSEJOS DEL CHEF: -Pregúntale al experto -Pregunta -Respuesta -Nombre -Apellidos -Ciudad -E-mail -Fecha recepción -Tags -Importante: opción de visible en exterior Importante: opción de visible en exterior, ahora no está y es básica

40 40 B.EL GESTOR CONSEJOS DEL CHEF: -Manual de buenas prácticas -Título -Subtítulo -Texto introducción -Añadir práctica  orden alfabético: -Título -Descripción -Las recetas -Referencia producto  cuando se seleccione, mostrar el nombre automáticamente -Tipo: receta / vídeo receta -Nombre receta -Raciones -Tiempo preparación -Ingredientes -Elaboración -Enlace vídeo -Imagen Importante: opción de visible en exterior, ahora no está y es básica

41 41 B.EL GESTOR CONSEJOS DEL CHEF: -Secciones  para añadir al menú lateral, tipo Concurso Cocinero del Año o Concurso Culinario Fripan -Título -Subtítulo -Descripción -Imagen principal -Galería: -Elemento 1: -Título -Subtítulo -Descripción -Imagen o víedo -Pie foto -Añadir elemento  replicar estructura

42 42 B.EL GESTOR MATERIALES PLV: -Título -Subtitulo -Imagen principal -Pieza 1: -Nombre -Subtitulo -Texto descriptivo -Imagen -Enlace descarga

43 43 B.EL GESTOR CONTACTO: -Texto introducción -Delegaciones  añadir nueva -Categoría*  marcar España o Internacional -Tipo*  desplegable: oficina / delegación -Ámbito*  desplegable: central / comercial -País / ciudad*  texto libre -Persona de contacto  texto libre -Calle*  texto libre -Ampliación dirección  texto libre -CP*  si ha marcado España, validar formato 5 dígitos -Ciudad*  si ha marcado España ¿puede ser autocompletable según CP? -Provincia  ídem anterior -Teléfono*  texto libre -Móvil  texto libre -Fax  texto libre Corresponde a definición delegación

44 44 Próximos pasos

45 45 -Envío de estudio de funcionalidades11/05/12 -Comentarios clientesem. 14/05/12 -Cambios gráfica presentada según comentarios PowerPoint14/05/12 -Inicio programación site + gestorsem. 21/05/12