1

PRÁCTICA EMPRESARIAL
DESARROLLO Y ADMINISTRACIÓN DE SITIOS WEB DE LA UNIVERSIDAD
TECNOLÓGICA DE PEREIRA

JOSÉ LUIS TANGARIFE GALLEGO

Estudiante de Ingeniería en Sistemas y Computación

UNIVERSIDAD TECNOLÓGICA DE PEREIRA

FACULTAD DE INGENIERÍAS
INGENIERÍA DE SISTEMAS Y COMPUTACIÓN
PEREIRA
2017
 2

PRÁCTICA EMPRESARIAL
DESARROLLO Y ADMINISTRACIÓN DE SITIOS WEB DE LA UNIVERSIDAD
TECNOLÓGICA DE PEREIRA

JOSÉ LUIS TANGARIFE GALLEGO

Estudiante de Ingeniería en Sistemas y Computación

Asesor del proyecto Juan Carlos Vergara

Ingeniero en Sistemas y Computación
Coordinador e Instructor de Academia Cisco ASC-ITC

UNIVERSIDAD TECNOLÓGICA DE PEREIRA

FACULTAD DE INGENIERÍAS
INGENIERÍA DE SISTEMAS Y COMPUTACIÓN
PEREIRA
2017
 3

Nota de aceptación

________________________________________

Director de la práctica

________________________________________

Pereira, noviembre de 2017

 4

DEDICATORIA

A:
Mi madre Aracelly Gallego, por darme la vida, quererme mucho, creer en mí y porque siempre
me apoyaste para ser un profesional y ser una buena persona. Mamá gracias por darme una
carrera para mi futuro, todo esto te lo debo a ti.
Mi padre Jaime quien me apoyó, mi hermana Karen por ser mi ejemplo que seguir, por todo el
apoyo que me proporciono en estos años de estudio.
Mis amigos Miguel, Ana, Valentina, Alejandro, Mauro y Heliana Alejandra por haber
compartido estos largos años de estudio y ayuda directa o indirectamente.
A Recursos Informáticos y Educativos – CRIE, quienes me ayudaron en el momento más difícil
de mi vida. Sección de la web, gracias por hacerme crecer como persona y profesional.

Gracias a todos por su apoyo.

 5

AGRADECIMIENTOS

Emerson Cardona
Licenciado en Deportes y Recreación

Juan Carlos Vergara

Ingeniero de Sistemas y Computación

Oswaldo Agudelo González

Director Recursos Informáticos y Educativos
Universidad Tecnológica de Pereira

Mg. Angela María Vivas Cuesta

Web Manager Universidad Tecnológica de Pereira
 6

TABLA DE CONTENIDO

DEDICATORIA............................................................................................................................... 4
AGRADECIMIENTOS ................................................................................................................... 5
TABLA DE CONTENIDO .............................................................................................................. 6
TABLA DE IMÁGENES................................................................................................................. 8
RESUMEN ....................................................................................................................................... 9
INTRODUCCIÓN ......................................................................................................................... 10
1. OBJETIVO ............................................................................................................................. 11
1.1. Objetivos específicos ....................................................................................................... 11

2. METODOLOGÍA .................................................................................................................. 12
2.1. Primera etapa: adaptación al puesto ................................................................................ 12

2.2. Segunda etapa: creación de plantilla institucional y capacitaciones ............................... 12

2.3. Tercera etapa: procedimientos de streaming ................................................................... 12

2.4. Cuarta etapa: portal de eventos ........................................................................................ 12

3. DESARROLLO ..................................................................................................................... 13
Primera etapa: adaptación al puesto ........................................................................................... 13

Segunda etapa: creación de plantilla institucional y capacitaciones .......................................... 14

Tercera etapa: procedimientos de streaming .............................................................................. 20

Cuarta etapa: portal de eventos .................................................................................................. 29

4. ENTREGABLES ................................................................................................................... 34
4.1. Informe Inicial ................................................................................................................. 34

4.2. Avance 1 .......................................................................................................................... 34

4.3. Avance 2 .......................................................................................................................... 34

4.4. Avance 3 .......................................................................................................................... 34

4.5. Avance 4 .......................................................................................................................... 35

4.6. Informe Final ................................................................................................................... 35

 7

5. CONCLUSIONES, APORTES Y RECOMENDACIONES ................................................. 36

6. BIBLIOGRAFÍA .................................................................................................................... 37
7. ANEXOS ................................................................................................................................ 38
7.1. Anexo 1............................................................................................................................ 38

7.2. Anexo 2: .......................................................................................................................... 44

7.3. Anexo 3............................................................................................................................ 45

7.4. Anexo 4............................................................................................................................ 46

7.5. Anex o 5........................................................................................................................... 47

7.6. Anexo 6............................................................................................................................ 49

 8

TABLA DE IMÁGENES
1- Logo WordPress _____________________________________________________________________________ 14
2- Plantilla de los blogs: academia.utp.edu.co y blog.utp.edu.co ________________________________________ 19
3-Canal de Streaming UTP _______________________________________________________________________ 21
4- Precios Wirecast ____________________________________________________________________________ 24
5- Precios Livestream ___________________________________________________________________________ 25
6- OBS Studio _________________________________________________________________________________ 26
7- Switch Blackmagic ___________________________________________________________________________ 27
8- Portal de Eventos ____________________________________________________________________________ 30
9- symfony ___________________________________________________________________________________ 33
 9

RESUMEN

Este documento hace referencia de la práctica universitaria la cual es conducente a grado, fue
realizada en la Universidad Tecnológica de Pereira en el CRIE, área de administración de la web.
Se especifica cuáles son las funciones y las acciones realizadas en el periodo de tiempo que dura
la práctica. Se muestra el cronograma con la documentación de cada labor y tarea realizada.

La práctica consiste en dar apoyo al desarrollo y administración de los sitios web de la UTP con
la supervisión de los profesionales que se encargan de administrar y desarrollar los sitios, dando a
cabalidad las tareas asignadas a la práctica empresarial.
 10

INTRODUCCIÓN

La Universidad Tecnológica de Pereira en su área administrativa en la sección de Recursos

Informáticos y Educativos la cual está encargada de las áreas de diseño, academia cisco,
capacitación, desarrollo web, red, salas y televisión, donde se busca la creación de estrategias y
proyectos relacionados para la implementación de nuevas tecnologías de la información,
renovación de equipos y software teleinformática, cuenta con un equipo de trabajo profesional
para brindar una evolución continua en sus actividades y conocimiento para poder ofrecer un
excelente servicio.
La necesidad de soporte y mantenimiento a las aplicaciones ya creadas y la importancia de llevar
a cabo los nuevos proyectos de desarrollo, impulsan a la entidad a buscar apoyo en los
practicantes que tienen la capacidad para estas labores, lo cual los convierte en una pieza
fundamental para el crecimiento y fortalecimiento de la dependencia.
 11

1. OBJETIVO

Desarrollar y dar soporte a nuevos sitios web institucionales, así como el mantenimiento de los
actuales sitios web y herramientas digitales institucionales, administrados por Recursos
Informáticos y Educativos de la Universidad Tecnológica de Pereira.

1.1. Objetivos específicos

- Garantizar la implementación de Gobierno en Línea de los sitios Web institucionales.

- Reestructurar los sitios web administrativos con contenido normativo de la institución.
- Desarrollo de software para la creación de nuevas aplicaciones web de la Universidad
Tecnológica de Pereira
 12

2. METODOLOGÍA

La metodología de la práctica será por etapas:

2.1. Primera etapa: adaptación al puesto

En esta etapa, se define cuáles son las funciones dentro de la empresa y las funciones dentro del
equipo de trabajo, se recibe explicación sobre los trabajos previos realizados en el área de trabajo,
como software y documentación.

2.2. Segunda etapa: creación de plantilla institucional y capacitaciones

En esta etapa, se crea la plantilla institucional para los blogs de la Universidad Tecnológica de
Pereira, los cuales se encuentran bajo el dominio de academia.utp.edu.co y blog.utp.edu.co. Éste
es un servicio que la universidad ofrece a toda la comunidad universitaria.

A su vez se da inicio de las capacitaciones a las personas que creen el blog y que soliciten
asesoría, ya sea en academia.utp.edu.co o blog.utp.edu.co sobre la administración de cada sitio,
hasta la finalización de la práctica universitaria.

2.3. Tercera etapa: procedimientos de Streaming

Investigación de recursos y procedimientos para la realización de Streaming de los eventos
realizados en la Universidad Tecnológica de Pereira.

Inicio de actualización y mantenimiento de los sitios web internos de la Universidad Tecnológica

de Pereira.

2.4. Cuarta etapa: portal de eventos

Desarrollo del sitio de portal de eventos de la Universidad Tecnológica de Pereira
 13

3. DESARROLLO

Primera etapa: adaptación al puesto

Se empieza con la práctica universitaria el día 01 de junio del 2017, donde se da inicio con una
inducción con los miembros del equipo de trabajo (CRIE, administración de la web). La
coordinadora del grupo me presento al equipo de trabajo, y cuál es la labor que desempeña cada
uno. Se realiza un recorrido por las instalaciones de la oficina presentándome a los compañeros
de área de trabajo. Me explican cada uno de los servicios que ofrece el CRIE y cuales se manejan
en el área de administración y desarrollo web que están bajo el dominio utp.edu.co, como son los
blogs a los cuales tiene acceso toda la comunidad universitaria, los sitios de web de cada facultad
y la realización de Streaming que son transmisiones en directo.
Dando continuidad a la inducción realizada, se explica las actividades principales del practicante,
el cual es brindar apoyo en el desarrollo e implementación y mantenimiento de software
empresarial que están bajo la administración de Recursos Informáticos y Educativos.
Teniendo en cuenta las actividades realizadas se me indican los horarios de la jornada laboral y
los alcances de cada actividad que se desarrolla en la web. Además, el acompañamiento por los
compañeros de área es un factor muy importante, ya que, ellos son profesionales capacitados y
con conocimientos suficientes, los cuales sirven como apoyo y para tener un buen desempeño en
la práctica.
 14

Segunda etapa: creación de plantilla institucional y capacitaciones

En esta etapa que comienza después de recibir la inducción necesaria para dar comienzo al
desarrollo y soporte a nuevos sitios web institucionales, y a su vez al mantenimiento de los
actuales sitios web.
Se me asigna la tarea de desarrollar una plantilla o theme para los blogs de la Universidad
Tecnológica de Pereira. Esta tarea es asignada por el jefe de ingenieros del área de desarrollo
web, explicando cuáles son los requisitos y peticiones que deben de cumplir esta plantilla, para
lograr el funcionamiento correcto y debe ser desarrollada bajo el framework WordPress.

1- Logo WordPress

Para iniciar con la tarea asignada se comienza con la investigación y estudio del framework
WordPress, donde encontré que el framework WordPress empezó en 2003 originalmente como
una plataforma de blogging, pero con el tiempo ha ido evolucionando a un sistema de CMS
(Content Management System) que funciona para crear prácticamente cualquier tipo de sitio
Web.
Gracias a su flexibilidad y el hecho de que es un software de código abierto, se ha transformado
en la herramienta más poderosa y fácil de utilizar para crear páginas web o blogs, y está
disponible en su versión completa (WordPress.org) como un software descargable que se instala
en un dominio con hosting propio. También está en una versión basada en la Web mucho más
limitada (WordPress.com).
Como ya he mencionado anteriormente, la plataforma funciona para crear cualquier tipo de sitio
Web. Aunque está un poco más enfocada a los blogs, también se pueden crear: páginas
corporativas, tiendas virtuales (e-commerce o wo-ocommerce), páginas de captura, cartas de
 15

venta, sitios web más “estáticos” o tradicionales y mucho más, pudiendo decir que es una
herramienta muy poderosa.
Existen dos ambientes diferentes de WordPress, uno se llama WordPress.com y el otro se llama
WordPress.org:
WordPress.org es el sitio en donde puedes descargar la plataforma para poderla después instalar
en cualquier dominio con hosting web propio, para poder utilizar esta opción se necesita un
dominio y un servicio de hosting. En pocas palabras, WordPress.org es la plataforma descargable
para usar de forma independiente en un dominio propio.
WordPress.com es un servicio muy parecido a Blogger y otras plataformas de sitios gratuitos. Al
crear una cuenta y un blog aquí, tu sitio será hospedado por WordPress y el dominio será alojado
bajo un subdominio de WordPress.com. En conclusión, con WordPress.org tienes mucho más
control, funciones y posibilidades de hacer tu página web o blog como se quiera y moldear a para
cualquier necesidad que se presente.
Dado a la introducción anterior donde se especifica la funcionalidad general de éste framework
podemos saber qué es WordPress, pero entonces lo primero que debemos hacer es definir su
funcionamiento interno qué es un CMS y una aplicación Web, por ello se vamos a definir estos
dos conceptos de funcionamiento del framework.
Una aplicación web es un programa que funciona en un servidor web. La aplicación web se
caracteriza por tener una parte pública Front End o Front Office (lo que sería la web realizada con
WordPress) y una parte privada denominada Back End o Back Office (lo que sería el panel de
administración de WordPress). Al Front Office y al Back Office se accede a través de un
navegador web (como puede ser internet Explorer, Mozilla Firefox, Chrome, opera, safari, etc.).
Un gestor de contenidos o CMS (Content Management System) es una aplicación web que sirve
para crear contenido, editarlo, eliminarlo, en definitiva, para gestionar contenido. Existen
Gestores de contenido específicos para crear tiendas online, Gestores de contenido para crear
cursos online y Gestores de contenido generales que pueden servir para muchas cosas.
Por lo tanto, se puede definir que WordPress es una aplicación web y un gestor de contenidos de
uso general dado a su gran evolución.
Gracias a lo que se conoce como plugin, los cuales son considerados para añadir funcionalidades
al framework, al ser un software libre se le pueden realizar todas las modificaciones en código de
 16

la aplicación y funciona bajo el entorno de servidor web Apache y servidor de bases de datos
MySQL.
Los plugins son extensiones que sirven para ampliar las funcionalidades de WordPress.
En éste framework juegan un papel muy importante los plugins, ya que se pueden instalar de tres
formas diferentes:
- Descarga previa: descarga del plugin y posterior instalación desde el panel de
administración de WordPress.
- Panel de administración: no es necesaria descarga previa. Instalación realizada 100%
desde el panel de administración.
- FTP: esta es la opción más técnica. Utilizando esta forma de instalación deberemos subir
el plugin (descomprimido) a la carpeta “plugins” situada en wp-content/plugins.
Una vez instalado un plugin debemos activarlo para ponerlo en marcha. Es decir, un plugin
instalado, pero no activado no funcionará. Eso sí, un plugin desactivado volverá a recuperar su
configuración cuando se vuelva a activar.
WordPress posee un repositorio denominado “memoria” del servidor donde se guardan los
archivos de WordPress y las imágenes de la página web. En la base de datos se alojan las
diferentes opciones de configuración del framework, plantillas, plugins y los contenidos de texto
de la página web.
Como ya se sabe que WordPress, se procede a conocer el funcionamiento real que es cuando se
accede a través de un navegador web cualquiera y se escribe la url de una página de un sitio web
realizado con el framework, donde se produce una solicitud al servidor donde se hospeda la
instalación. Se recupera la página correspondiente y se envía al módulo PHP que interpreta el
código de la página. En este código se suelen realizar conexiones con la base de datos para
recuperar información de configuración y contenidos de texto.
Una vez interpretado se crea una página HTML con el contenido que se ha ido recuperando de la
base de datos. Dicha página HTML es enviada al navegador web de la persona que hizo la
solicitud, el navegador interpreta el código y muestra la web al cliente.
WordPress posee una serie de archivos los cuales en conjunto dan el funcionamiento requerido de
las páginas web o de lo blogs. Existen archivos y directorios de interés en WordPress los cuales
vamos a definir:
 17

- Wp-config: el archivo wp-config.php está situado en la raíz de WordPress y es el archivo

principal de configuración. En él se establece el nombre y localización de la base de
datos, el nombre de usuario que tiene autorización para gestionarla y su contraseña entre
otros muchos datos.
- Plugins: el directorio “Plugins” está situado en la ruta “wp-content > plugins”. En dicha
carpeta aparecen tantos directorios como plugins haya instalados en WordPress. Cada
carpeta se corresponde con un plugin.
- Themes: el directorio “Themes” está situado en la ruta “wp-content > themes”. En dicha
carpeta aparecen tantos directorios como plantillas o temas haya instaladas en WordPress.
Cada carpeta se corresponde con un tema.
Estos archivos anteriores son los más importantes tanto para la configuración y el funcionamiento
del sitio web.
Centrándonos en el desarrollo de la plantilla para los blogs de la universidad, definiremos los
archivos más importantes para el funcionamiento de la plantilla o theme que se va a desarrollar.
Los archivos de la plantilla o theme son la estructura básica del sitio, son los que dan la
funcionalidad y generan las páginas web.
WordPress utiliza una estructura HTML, una hoja de estilos CSS y su contenido se dan por
diferentes archivos como son:
- Style.css: La hoja de estilo principal. Esto debe incluirse con su tema, y debe contener el
encabezado de información de su tema.
- Rtl.css: La hoja de estilo rtl. Este archivo se incluirá automáticamente si la dirección del
texto del sitio web es de derecha a izquierda.
- Index.php: Es el archivo principal donde se estructura el contenido de la plantilla.
- Comments.php: El archivo donde se generan los comentarios.
- Front-page.php: Es el archivo que indica la portada del sitio.
- Home.php: es el archivo la página de inicio, que es la página principal de forma
predeterminada. Si usa una página frontal estática, esta es la plantilla para la página con
las últimas publicaciones.
- Single.php: Se usa cuando se consulta una sola publicación. Para esta y todas las demás
plantillas de consulta, Index.php se utiliza si la plantilla de consulta no está presente.
 18

- Single- {post-type}.php: se utiliza cuando se consulta una sola publicación de un tipo de

publicación personalizado. Por ejemplo, single-book.php se usaría para mostrar
publicaciones individuales del tipo de publicación personalizado denominado "libro".
Index.php se utiliza si la plantilla de consulta para el tipo de publicación personalizado no
está presente.
- Page.php: Se usa cuando se consulta una página individual.
- Category.php: Se usa cuando se consulta una categoría.
- Tag.php: La plantilla de etiqueta. Se usa cuando se consulta una etiqueta.
- Taxonomy.php: Se utiliza cuando se consulta un término en una taxonomía personalizada.
- Author.php: Se usa cuando se consulta a un autor.
- Date.php: Se usa cuando se consulta una fecha u hora. Año, mes, día, hora, minuto,
segundo.
- Archive.php: Se utiliza cuando se consulta una categoría, autor o fecha. Tenga en cuenta
que esta plantilla será anulada por Category.php, Author.php y Date.php para sus
respectivos tipos de consulta.
- Search.php: Se usa cuando se realiza una búsqueda.
- Attachment.php: Se usa cuando se ve un archivo adjunto.
- Image.php: Se usa cuando se visualiza un archivo adjunto de una sola imagen. Si no está
presente, se usará Attachment.php.
- 404.php: Se usa cuando WordPress no puede encontrar una publicación o página que
coincida con la consulta.
Las plantillas o temas nos dan la apariencia estética de WordPress. Es decir, si WordPress es
como el “motor” de la web, las plantillas o temas son el filtro a través del cual vemos una web
realizada con WordPress. Las plantillas nos marcan el diseño, la parte estética de la web.
Con la utilización de los archivos anteriores mencionados y realizando el desarrollo
correspondiente se le da forma y se estructura la plantilla web de los blogs de la UTP como se
evidencia en la figura siguiente:
 19

2- Plantilla de los blogs: academia.utp.edu.co y blog.utp.edu.co

Dado al procedimiento anterior descrito, se realizan las plantillas para los blogs de la UTP, los
cuales se encuentran en producción y se pueden observar desde los siguientes dominios:
- http://academia.utp.edu.co/
- http://blog.utp.edu.co/
 20

Tercera etapa: procedimientos de Streaming

Streaming es un servicio que ofrece la Universidad Tecnológica de Pereira donde se transmiten

en tiempo real por un canal de YouTube los eventos programados por dicha institución, los
cuales se encuentra bajo la administración de Recursos Informáticos y Educativos (CRIE).
Desde hace varios años se puede realizar una transmisión en directo con contenido multimedia en
los computadores, pero sus altos costos han impedido a una buena evolución y utilización de
cualquier persona. En la década de los 80 y 90 los computadores personales se hicieron con
especificaciones para poder lograr una transmisión de cierto contenido multimedia. Donde hay
dos requerimientos muy importantes como tener suficiente potencia en la CPU y un ancho de
banda con gran velocidad de transmisión, además las rutas de alta latencia en el sistema operativo
para evitar desbordamiento de los datos.
Con el paso del tiempo y evolución en la tecnología los requerimientos fueron disminuyendo y ya
se cumplían las características para realizar un Streaming como fueron mayor ancho de banda,
mayor acceso a redes, uso de protocolos, formatos estándar como TCP/IP, HTTP, HTML y la
comercialización del internet, que es el actor más importante en la transmisión de multimedia por
la web.
Estos avances en materia de redes informáticas y hoy en día con la existencia de poderosos
computadores en el hogar con modernos sistemas operativos, tornaron el Streaming en algo
práctico y asequible para los usuarios comunes. Fueron también creados para dispositivos de
radio por internet no anexados al computador para ofrecer a los usuarios la posibilidad de
escuchar Streaming de audio sin necesidad de una PC. En general, el contenido multimedia posee
gran volumen, pero lo que los costos de almacenamiento y transmisión siguen siendo un poco
significativos.
La creciente demanda del consumidor por contenido de Streaming de alta definición ha llevado a
la industria a desarrollar una serie de tecnologías como WirelessHD o ITU-T G.hn, que han sido
optimizadas para reproducir Streaming de contenido HD sin que el usuario tenga que instalar
nuevos cables de redes.
Actualmente, un Streaming se puede hacer en directo o a la carta. Los Streaming en directo por lo
general son distribuidos mediante lo que se conoce como Streaming en tiempo real, que envía los
datos directamente al computador o dispositivo sin necesidad de guardar el archivo en un disco
 21

duro. Por su parte, el Streaming a la carta se realiza mediante la descarga progresiva, la cual
almacena el archivo en un disco duro y luego lo reproduce desde ahí. Los Streaming a la carta
suelen ser guardados en discos duros y servidores por mucho tiempo, mientras que los Streaming
en directo están disponibles solamente una vez.
El Streaming tiene cada vez mayor relación con el social media. Por ejemplo, sitios como
YouTube fomentan la interacción social en transmisiones por internet a través de chats en vivo,
encuestas online, etc. Adicionalmente, el Streaming se usa cada vez con más frecuencia en el
social business y la tecnología educativa.
Debido a la popularidad de los Streaming, muchos programadores han incluido aplicaciones de
Streaming de películas HD para aquellas personas que utilizan dispositivos más pequeños, como
tablets y smartphones, a diario.

3-Canal de Streaming UTP

 22

Streaming es un servicio multimedia prestado en tiempo real por un proveedor que tiene como
destino un consumidor final, así mismo, Streaming hace referencia al proceso de transmitir todo
tipo información de esta manera.
Un reproductor de video puede comenzar a transmitir la información antes de que el archivo haya
sido transmitido en su totalidad. El método de distribución de la información suministrada
depende específicamente de las redes de telecomunicaciones, pues la mayoría de los sistemas
ofrecen por naturaleza servicios Streaming (radio, televisión)
Es importante destacar que el término Streaming no se limita estrictamente a archivos de vídeo y
audio, sino que también incluye el subtitulado oculto en directo, la cinta informativa y el texto en
tiempo real. Estos últimos entran en la categoría de Streaming de texto.

El Streaming en directo se refiere a todo contenido de internet transmitido en tiempo real, al

momento de los hechos, tal como la televisión en directo transmite su contenido por medio de
ondas de radio. El Streaming en directo para internet requiere de una fuente multimedia (cámara
de vídeo, interfaz de audio, software de captura de pantalla), un decodificador para digitalizar el
contenido, un medio editor y una red de distribución de contenido. El Streaming en directo no
necesariamente tiene que ser grabado en el lugar de origen, aunque suele ser así.
En la UTP se realizan Streaming a los eventos programados por la institución donde se utilizan
algunos equipos como son:
- Un computador con conexión a internet
- Canal de YouTube, https://www.youtube.com/utpereira
- Tarjeta de Streaming
- Cámara de televisión
La dependencia de Recursos Informáticos y Educativos de La Universidad Tecnológica de
Pereira ofrece el servicio de Streaming como una tecnología de transmisión de videos en tiempo
real a la comunidad en general poniendo a su alcance emisiones de eventos institucionales que
pueden ser vistos a través de http://online.utp.edu.co.
La prestación de este servicio requiere de un equipo calificado que da soporte a la transmisión de
los eventos en vivo. Para esto se cuenta con una persona encargada del manejo de la cámara de
video y otra persona a cargo de recibir y enviar la señal de la transmisión mediante un software,
hacia el servidor de Streaming de la Universidad. De igual manera se hace monitoreo del
 23

comportamiento de la señal, de las personas conectadas a la transmisión y del buen

funcionamiento del servicio.
Para el mejoramiento continuo del servicio de Streaming, se requiere que se realice una
investigación de nueva tecnología para la realización de transmisiones, como son: tarjetas para
Streaming de mayor calidad, software que permita una mejor transmisión y dispositivos que se
puedan implementar.
Bajo esa petición hecha, se procede hacer un informe de las nuevas tecnologías que se pueden
utilizar y es presentado a la jefe encargada para su análisis pertinente.

Software para la realización de Streaming:

WIRECAST: es un software de Streaming para la producción en directo y grabar transmisiones.
Este software no es gratuito, pero es una solución muy completa que permite mezclar entre varias
fuentes de vídeo, superponer gráficos y textos, y mucho más.
Funciones de WIRECAST:
- Amplio soporte para cámaras: Captura flujos de vídeo en vivo desde múltiples cámaras,
escritorios de ordenador y tarjetas de captura.
- Emite el escritorio de cualquier ordenador de la red. Muestra PowerPoint, demostraciones
de programas, entrevistas de Skype.
- Añade valor a tu emisión con cambios en directo, transiciones, títulos, grafismo.
- Emite en directo en todos los lugares que quieras, además de grabar tu emisión en disco.
- Entrega Flash, QuickTime y Windows Media de alta calidad mediante reajustes muy
sencillos.
Wirecast soporta un número ilimitado de entradas de cámara que van desde cámaras web (a
través de USB, firmware) a DV / HDV y cámaras SDI (a través de tarjetas de captura), el número
de entradas de fuente que se pueden agregar a una emisión sólo está limitada por el hardware y la
potencia de procesamiento del ordenador.
Protocolos de Streaming:
- RTMP
- RTSP
- MMS (Windows)
 24

Limitaciones de prueba gratis de Wirecast: Sus emisiones contarán tanto con marcas de agua de
vídeo y audio, pero la aplicación será completamente funcional.
Comprar Wirecast Studio ($ 495.00) o Wirecast Pro ($ 995.00) para eliminar estas limitaciones.

4- Precios Wirecast

LIVESTREAM: permite a cualquier empresa emitir vídeos en directo a una gran audiencia, lo
que resulta muy interesante cuando se organizan eventos corporativos, celebraciones o
presentaciones de nuevos productos.
Fuente de vídeo: desde una Webcam conectada por USB, hasta un equipo tipo VTR/VCR o
cámara profesional utilizando una capturadora de vídeo, de acuerdo con sus necesidades.
"Live Encoder": un "Live Encoder" es un hardware o software capaz de comprimir la fuente de
vídeo, en tiempo real, y enviarla a un servidor de medios, en un formato específico, usando un
protocolo determinado.
Servidor de Medios: El servidor de medios es un software que se instala en un servidor dedicado
y está optimizado/especializado en "servir" contenidos multimedia a los usuarios finales, a través
de (por ejemplo) una WebTV. El servidor de medios recibe el vídeo comprimido suministrado
por el "Live Encoder" y lo transmite a los usuarios. Un CDN (Content Delivery Network = Red
de Distribución de Contenidos) es una especie de servidor de medios gigantesco, con mucha más
 25

capacidad que un sólo servidor dedicado (no es económico...) y ofrece la posibilidad de "servir" a
un número virtualmente ilimitado de usuarios simultáneamente.

Los servidores de medios más utilizados son:

- Adobe Flash Media Server: Es el más utilizado pero las versiones anteriores a la 4.5 sólo
son compatibles con Streaming Flash (protocolo RTMP). Para realizar Streaming
simultáneo Flash / iPhone, por HTTP, se requiere la versión 4.5 de este servidor de
medios. Hay una edición gratuita para prueba/desarrolladores.
- Wowza Media Server: Este servidor de medios ha sido adoptado por muchos CDNs
debido a su flexibilidad y precio. Es capaz de hacer Streaming simultáneo para Flash e
iOS. Hay una edición gratuita para prueba/desarrolladores.
- Red5: Red5 Media Server es un servidor de medios gratuito compatible con Flash.
- WS. WebTV, a través de la extensión StreamClip, es capaz de conectarse con servidores
de medios para mostrar el contenido audiovisual a los usuarios, utilizando descarga por
Streaming o progresiva.3

5- Precios Livestream

OBS studio: es un software de código abierto y libre que me permite hacer grabaciones de vídeo
y Streaming en directo en diferentes plataformas como Facebook o YouTube.
 26

- Tiene versiones para Windows, Mac y Linux.

- Se puede configurar diferentes escenas y hacer una mezcla entre ellas para hacer la
retransmisión más amena con diferentes fuentes de audio, vídeo e imágenes.
- Funciona para Windows 7,8 y 10, como también en Mac.
OBS es de código libre y gratuito. Sirve para grabar y hacer Streaming de vídeo en todas las
plataformas: Windows, Linux y OS X. Codifica utilizando el códec H264 y AAC. Permite hacer
transmisión en vivo de: YouTube, Twitch, DailyMotion, USTREAM y varios más. Viene con la
posibilidad de implementarle plugin que expanden su funcionalidad y un API que permite a los
desarrolladores hacer los suyos propios.

6- OBS Studio

Pueden utilizar muchas fuentes diferentes para su transmisión en vivo que incluye:
- Múltiples cámaras web
- Cámaras DSLR
- Imagen y vídeos en su ordenador
- La cámara del teléfono (a través de una cámara de aplicaciones IP)
- Su pantalla
- Una ventana en su computadora
 27

Apoyan varias pantallas al mismo tiempo (incluyendo imagen-en-imagen) y se puede configurar

fácilmente los atajos de teclado con transiciones de escenas resbaladizas.

Xsplit Broadcaster: es una aplicación de Streaming y video en vivo desarrollada y mantenida

por SplitmediaLabs. Se utiliza sobre todo para la captura de juego con fines de transmisión o
grabación de vídeo en directo. Xsplit es una herramienta gratuita que te permite generar
contenidos en video siguiendo un paradigma diferente al de camtasia.
Xsplit viene en una variedad de gratuito, versiones personales y Premium, cada una con sus
propias ventajas.
El programa se encarga de capturar la fuente de audio y vídeo que nosotros le indiquemos. Puede
ser cámara web, un juego, un programa y, también, da la posibilidad de añadir una imagen al
vídeo como si de un programa de TV se tratase. Existe una versión gratuita y otra paga. Sólo para
Windows, versión libre y de $ 4.17 / mes.

También se realizaron pruebas con un switch para transmisión de video, el cual se encuentra en la
dependencia de televisión, donde se pretendía hacer una transmisión con diferentes cámaras a la
vez. La marca del switch es blackmagic (HyperDeck Studio) el cual tiene las especificaciones
siguientes:

7- Switch Blackmagic

El modelo HyperDeck Studio permite grabar material audiovisual en unidades de estado sólido y
dispone de conexiones SDI 3G y HDMI compatibles con diversos formatos a una resolución
máxima de 1080p30. Sus controles resultan familiares, dado que son similares a los de un
 28

videograbador, y brinda la posibilidad de almacenar archivos comprimidos o sin compresión con

una calidad 4:2:2 de 10 bits. Este es un equipo económico que facilita la instalación de varias
unidades, en caso de que sea preciso realizar grabaciones aisladas o por períodos más extensos, o
masterizar contenidos en definición estándar y alta definición.
 29

Cuarta etapa: portal de eventos

El portal de eventos es un nuevo servicio que se ofrece por la Universidad Tecnológica de Pereira
que busca como objetivo principal suplir todas las necesidades de las áreas académicas y
administrativas para difundir todos los eventos institucionales, ya que, anteriormente se hacia la
difusión en medios de comunicación como campus informa y redes sociales, los cuales causaban
una saturación en los medios de comunicación, que podrían ser utilizados de una forma más
eficiente y cumplan con los objetivos de la comunicación en la institución. Estos medios como
son el campus informa y las redes sociales tienen unos objetivos de brindar la información con
carácter noticioso, difundir información institucional que lleven a generar sentido de pertenencia
por la universidad y brindar atención al usuario de forma permanente, ósea, tratando de hacerlo
en tiempo real. Entonces la creación del portal de eventos hace que la saturación de información
sea solucionada, cumpliendo con la clasificación de la información y centralizando los eventos a
un espacio adecuado para ellos, como es el sitio web que permita a los usuarios saber de los
eventos programados y conocer con más profundidad y clara la descripción que se tiene para cada
evento, ofreciendo también que exista una interacción del usuario del portal con el servicio web,
dándole al usuario las posibilidades de decir y expresar si quiere asistir, si le interesa la
información allí planteada y de compartir por medio de Facebook la información suministrada en
el evento programado el cual desea visitar. (http://eventos.utp.edu.co/)
Para la realización de este servicio web, se utilizó un framework llamado Symfony, el cual es un
proyecto PHP de software libre que permite crear aplicaciones y sitios web rápidos y seguros de
forma profesional y es de tipo full-stack construido con varios componentes independientes
creados por el proyecto Symfony.
La primera versión de Symfony fue publicada en octubre de 2005 por Fabien Potencier, fundador
del proyecto y coautor de este libro. Fabien es el presidente de Sensio (http://www.sensio.com/),
una empresa francesa de desarrollo de aplicaciones web conocida por sus innovaciones en este
campo.
En el año 2003, Fabien realizó una investigación sobre las herramientas de software libre
disponibles para el desarrollo de aplicaciones web con PHP. Fabien llegó a la conclusión de que
no existía ninguna herramienta con esas características. Después del lanzamiento de la versión 5
de PHP, decidió que las herramientas disponibles habían alcanzado un grado de madurez
 30

suficiente como para integrarlas en un framework completo. Fabien empleó un año entero para
desarrollar el núcleo de Symfony, basando su trabajo en el framework Mojavi (que también era
un framework que seguía el funcionamiento MVC), en la herramienta Propel para el mapeo de
objetos a bases de datos (conocido como ORM, de "object-relational mapping") y en los helpers
empleados por Ruby on Rails en sus plantillas.

8- Portal de Eventos

Fabien desarrolló originalmente Symfony para utilizarlo en los proyectos de Sensio, ya que
disponer de un framework efectivo es la mejor ayuda para el desarrollo eficiente y rápido de las
aplicaciones. Además, el desarrollo web se hace más intuitivo y las aplicaciones resultantes son
más robustas y más fáciles de mantener. El framework se utilizó por primera vez en el desarrollo
 31

de un sitio de comercio electrónico para un vendedor de lencería y posteriormente se utilizó en

otros proyectos.
Después de utilizar Symfony en algunos proyectos, Fabien decidió publicarlo bajo una licencia
de software libre. Sus razones para liberar el proyecto fueron para donar su trabajo a la
comunidad, aprovechar la respuesta de los usuarios, mostrar la experiencia de Sensio y porque
considera que es divertido hacerlo.
NOTA ¿Por qué lo llamaron "Symfony" y no "CualquierNombreFramework"? Porque Fabien
quería un nombre corto que tuviera una letra 's' (de Sensio) y una letra 'f' (de framework), que
fuera fácil de recordar y que no estuviera asociado a otra herramienta de desarrollo. Además, no
le gustan las mayúsculas. "Symfony" era muy parecido a lo que estaba buscando, aunque no es
una palabra correcta en el idioma inglés (la palabra correcta es "symphony"), y además estaba
libre como nombre de proyecto. La otra alternativa era "baguette".
Las principales características de este framework son:
- Su código, y el de todos los componentes y librerías que incluye, se publican bajo la
licencia MIT de software libre.
- La documentación del proyecto también es libre e incluye varios libros.
- Aprender a programar con Symfony te permite acceder a una gran variedad de proyectos:
el framework Symfony 2 para crear aplicaciones complejas, el micro framework Silex
para sitios web sencillos y los componentes Symfony para otras aplicaciones PHP.
- Según GitHub, Symfony es el proyecto PHP más activo, lo que garantiza que nunca te
quedarás atrapado en un proyecto sin actividad. Además, el líder del proyecto. Las
versiones actuales de Symfony requieren disponer de PHP 5.3.8 o superior. Así evitas
instalar en tus servidores versiones PHP peligrosas llenas de problemas de seguridad y a
la vez no es un requisito técnico demasiado exigente.
- En producción, las aplicaciones Symfony solamente necesitan permiso de escritura en dos
directorios internos de la propia aplicación. Además, Symfony incluye varias
herramientas gráficas y de consola para depurar fácilmente los errores que se produzcan
en las aplicaciones.
- Para evitar el uso de contraseñas en archivos de configuración, Symfony permite
establecer los parámetros de configuración de las aplicaciones a través de variables de
entorno del propio servidor.
 32

- La seguridad es tan importante para el proyecto Symfony, que antes de su lanzamiento, se

encargó una auditoría de seguridad a una empresa independiente (ver resultados de la
auditoría).
- La herramienta Capifony (basada en el proyecto Capistrano y creada por miembros de la
comunidad Symfony) simplifica el deploy de las aplicaciones Symfony, incluso en
múltiples servidores y bases de datos.
- La excelente herramienta Composer, que simplifica de forma radical la instalación y
gestión de las dependencias de las aplicaciones PHP, también ha sido creada por varios
miembros de la comunidad Symfony.
- Fácil de instalar y configurar en la mayoría de las plataformas (y con la garantía de que
funciona correctamente en los sistemas Windows y Unix estándares)
- Independiente del sistema gestor de bases de datos
- Sencillo de usar en la mayoría de los casos, pero lo suficientemente flexible como para
adaptarse a los casos más complejos
- Basado en la premisa de "convenir en vez de configurar", en la que el desarrollador solo
debe configurar aquello que no es convencional
- Sigue la mayoría de mejores prácticas y patrones de diseño para la web
- Preparado para aplicaciones empresariales y adaptable a las políticas y arquitecturas
propias de cada empresa, además de ser lo suficientemente estable como para desarrollar
aplicaciones a largo plazo
- Código fácil de leer que incluye comentarios de php Documentor y que permite un
mantenimiento muy sencillo
- Fácil de extender, lo que permite su integración con librerías desarrolladas por terceros
Un framework simplifica el desarrollo de las aplicaciones, ya que automatiza muchos de los
patrones utilizados para resolver las tareas comunes. Además, un framework proporciona
estructura al código fuente, forzando al desarrollador a crear código más legible y más fácil de
mantener. Por último, un framework facilita la programación de aplicaciones, ya que encapsula
operaciones complejas en instrucciones sencillas.
 33

9- symfony

Symfony es un completo framework diseñado para optimizar, gracias a sus características, el

desarrollo de las aplicaciones web. Para empezar, separa la lógica de negocio, la lógica de
servidor y la presentación de la aplicación web. Proporciona varias herramientas y clases
encaminadas a reducir el tiempo de desarrollo de una aplicación web compleja. Además,
automatiza las tareas más comunes, permitiendo al desarrollador dedicarse por completo a los
aspectos específicos de cada aplicación. El resultado de todas estas ventajas es que no se debe
reinventar la rueda cada vez que se crea una nueva aplicación web. Symfony está desarrollado
completamente con PHP y ha sido probado con éxito en sitios como Yahoo! Answers, delicious,
DailyMotion y muchos otros sitios web de primer nivel. Symfony es compatible con la mayoría
de los gestores de bases de datos, como MySQL, PostgreSQL, Oracle y SQL Server de
Microsoft. Se puede ejecutar tanto en plataformas *nix (Unix, Linux, etc.) como en plataformas
Windows
 34

4. ENTREGABLES

Los documentos que se van a relacionar a continuación son los entregables que se hicieron para
la práctica empresarial, donde se indica cada una de las actividades realizadas, los tiempos que se
utilizaron para la realizaron de cada tarea asignada, demostrando de esta forma los avances
hechos durante el tiempo laboral de la práctica empresarial. Dichos informes se ingresaron a la
plataforma de prácticas universitarias donde reposan su historial, de igual manera se relacionan a
continuación:
4.1. Informe Inicial: en el informe inicial se describen los datos personales del estudiante, el
director de la práctica, el título de la práctica empresarial, introducción de lo que se va a
hacer durante la práctica, las actividades o tareas, los objetivos, la metodología de trabajo
y el cronograma el cual puede sufrir variaciones dependiendo como se desarrolle la
práctica empresarial.
El documento debe ser cargado al portal de prácticas empresariales. Este documento es
un requisito para aprobar la práctica empresarial conducente a trabajo de grado.
El documento del informe inicial se puede encontrar al final de este escrito (anexo 1).
4.2. Avance 1: el avance 1 se describen los datos del estudiante, la empresa donde realiza la
práctica, el nombre del jefe inmediato y se detallan todas las actividades o tareas
realizadas durante el primer mes de la práctica, con sus observaciones y conclusiones.
El documento debe ser cargado al portal de prácticas empresariales. Este documento es
un requisito para aprobar la práctica empresarial conducente a trabajo de grado.
El documento del avance 1 se puede encontrar al final de este escrito (anexo 2).
4.3. Avance 2: el avance 2 se describen los datos del estudiante, la empresa donde realiza la
práctica, el nombre del jefe inmediato y se detallan todas las actividades o tareas
realizadas durante el segundo mes de la práctica, con sus observaciones y conclusiones.
El documento debe ser cargado al portal de prácticas empresariales. Este documento es
un requisito para aprobar la práctica empresarial conducente a trabajo de grado.
El documento del avance 2 se puede encontrar al final de este escrito (anexo 3).
4.4. Avance 3: el avance 3 se describen los datos del estudiante, la empresa donde realiza la
práctica, el nombre del jefe inmediato y se detallan todas las actividades o tareas
realizadas durante el tercer mes de la práctica, con sus observaciones y conclusiones.
 35

El documento debe ser cargado al portal de prácticas empresariales. Este documento es

un requisito para aprobar la práctica empresarial conducente a trabajo de grado.
El documento del avance 3 se puede encontrar al final de este escrito (anexo 4).
4.5. Avance 4: el avance 4 se describen los datos del estudiante, la empresa donde realiza la
práctica, el nombre del jefe inmediato y se detallan todas las actividades o tareas
realizadas durante el cuarto mes de la práctica, con sus observaciones y conclusiones.
El documento debe ser cargado al portal de prácticas empresariales. Este documento es
un requisito para aprobar la práctica empresarial conducente a trabajo de grado.
El documento del avance 4 se puede encontrar al final de este escrito (anexo 5).
4.6. Informe Final: el informe final se describen los datos del estudiante, la empresa donde
realiza la práctica, el nombre del jefe inmediato y se detallan todas las actividades o
tareas realizadas desde el primer mes hasta el último mes de la práctica empresarial,
detallando la metodología, técnicas, y herramientas utilizadas para poder cumplir todos
los objetivos propuestos al inicio de la práctica empresarial, además se detallan
recomendaciones, inconvenientes, observaciones del jefe inmediato y se firma este
documento por parte del docente y el jefe inmediato, dando la aprobación de dicha
información.
El documento debe ser cargado al portal de prácticas empresariales. Este documento es
un requisito para aprobar la práctica empresarial conducente a trabajo de grado.
El documento del informe final se puede encontrar al final de este escrito (anexo 6).
 36

5. CONCLUSIONES, APORTES Y RECOMENDACIONES

Como resultado de la práctica realizada, se puede evidenciar la adquisición de nuevos

conocimientos y nuevas experiencias para el practicante, los practicantes le pueden aportan
mucho a un grupo de trabajo como un grupo de trabajo a ellos.

Aplicar el conocimiento adquirido durante el tiempo de estudio en proyectos delegados se siente

satisfactorio, y al poder aportar a un grupo de trabajo nuevos conocimientos en cuanto a
desarrollo y documentación con los que ellos no contaban es gratificante y significativo.

La oportunidad que se le presenta a un estudiante de poder trabajar y moverse en un ambiente

laboral es una experiencia que se debe obtener, ya que con ella se puede crear una conciencia
laboral al momento de obtener el título profesional.

Con la realización de desarrollo y documentos requeridos por cada aplicativo se puede notar la
importancia de tener los proyectos documentos al momento del ingreso de un nuevo practicante,
y de enseñarle el producto a clientes potenciales.

Se debe concientizar a los nuevos practicantes lo importante que es llevar su desarrollo

documentado y organizado, para que al momento de terminar su práctica el nuevo practicante no
entre muy perdido y se le haga más fácil el periodo de adaptación.

El proceso de la práctica empresarial es un gran aporte al desarrollo profesional del practicante,

ya que, puede aplicar todo su conocimiento adquirido durante los largos años de estudio y su
crecimiento como persona.
 37

6. BIBLIOGRAFÍA

- https://es.wordpress.com/
- https://es-co.wordpress.org/
- https://codex.wordpress.org/es:Main_Page
- https://codex.wordpress.org/Stepping_Into_Templates
- https://obsproject.com/
- https://help.livestream.com/hc/en-us
- https://www.webtvsolutions.com/support.php?s=other_docs&d=streaming_workflows&la
ng=es#
- https://www.telestream.net/wirecast/overview.htm
- https://www.telestream.net/wirecast/store.asp
- https://github.com/jp9000/obs-studio/wiki/OBS-Studio-Overview
- https://www.xsplit.com/es/#broadcaster
- https://www.blackmagicdesign.com/es/products/hyperdeckstudio/techspecs
- http://librosweb.es/
- http://symfony.com/
 38

7. ANEXOS
7.1. Anexo 1: Informe inicial
39
40
41
42
43
 44

7.2. Anexo 2: avance 1

 45

7.3. Anexo 3: avance 2

 46

7.4. Anexo 4: avance 3

 47

7.5. Anexo 5: avance 4

48
 49

7.6. Anexo 6: informe final

50
51
52
53
54
55