Análisis funcionalidades nuevo site Fripan Barcelona , 25 de abril de 2012

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

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. ¿QUÉ NECESITAMOS? Un site atractivo y versátil. Un gestor muy intuitivo y con mayores prestaciones.

4. A. El site

5. 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. EL SITE Logotipo

7. EL SITE Tipografías

8. EL SITE Gama cromática

9. EL SITE Gama cromática

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

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

12. EL SITE Nuestra propuesta

13. EL SITE La propuesta del cliente

14. 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. 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. 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. • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • GRAN RESERVA • TRADICIONAL • PAN SALUDABLE • PAN HORECA • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX • XXXXXXXXXXXX CAFETERÍA

17. 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. 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. 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. 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. 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. 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. 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. 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. 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. 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. B. El gestor

28. 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. 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. 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. 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. 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. 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. EL GESTOR • CATÁLOGO: • Gama  para generar tantas como sean necesarias • Familia  desplegable • Nombre • Subtítulo • Texto descripción • Imagen principal • Logo • Orden

35. 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. 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. 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. 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. 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. 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. 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. EL GESTOR • MATERIALES PLV: • Título • Subtitulo • Imagen principal • Pieza 1: • Nombre • Subtitulo • Texto descriptivo • Imagen • Enlace descarga

43. 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. Próximos pasos

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 + gestor sem. 21/05/12