Lapaginaweb 2010

Conceptos Generales

Conceptos Generales

Esquema de agentes en la comunicación

Cliente(Marca)

Otros proveedoresTecnológicos,distribución…

Agencia dePublicidad 1

A PB N

Consultoríaestratégica

Agencia de eventos

Agencia de medios

BRIEFINGDocumento que el cliente utiliza para realizar sus peticiones a las distintas agencias con las que trabaja.

El que entrega a la Agencia de Publicidad es el Briefing Creativo

El que entrega a la Agencia de Medios es el Briefingde Planificación

El que entrega a la Consultoría es el BriefingEstratégico

Cada tipo de Briefing plantea unas necesidades, y lo más importante, unos objetivos distintos para un planteamiento general que ninguno de los agentes lograría por sí solo.

Conceptos Generales

Conceptos Generales

QUIÉN ES QUIÉN&QUIÉN HACE QUÉ

AGENCIA PUBLICIDAD

Puede tener o no departamento online. Es la encargada de construir los mensajes publicitarios que la marca (Cliente) quiere comunicar a su público (usuarios-clientes).

La agencia de publicidad plantea el qué (lo que se dice) y el cómo (la forma en la que se dice: a través de un spot, una prensa, una cuña, un microsite o varios).

Conceptos Generales

AGENCIA DE MEDIOSPuede tener o no departamento creativo y dentro de este departamento online. Es la encargada de distribuir los mensajes publicitarios que la agencia ha creado para la marca.

La agencia de medios planifica dónde la marca va a impactar a sus clientes-usuarios (tv, radio, internet, exterior; en qué horario prime time por ejemplo; los soportes: la sexta, tele5, elmundo.es, marca…)

Conceptos Generales

CONSULTORÍAEs la encargada de guiar a la marca. Investiga y estudia dónde y en qué lugar del mercado puede posicionarse para tener mayor éxito en su negocio. Puede ser tanto a nivel publicitario como de negocio (lanzamiento de un nuevo producto, limpieza de gama, ocupación de nuevos nichos, cambios de uso de producto…)

Aunque pueden tener consultoría, el cliente también suele preguntar y pedir asesoramiento a su Agencia de Publicidad sobre estas cuestiones.

Conceptos Generales

Conceptos Generales

TIPOLOGÍAS DE AGENCIAS DE PUBLICIDAD

Agencia PB tradicional

Básicamente se manejan en 3-4

departamentos y su trabajo se basa

sobre todo en la realización de

campañas que giran en torno a un spot

de tv del que derivan el resto de piezas.

Dirección

Cuentas

Creación

Producción

Conceptos Generales

Agencia PB online

Funcionan de forma muy similar aunque

disponen de un nuevo departamento. Su

trabajo puede depender o no del concepto

manejado por la agencia tradicional y gira

en torno a la creacción de sites,

microsites, campañas online y acciones

que tengan a las nuevas tecnologías como

base (redes, iphone…)

Dirección

Cuentas

Creación

Tecnología

Producción

Esta división puede darse tal cual o surgir distintas combinaciones. Además existen otro tipo de agencias que cubren otra parte del trabajo o material publicitario que la marca produce: boutiques creativas, agencias de marketing, productoras de piezas, productoras de vídeo…

Conceptos Generales

PROCESOS EN UNA CAMPAÑA ONLINE

Agencia Online

Se recibe Briefing de cliente con las pautas

que se deben seguir para realizar el trabajo

creativo.

- Público (target)

- Tono del mensaje

- Qué se comunica

- Presupuesto disponible

La agencia trabaja creativamente y realiza

una propuesta al cliente. Esta propuesta

puede consistir en un microsite, un site, una

acción, una campaña o varias de estas cosas.

Cuando existe campaña online, el cliente

hace llegar a la agencia online el plan de

medios que su central (agencia de medios) le

ha contratado. Según el planteamiento

creativo, la agencia produce las piezas en base

a las especificaciones y formatos que en este

plan se contemplan.

Conceptos Generales

Agencia Medios

Reciben briefing de cliente con las pautas

que deben seguir para impactar al público

que quieren para esa acción.

- Público

- Tipo de impacto

- Presupuesto disponible

La agencia de medios (central) trabaja en

una planificación en la que proponen al

cliente en qué soportes y en qué momento

deben estar. En muchos casos y

dependiendo del presupuesto y objetivos de

impacto del cliente, en su propuesta

también va implícita el tipo de piezas que se

van a contratar.

Si el objetivo en notoriedad la central irá

a por rich media.

Si el objetivo es presencia, la central se

decantará por formatos estándar.

Según el público (jóvenes, amas de casa,

profesionales…) elegirán unos soportes u

otros.

La página web.Una visión genérica.

La página web. Una visión genérica.

Organigrama de una agencia online

Cuentas Creatividad Tecnología

Es el que está en permanente contacto con el cliente. Tiene que tener muy claro cuál es la necesidad del cliente y hasta dónde se puede llegar con su presupuesto.

Organizados en parejas creativas, dependiendo del tamaño del proyecto se implican uno o más equipos.Conceptualizan, diseñan y desarrollan el discurso creativo de una página, una campaña o cualquier pieza creativa. Deben tener una visión general de la tecnología que se utiliza para aprovechar mejor el medio creativamente hablando.

Subdividido en dos departamentos: Sistemas y creativa.El departamento de sistemas se encarga de desarrollar la parte back end de cada proyecto (html, bbdd, gestores…). El departamento creativo se encarga de desarrollar el front endde cada proyecto (flash, papervision, vídeo, 3D)


Organigrama de una agencia online

Cuentas Creatividad Tecnología

En este departamento puede existir el perfil de estratega, que es el que decide hacia dónde debe ir la comunicación de la marca en el proyecto.También últimamente se estáincluyendo la figura del investigador que informa de las novedades, innovaciones y consumo de los usuarios en los distintos medios.

Los artes además de diseñar con photoshop (programa más común en el diseño de páginas web), pueden manejar otros programas que le permitan dotar a sus diseños de mucha más frescura que en la publicidad convencional.En el caso de órbital existe la figura de animador, que es alguien experto en “dibujar” a través del flash para crear películas de animación. E igualmente realizar ilustraciones tan complejas como se requieran para el proyecto.El copy debe alcanzar un discurso mucho más cercano y dialogante con el usuario ya que el medio lo permite. Los mensajes deben ser más cortos y atractivos y deben tener siempre en cuenta que el usuario ya ha mostrado interés cuando ha tecleado la url de una página.

En tecnología hay más perfiles de los que se pueda imaginar ya que el mundo audiovisual da para mucho y cada día hay nuevas posibilidades por explotar.

Normalmente en el departamento de tecnología de sistemas se cuenta con htmleros, phperos, gente especializada en creación de gestores de contenidos…

En tecnología creativa además de flasheros, hay gente dedicada a vídeocon after effects, por ejemplo; gente experta en plataformas para piezas especiales como eyeblaster, etc y gente que comienza a dominar programas nuevos como papervision, etc…


Ejemplo creatividades

ilustración vídeo


Creación de una web.Cuestiones previas

Antes de nada, definamosUn site puede estar alojado en un servidor propio (que puede estar subcontratado) o en el servidor del cliente. En este caso, debemos saber las características del mismo para que al crear la página funcione correctamente. Datos que hay que saber:

Sistema operativo (windows 2000, windows NT, Linux, Unix…)

Servidor Web (IIS, apache, iplanet…)

Servidor de aplicaciones (coldfusion, iplanet…)

Lenguaje de programación (Asp’s, Cgi’s, Java, Jsp, php, coldfusion…)

Servidor de BBDD (SQL, oracle, MySQL…)

Plataformas sobre las que irá (Mac, PC, ambas…)

Navegadores (Firefox, Nestcape, Opera, Explorer)

Resolución sobre la que se va a diseñar (la más habitual hoy en día 1024x768)

Alojamiento (hosting)


Se utiliza para denominar al responsable de un web específico. No es un término que se utilize en agencia, suelen ser más freelance informáticos que diseñan y desarrollan ellos mismos el site.Su perfil suele ser el de un informático, aunque cuando el sitio es más grande y necesita de más perfiles, el webmaster se convierte en coordinador.

webmaster

Se refiere a la facilidad y nivel de intuición que se le otorga al diseño de una pieza creativa o un site en cuanto a la utilización que le dará el usuario. Un site usable es aquél que ha tenido en cuenta factores como el orden de lectura, la colocación del menú, la distribución del mismo, el ahorro de clics, la exposición del contenido para facilitar la navegación del visitante.

usabilidad

Es la capacidad de acceso a la que se le dota a un sitio y a sus contenidos para que pueda ser navegada por cualquier usuario, independientemente de su discapacidad. Existen tres niveles de accesibilidad A, AA y AAA, siendo esta última la que se refiere a mayor grado de discapacidad. El organismo más importante en promover la accesibilidad web es World Wide Web Consortium (W3C) http://www.accesibilidadweb.com

accesibilidad

HostingPráctica consistente en albergar sitios Web de terceras personas o empresas.

Las empresas que se dedican a este servicio son como los hoteleros de la red: ofrecen espacio para que otras compañías almacenen cualquier información que quieran que sea accesible por una red, desde sus páginas web hasta la información de su red interna o Intranet.


HostingOrdenador que actúa como unidad de archivo central en una determinada red, que puede ser local o Internet.

Servidor de Correo (Mail Server): Dispositivo especializado en la gestión del tráfico de correo electrónico.

Servidor POP3: Servidor que utiliza el protocolo POP3 (estándar para la gestión del correo electrónico). Permite almacenar los mensajes que se reciben hasta que el usuario los descarga.

Servidor proxy: Ordenador o programa que actúa de intermediario entre Internet y un grupo de usuarios.

Servidor Seguro: Ordenador configurado con elementos de protección especial de datos de los clientes/usuarios de Internet. Permite la completa confidencialidad.

Servidor

El cliente recibe los servicios que ofrece un servidor: Cliente

Servidor de correo

Outlook Navegador

Servidor web


La base de datosEn cuanto al apartado relativo a Datos Personales, el IAB Spain* recomienda que se detallen como mínimo los siguientes apartados.

1. La identidad, la denominación y los datos de contacto de la empresa propietaria de los datos personales que está recabando o tratando.

2. El fin por el cual se recaban o tratan esos datos personales. 3. Información de si esos datos van a ser cedidos o no a terceros y con qué fin serían

cedidos a terceros. En el caso de que los datos vayan a ser cedidos, es necesario especificar a quién se le van a ceder.

4. La identidad y la denominación de la compañía que no siendo propietaria de la lista/fichero donde están almacenados esos datos personales, está tratándolos.

5. La localización geográfica física de los datos. 6. Mención a la inscripción de esos ficheros con Datos Personales en la Agencia de

Protección de Datos. 7. Información clara sobre cómo y dónde ejercer los derechos de acceso,

rectificación, cancelación y oposición por parte de los afectados con respecto a sus datos personales.

Recomendacioneslegales

* IAB Spain: Asociación líder en el sector publicitario interactivo español


Terminología básica

Frente al flashEs más limitado, puestoque debe restringirse a una estructura ordenada(debido a los tags).No necesita plugin porparte del usuario.Suele pesar menos y se descarga más rápido.

HTMLDocumento de texto estructurado con etiquetas (tags), almacenado en un directorio de un servidor web o creado dinámicamente en el momento de realizarse la solicitud con el propósito de satisfacerla. Aparte de texto, una página HTML puede incluir gráficos, vídeo, audio…

Frente al html/flashSoporta a ambas, aunque en publicidad como tal no se utiliza ya que los perfilestecnológicos son expertos en el código que utiliza. En realidad es como un “photoshop” de webs.

JOOMLA!Sistema de administración de contenidos que permite editar el contenido de un site de forma sencilla. Es una aplicación de código abierto construida en su mayoría en php.

Frente al htmlEs un “espacio de dibujo en blanco” que permite cualquierdesarrollo, no plantealimitaciones de inicio.Necesita un plugin, si bien hay una altísima penetración (y esgratuito)Puede llegar a tener granpeso.

FLASHSoftware de Macromedia, es un programa de edición multimedia que utiliza gráficos vectoriales e imágenes de mapa de bits, sonido, código de programa, flujo de vídeo y audio bidireccional. Permite mostrar animaciones interactivas en una página web.


Formatos de audio y vídeoFormato de audio más comunes

AAC – Formato de Apple en el patrón de mpg-2. Es el formato que reproduce el ipod y el que puede comprarse por internet. De ahí que el itunes convierta los mp3 a este formato cuando introducimos música desde el ordenador.

WAV – Desarrollado por Microsoft e IBM. Es el estándar de grabación para CD’s y funciona en cualquier aplicación de Windows.

AU – Archivos de sonido de Unix. También funciona como estándar en la programación JAVA.

WMA – Abreviatura de Windows Media Audio, parecido al mp3 en compresión aunque no solo reduce el tamaño de los archivos sino que se adapta a las distintas velocidades de conexión.

Midi – Es el estándar para la música electrónica. Se usa en sintetizadores musicales o tarjetas de sonido. También, al comprimir audio y vídeo se usa mucho en karaokes.

MPEG – Es el más importante. Comprime audio y vídeo, de hecho es el formato utilizado para comprimir en DVD’s o la TV digital y satélite.

RA – Real Networks. Soporte multimedia de alta comprensión de archivos de audio y vídeo. No es tan famoso como el mp3 pero su capacidad de streming es ideal para las retransmisiones en directo por internet.


Formatos de audio y vídeoFormato de vídeo más comunes

Avi y Avi 2.0 – Formato más popular por su calidad. Guarda la información por capas, primero vídeo, luego audio.

Microsoft windows media video– Ha tenido una gran aceptación ya que viene integrado en el sistema operativo XP.

Real Video – Requiere de su propio player para su reproducción.

Appel Quicktime – También necesita de su propio player (versión sencilla gratuita. La comprada tiene la capacidad de edición de vídeo al igual que real video.)

MPG – Estándar de compresión de audio y vídeo con el que se establecieron 4 tipos dependiendo de la calidad aunque el más extendido por esa misma razón es el mpg2. Además de la gran compresión de archivos que ofrece es la que mejor mantiene la calidad de imagen.

Divx – Se ha convertido en uno de los formatos más populares sobre todo por el tema de la piratería y el volvado de DVD’s ya que su calidad es más que aceptable.


Lenguajes de programaciónXMLEl XML, Extensible Markup Language, es un lenguaje de estructuracion de datos de sintaxis muy parecida al HTML, incluso podriamos incluir el HTML como parte del lenguaje XML.

La intención del XML es la organización de datos de forma que puedan ser tratados por cualquier lenguaje y desde cualquier plataforma, de esta manera, podemos almacenar una lista de los artículos de nuestra web en formato XML, para que puedan ser publicados en otras páginas o accedidas desde programas como los lectores RSS.

AJAXSegún wikipedia AJAX (Asynchronous JavaScript And XML) és una técnica de desarrollo web para crear aplicaciones interactivas mediante la combinación de tres tecnologías ya existentes que conoceremos en este manual.

O para que lo entiendan mejor, es una manera de crear una aplicación que responde a las acciones del usuario sin refrescar la página contra el servidor.

PHP es un acrónimo recursivo que significa PHP Hypertext Pre-processor (inicialmente PHP Tools, o, Personal Home Page Tools). Fue creado originalmente por Rasmus Lerdorf en 1994; sin embargo la implementación principal de PHP es producida ahora por The PHP Group y sirve como el estándar de facto para PHP al no haber una especificación formal. Publicado bajo la PHP License, la Free Software Foundation considera esta licencia como software libre.

PHPPHP conocido como una tecnología de código abierto que resulta muy útil para diseñar de forma rápida y eficaz aplicaciones Web dirigidas a bases de datos. PHP es un potente lenguaje de secuencia de comandos diseñado específicamente para permitir a los programadores crear aplicaciones en Web con distintas prestaciones de forma rápida. MySQL es una base de datos rápida y fiable que se integra a la perfección con PHP y que resulta muy adecuada para aplicaciones dinámicas basadas en Internet.


ASPUn lenguaje del lado del servidor es aquel que se ejecuta en el servidor web, justo antes de que se envíe la página a través de Internet al cliente. Las páginas que se ejecutan en el servidor pueden realizar accesos a bases de datos, conexiones en red, y otras tareas para crear la página final que verá el cliente. El cliente solamente recibe una página con el código HTML resultante de la ejecución de la página ASP. Como la página resultante contiene únicamente código HTML, es compatible con todos los navegadores.

ASP (Active Server Pages) es la tecnología desarrollada por Microsoft para la creación de páginas dinámicas del servidor. ASP se escribe en la misma página web, utilizando el lenguaje Visual Basic Script o Jscript (Javascript de Microsoft).

Metodología deun proyecto on.

21

Metodología de trabajo de un proyecto ON

El proceso de trabajo de un proyecto ON consta de diferentes fases, algunas coinciden con cualquier proyecto de comunicación, otras son específicas del medio e influyen, además, en los tiempos de ejecución. Básicamente son dos fases:

Conceptualización estratégica y creativa

Desarrollo del proyecto

1Conceptualización estratégica y creativa

El punto de partida es un BRIEF (incluyendo todos los requerimientos relativos a tecnología) con el que la Agencia pueda desarrollar el planteamiento estratégico y creativo.

CREACIÓN MARCOESTRATÉGICO

DESARROLLOCREATIVO

ANÁLISIS SITUACIÓN DE PARTIDA



DESARROLLOCREATIVO

ANÁLISIS SITUACIÓN DE PARTIDA Información del producto

o servicio.

Objetivos de la compañía.

Competencia y entorno competitivo.

Análisis del consumidor.

Análisis de las acciones de comunicación online de la competencia.

Análisis de las plataformas de sistemas de la compañía.





DESARROLLOCREATIVO

ANÁLISIS SITUACIÓN DE PARTIDA

Fijar objetivos de marketing y de comunicación online.

Definir el posicionamiento, el target y el carácter de la marca en el entorno interactivo.

Definir la estrategia online y el eje conceptual.

Definir la estructura de contenidos.

Definir el entorno tecnológico.

Evaluar las implicaciones legales.

Definir la propuesta para la difusión del proyecto.





DESARROLLOCREATIVO

ANÁLISIS SITUACIÓN DE PARTIDA Conceptualización.

Desarrollo del eje creativo.

Adaptación a las diferentes piezas de comunicación.

Creación de la línea gráfica

Ergonomía de navegación.




Desarrollo del proyecto

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Análisis

Materiales y contenidos

Planificación

Presupuesto

Integración

Implementacióny testing

Producción de elementos

Seguimiento

Gira en torno al DOCUMENTO MAESTRO. Es el instrumento básico de referencia, donde se incorporan todos los detalles relativos al proyecto.

Se debe contar con la aprobación por parte de Cliente para poner en marcha la producción.

2Metodología de trabajo de un proyecto ON

Desarrollo del proyecto2


Análisis


Planificación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Planificación de equipos de trabajo, tareas y timing de trabajo.

Definición de la arquitectura de la información (sitemapo árbol de contenido, que es la información que se mostrará y con quéestructura).Presupuesto



Análisis

Planificación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Análisis detallado de todos los contenidos, así como la jerarquía y orden más adecuados para el usuario.

Definición de las plataformas tecnológicas, software y especificaciones técnicas requeridas.

Elaboración del documento funcional.Presupuesto




Análisis

Planificación Materiales

E-boards

Textos

Estilográfico

Maqueta

Navegación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Definir formatos y requisitos necesarios.

Definir qué materiales, gráficos o de contenido, nos facilitará el cliente.

Definir qué materiales (imágenes, ilustraciones, música…) se necesitan y cuál es su coste.

Tener en cuenta los derechos y/o condiciones legales.


Presupuesto



Materiales

E-boards

Textos

Estilográfico

Maqueta

Navegación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Pantallas (funcionales, no incluyen diseño) en las que se presenta el detalle de contenidos de la página, así como las funcionalidades que incorporan.

Análisis

Planificación


Presupuesto



Materiales

E-boards

Textos

Estilográfico

Maqueta

Navegación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Propuesta de tono de los textos.

Desarrollo de titulares y textos más representativos para valoración por parte del cliente.

Análisis

Planificación


Presupuesto



Materiales

E-boards

Textos

Estilográfico

Maqueta

Navegación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Diseño ergonómico de la navegación.

“Traducción” de las etapas anteriores a un modelo gráfico, en el que se presenta la estructura funcional del interface.

Análisis

Planificación


Presupuesto



Ejemplo de Sitemap – Operación ChascarrilloEstructura de un prelanzamiento

HomeTeaserHomeTeaser

BDInteresados

Déjanos tu email

Déjanos tu emailGaleríaGalería

EnviaramigoEnviaramigo

FORMFORM

LOPDLOPD

ChistesChistes ImágenesImágenes Power PointPower PointTOP 10TOP 10

DescargarDescargar

Friends& Family

ClubPa Co

ListasFrías

EmailamigoEmailamigo

Emailing Prelanzamiento

Tu nombreTu emailNombre amigoEmail amigo

Estructura de contenidos

HomeHome

WebisodiosWebisodios

W1

W1

W2

W2

W3

W3

Denuncia a un amigo

Denuncia a un amigo

Retrato Robot

Retrato Robot

Formulario Denuncia

Formulario Denuncia

BD

W0W0

Tablón denunciados

Tablón denunciados

Link Paramount

Comedy

Link Paramount

Comedy

BuscadorBuscador

Pág. Resultados

Pág. Resultados

SexoForma caraColor peloTipo peloOjosNarizBocaOrejasGafasBarba/Bigote

Nombre denunciadoAliasEmailMotivo denunciaTu nombreTu email

Email denuncia

Email denuncia

LOPDLOPD

Peli Escena03_02

Peli Escena04_02

Peli Escena01_04

Peli Escena05_02

Peli

Escena06_03

Link Club ParamountLink Club

Paramount

NOTA: Las pelis aparecerán al cerrar cada sección, excepto cuando el usuario entre por el mail que le envía su amigo

que se encontrará con una peli previa y otra posterior al webisodio que le sirvamos.

Ejemplo de Sitemap – Operación Chascarrillo

Materiales

E-boards

Textos

Estilográfico

Maqueta

Navegación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Definición del código gráfico a utilizar:

Distribución espacial

Gama cromática

Tipografías

Tratamiento imágenes

Efectos visuales

Etc.

Análisis

Planificación


Presupuesto



Materiales

E-boards

Textos

Estilográfico

Maqueta

Navegación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Maqueta gráfica que permita validar el diseño ergonómico y gráfico del site por parte del cliente.

Análisis

Planificación


Presupuesto




Análisis

Planificación

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Valoración económica de la producción, en base a la definición completa del proyecto.

Presupuesto



Integración



DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Seguimiento

Creación de todos los elementos que conformarán el proyecto final:

Elementos gráficos

Elementos sonoros

Copies

Otros elementos (video, animaciones…)



Integración



FRONT-END

BACK END

DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Seguimiento

Etapa en la que se ensamblan todos los elementos.

El proceso de integración es variable en cuanto a duración en función de las tecnologías utilizadas y del grado de complejidad del producto final.



Integración



DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓNHace referencia a lo que el usuario ve en pantalla y a la representación audiovisual de todos los eventos.

Se puede trabajar con diferentes tecnologías: flash, html, javascript, lingo, premiere…Seguimiento

FRONT-END

BACK END



Integración



DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Seguimiento

FRONT-END

BACK END

Hace referencia a lo que el usuario NO ve en pantalla, pero que es imprescindible para que el producto funcione.

En entornos web, se relaciona con:

Bases de Datos (MySQL, Acces, SL Server, etc.)

Programación (PHP, ASP, JSP, Java, Perl, XML, etc.)

Entorno de aplicaciones (servidor, conectividad, cuentas de correo, dominios…)



Integración



DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Seguimiento

Una vez acabada la producción, se habilita un servidor de pruebas donde se valida el correcto funcionamiento de las aplicaciones, ortografía, detalles gráficos, etc.

Una vez corregidos los errores que se detecten y aprobado por cliente, se cuelga en el servidor final.

Es una fase MUY importante y debe ser considerada en el calendario de trabajo.



Integración



DEFINICIÓN DEL

PROYECTO

PROCESODE

PRODUCCIÓN

Seguimiento

Una vez online, se realiza un seguimiento mediante estadísticas, registros, etc.

Los primeros días se aplica además un control del proyecto para subsanar posibles errores que se detecten en función de la respuesta de los usuarios.



DATOS ACUMULADOS

Usuarios distintos del site 16/10/2007 17/10/2007 18/10/2007 19/10/2007 20/10/2007 21/10/2007 22/10/2007 23/10/2007 24/10/2007 25/10/2007Identificados con cookie 92 1.905 3.850 4.653 5.143 5.609 6.171 6.646 7.034 7.512 Identificados con ip 3 10 12 13 15 19 21 24 26 31

95 1.915 3.862 4.666 5.158 5.628 6.192 6.670 7.060 7.543

VisitasHome 191 3.054 6.102 7.809 8.836 9.769 10.982 12.075 12.920 13.966 Entradas en sección Webisodios 202 2.976 5.826 7.055 7.800 8.513 9.354 10.110 10.711 11.449 Entradas en sección Denuncia 32 661 1.284 1.519 1.629 1.754 1.892 2.013 2.138 2.256 Entradas en sección Denunciados 41 664 1.258 1.498 1.632 1.760 1.879 1.991 2.097 2.206

Visualizaciones vídeosLa Llamada 40 1.770 4.274 5.315 6.042 6.747 7.472 8.123 8.636 9.305 Azulejos 41 1.394 3.204 3.944 4.437 4.948 5.484 5.975 6.327 6.770 La Familia 84 1.542 3.401 4.166 4.689 5.168 5.691 6.131 6.480 6.941

Enlaces externosIr a la web de Paramount 17 396 788 969 1.103 1.210 1.328 1.458 1.540 1.620 Ir al formulario del club de Paco 14 143 250 279 298 321 334 344 355 364 Accesos al Blog 16 29 40 56

DenunciasN° de registros en la base de datos (denuncias) 21 264 509 607 646 707 760 800 847 892 N° de denunciantes 18 194 377 454 486 529 571 602 636 669 Entradas desde el Mail 12 322 872 1.244 1.370 1.502 1.734 1.850 1.956 2.124



Evolución usuarios únicos

-

500

1.000

1.500

2.000

2.500

16/10

/2007

17/10

/2007

18/10

/2007

19/10

/2007

20/10

/2007

21/10

/2007

22/10

/2007

23/10

/2007

24/10

/2007

25/10

/2007



Visitas a las secciones

-

500

1.000

1.500

2.000

2.500

3.000

3.500

16/10

/2007

17/10

/2007

18/10

/2007

19/10

/2007

20/10

/2007

21/10

/2007

22/10

/2007

23/10

/2007

24/10

/2007

25/10

/2007

Entradas en sección Webisodios Entradas en sección Denuncia Entradas en sección Denunciados Home



Visualizaciones vídeos

-

500

1.000

1.500

2.000

2.500

3.000

16/10

/2007

17/10

/2007

18/10

/2007

19/10

/2007

20/10

/2007

21/10

/2007

22/10

/2007

23/10

/2007

24/10

/2007

25/10

/2007

Visualizaciones del video La Llamada Visualizaciones del video Azulejos Visualizaciones del video La Familia



Mails enviados vs entradas desde mail

-

100

200

300

400

500

600

16/10

/2007

17/10

/2007

18/10

/2007

19/10

/2007

20/10

/2007

21/10

/2007

22/10

/2007

23/10

/2007

24/10

/2007

25/10

/2007

Mails enviados Entradas desde el Mail



Denunciantes vs. Denuncias

-

50

100

150

200

250

300

16/10

/2007

17/10

/2007

18/10

/2007

19/10

/2007

20/10

/2007

21/10

/2007

22/10

/2007

23/10

/2007

24/10

/2007

25/10

/2007

N° de denunciantes N° de registros en la base de datos (denuncias)



Visitas a enlaces externos

- 50

100 150 200 250 300 350 400 450

16/10

/2007

17/10

/2007

18/10

/2007

19/10

/2007

20/10

/2007

21/10

/2007

22/10

/2007

23/10

/2007

24/10

/2007

25/10

/2007

Ir a la w eb de Paramount Ir al formulario del club de Paco Accesos al Blog



Diseño web - programasEl programa elegido depende del proyecto que tengamos entre manos, nuestros conocimientos y costumbres. En agencia, normalmente, el departamento creativo marca el diseño gráfico en photoshopy el departamento de tecnología lo integra en la programación conveniente (html, flash…)

* Adobe Photoshop CS – Diseño gráfico, Editor de Imágenes

* Dreamweaver - Editores HTML

* Expression Web (sucesor de FrontPage que dejó de producirse en 2006) – Editor html

* UltraEdit - Editor de texto

* HTML-kit - Editor web

* Flash - Editor de animaciones

* Sothink DHTML Menu - Creación de menús DHTML

* Zend Studio - Editor PHP

* FileZilla, cliente FTP - FTP

* Mozilla - Navegador web

* PDF Creator - Editor ficheros PDF

* Bitrix Site Manager - XML

* Skype - General

* Visual Web Developer 2005 Express Edition - IDE gratuito para .NET

* Camtasia Studio - Creación de videotutoriales


Diseño web - programas

* Adobe Photoshop CS – Diseño gráfico, Editor de Imágenes

A lo largo de sus distintas versiones ha ido sofisticándose cada vez más e incorporando nuevas herramientas, a la vez que se perfeccionaban las existentes. Con todo se puede decir que estamos hablando de un programa muy completo, vivo y muy práctico.


Diseño web - programas* Dreamweaver - Editores HTML

Dreamweaver es la herramienta de diseño de páginas web más avanzada, tal como se ha afirmado en muchos medios. Aunque sea un experto programador de HTML el usuario que lo maneje, siempre se encontrarán en este programa razones para utilizarlo, sobretodo en lo que a productividad se refiere.

Cumple perfectamente el objetivo de diseñar páginas con aspecto profesional, y soporta gran cantidad de tecnologías


Diseño web - programas* Flash - Editor de animaciones

La clave de Flash es que es un programa de animación vectorial. Esto significa que se pueden crear animaciones complejas: aumentar y reducir elementos de la animación, mover de posición estos objetos, y otras cosas sin que la animación ocupe mucho espacio en el disco. Los vectores con los que trabaja Flash sólo son, por decirlo de alguna manera, siluetas que casi no ocupan espacio y se pueden modificar fácilmente y sin gasto de memoria en disco.


Diseño web - programasEntrega de materiales

Siempre debemos hablar de brutos y para presentar.

Nos referimos a doc brutos cuando hablamos de los archivos en los que estamos realizando el trabajo en sí. En el caso de un diseñador sus brutos serán los psd’s generados por el photoshop, y en el caso de un flashero por ejemplo será el .fla de lo que esté haciendo.

Los para presentar, son los archivos derivados de los brutos que nos sirven para ir viendo cómo va quedando el trabajo, que además en el caso del flash, serán los que se muestren realmente. En diseñadores hablaremos de jpgs (normalmente) y pngs (son los únicos que permiten un fondo transparente), flasheros de .swf, de sistemas html, en vídeo de .flv (vídeos para integrar en flash), etc.


Diseño web - navegadoresUn navegador web (del inglés, web browser) es un programa que permite visualizar la información que contiene una página (ya esté esta alojada en la World Wide Web o en uno local).

Cuando diseñamos una página web hay que decidir en qué navegadores queremos estar porque no todos soportan todas las tecnologías, o hay que adaptar la programación de la página para que se vea y funcione bien en uno u otro. También hay que tener en cuenta la interfaz del mismo, ya que el usuario puede hacer uso de barras adicionales que van reduciendo la visibilidad de la página.

Navegadores más extendidos

Actualmente el navegador más utilizado en el mundo es Internet Explorer en su versión 7, quizás porque viene integrado en Windows.

Después está el navegador de Mozilla Firefox, el cual se está popularizando cada vez más. Firefoxes un competidor serio de Microsoft que ya alcanza una quinta parte de la cuota total. Safari con más del 8% es otro navegador en rápida progresión. Existen también los navegadores, Netscape Navigator, Opera y Chrome con un uso de menos del 2% en el mercado (mac). Además existe Konqueror para GNU/Linux, y Epiphany el navegador oficial de Gnome.


Diseño web - resoluciones

La resolución a la hora de ponernos a diseñar una página web va a depender de la que estémás extendida por los usuarios.

Actualmente, casi la mayor parte de los usuarios (heavy users que son la referencia) tienen como resolución en sus pantallas 1280 x 1024 píxeles.

Sin embargo, como se indicaba en el punto anterior, es preciso tener en cuenta lo que la interfaz del navegador ocupará para restárselo a esta medida y poder hacernos una idea precisa de cómo quedará nuestro diseño de verdad.

En algunas ocasiones las páginas se diseñan (hablamos de flash) reescalables, es decir, que adaptan su “forma” al tamaño del navegador (desde del mínimo que sería el 800x600), normalmente lo que se “redistribuye” son los elementos que pueden estar en los extremos como logotipos, menús residuales, etc.


Diseño web – resoluciones 800x600


Diseño web – resoluciones 1280x1024


Tipografías Un elemento de comunicación más

Ya sea en diseño web o diseño general la tipografía es uno de los elementos más difíciles de tratar. Al elegirla hay que tener en cuenta:

• Su facilidad de lectura

• Su armonía con el conjunto

• Su facilidad de actualización, cambio…

Tipografías webEn diseño web las tipografías suelen estar reservadas a titulares, botones o elementos cuyo diseño tiene algún interés especial o debe llamar la atención y se vectorizan para que no pesen mucho al convertirlas en imagen.

Para textos de lectura que deben transmitir un mensaje se trabaja con tipografías estándares que todo el mundo tiene en sus máquinas como arial, verdana, times…

En muchas ocasiones las tipografías se crean ad hoc para un proyecto en concreto, sobre con perfiles como el de diseñardor, animador o ilustrador.


Tipografías


BBDDRecogida de datos del usuario para uso posterior

Nada

Crear comunidades

Spam

Enviar futuras promociones

Enviar boletines

Segmentarlos más

Estudios de mercado

¿Qué suelen hacer las empresas con los datos de eMail recopilados?


Clasificación de sitesUna forma de clasificar las distintas páginas web es por su dimensión a nivel de información o navegación:

Sites :: Página web de gran envergadura a nivel de información y navegación en la que los usuarios pueden informarse de todo lo que deseen saber sobre algo y pasarse mucho tiempo sin repetir contenido, tipo sites corporativos, portales de ocio-informativos, portales editoriales, e-nciclopedias (wiki), portales e-commerce, bitácoras (Blogs, redes…)

Microsites :: Páginas que contienen menor cantidad de información así como menor tiempo de navegación (- pantallas). No tienen que ser estrictamente publicitarias pero sí tener una fecha de caducidad tipo publicitarios de lanzamiento, relanzamiento, acción concreta (flashmob), campaña de sensibilización, concurso, promoción, contenido de apoyo (explicación de uso…).

Minisites :: Páginas de muy poco o apenas contenido con una clara función-objetivo y un tiempo de vida definido tipo suscripciónes, formularios participativos, catálogos premios-productos, descargas, listados…

Buscadores :: muestran listados de otras páginas web como resultado de las peticiones de los usuarios.

Web 2.0La participación del usuario

Web 2.0Resultado de la socialización de la red. Ahora es el usuario el que toma el control del desarrollo de internet. Maneja la tecnología y se le da bien!

Con la entrada de los cuadernos de bitácora, que más tarde se transformaron en los blogs que ahora conocemos, se puso a disposición de todos nosotros una gran herramienta: nuestro propio gestor de contenidos.

Así, internet ha evolucinado entrando en nuestras vidas como lo hizo la TV o el móvil en su momento: para quedarse y proporcionarnos miles de experiencias.

Ahora a nuestros amigos, compañeros de trabajo e incluso del colegio, nos los encontramos en facebook. Los vídeos los vemos en youtube. Organizamos nuestros viajes en agencias online, no sin antes conocer las opiniones de otros usuarios que han vivido la misma experiencia. Ya no vamos al banco sino que manejamos nuestras cuentas, transferencias, hasta facturas online. Si hasta algunos encuentran a su media naranja en una web!!

Todo esto es un campo inagotable a nivel publicitario ya que la presencia de las marcas, siempre que sepan respetar y dialogar de la misma manera que los usuarios a los que se dirige puede convertirse en una comunicación como nunca antes se había conseguido.

Cómo y dónde nos comunicamos y relacionamos

Cómo y dónde nos comunicamos y relacionamos

Nuevas herramientas, sistemas, plataformas,

aplicaciones y servicios

Nuevas herramientas, sistemas, plataformas,

aplicaciones y servicios

LO SOCIALLO SOCIAL LO TECNOLÓGICOLO TECNOLÓGICO

La web de las personas frente a la web de los datosEl paso de la interacción a la colaboración

Web 2.0. La participación del usuario

Web 2.0. La participación del usuario

Qué es un Community Manager: CM

Qué es un Community Manager

Es «Quien se encarga de cuidar y mantener la

comunidad de fieles seguidores que la marca o

empresa atraiga, y es el nexo de unión entre las

necesidades de los mismos y las posibilidades de la empresa.

Para ello debe ser un verdadero experto en el uso de las

herramientas de Social Media».

José Antonio Gallego, presidente de AERCO(Asociación Española de Responsables de Comunidades Online)

Responsabilidadesdel Community Manager

1. Escuchar.Monitorizar constantemente la red en busca de conversacionessobre nuestra empresa, nuestroscompetidores o nuestro mercado.


2. Circular estainformacióninternamente.A raíz de esta escucha, debe ser capaz de extraer lo relevante de la misma, crearun discurso entendible y hacérselo llegar a laspersonas correspondientesdentro de la organización.


3. Explicar la posiciónde la empresa a la comunidad.Responde y conversa activamente en todos los mediossociales en los que la empresa tenga presencia activa(perfil) o en los que se produzcan menciones relevantes.

Escribe artículos en el blog de la empresa o en otrosmedios sociales y selecciona y comparte contenidos de interés para la comunidad.


4. Buscar líderes, tantointerna comoexternamente.La relación entre la comunidad y la empresa está sustentada en la labor de sus líderes y personas de alto potencial.

El/la CM debe ser capaz de identificar y “reclutar” a estoslíderes, no sólo entre la comunidadsino, y sobre todo, dentro de la propia empresa.


5. Encontrar vías de colaboraciónentre la comunidad y la empresa.La comunidad puede ayudar a hacer crecer su empresa. El/la CM les debe mostrar “el camino” y ayudarles a diseñar unaestrategia clara de colaboración.

Perfil el Community Manager

Habilidadessociales

Aptitudestécnicas

Actitudespersonales

Aptitudes técnicas

Experiencia en el sector de la empresa

Conocimientos de marketing, publicidady comunicación corporativa

Capacidad de redacción

Pasión por las nuevas tecnologías, porInternet y la web 2.0.

Creatividad para ganar cuota de atención

Experiencia en comunicación online

Conocimiento de la Cultura 2.0

Habilidades sociales

AsertivoEmpático

AgitadorResolutivo

Buen conversador

Comprensivo

Trabajo en equipo

Cabecilla

Incentivador

Actitudes

• Útil: buen compañero/a, le gusta ser de ayuda.

• Abierto: entiende y aprecia la diversidad.

• Accesible: es cercano en el trato.

• «Always on»: vive en conexión permanente o frecuente a la red.

• Conector: detecta y facilita oportunidades, conectando a

miembros de la comunidad entre sí.

• «Early adopter»: le gusta estar a la última, se podría denominar

cazador de tendencias.

• Evangelista: es un apasionado de la marca, de la empresa y de

la vida.

• Defensor de la comunidad: representa a los clientes y

usuarios ante la empresa. Le gusta la gente.

• Transparente: en las normas y en la igualdad entre los usuarios.

Lapaginaweb 2010

Business

Transcript of Lapaginaweb 2010