Portafolio Práctica Profesional DMc40utamed.uta.cl/portafoliosDM/wp-content/uploads/2017/11/...Portafolio Práctica Profesional DMc40 Alumno: Humberto Morales Gutiérrez Jefe de carrera:

Portafolio Práctica ProfesionalDMc40Alumno: Humberto Morales GutiérrezJefe de carrera: Daniela González Erber

Diseño MultimediaEscuela Universitaria de educación virtualUniversidad de TarapacáArica - Chile

ÍNDICE

3. Introducción

4. Antecedentes

5. Identificación de la Empresa

6. Organización

7. Descripción de la Práctica

20. Conclusiones

21. Libro de asistencia

INTRODUCCIÓN

Durante el trasncurso de los últimos 4 años, en nuestra calidad de alumnos de la carrera de Diseño Multimedia nos formamos para enfrentar un mundo en donde todas y cada una de las competencias adquiridas en nuestras aulas representarán fuertes herramientas para asumir todos los desafíos que representa la vida laboral. Uno de los últi-mos pasos dentro del proceso de capacitación universitaria es el de afrontar el periodo de práctica profesional, lo cual nos inserta dentro de un escenario en donde debemos aplicar todo lo aprendido para dar soluciones precisas a problemáticas reales.

Para afrontar esta etapa, he seleccionado a una empresa con un fuerte impacto en la macroregión, no relacionada al ámbito de nuestro estudio, pero con muchas necesidades las cuales un diseñador multimedia puede satisfacer y abordar. La Empresa Portuaria Arica, una empresa del sistema de empresas públicas SEP con 17 años de existen-cia, la cual aportando considerablemente al PIB regional es una de las empresas más grandes de la zona haciéndo de esta pasantía un gran desafío.

El presente informe tiene como fin evidenciar todo el periodo de práctica profesional en ambiente laboral ocurrido durante los últimos meses en esta empresa y así finalizar el proceso de práctica y estar preparado para las siguien-tes actividades que darán término a esta etapa académica.

ANTECEDENTES

Objetivo general

El objetivo general de esta práctica profesional en ambiente laboral es preparar en competencias profesionales al Licenciado en en tecnología Multimedia para su desempeño profesional, permitiéndole aplicar los conocimientos, métodos y técnicas adquiridas a problemas específicos de la profesión, integrarse a equipos interdisciplinarios, conocer un ámbito de la realidad del país, fortalecer su formación ética y resolver los desafíos profesionales que se le presenten.

Objetivos específicos

• Ampliar los conocimientos teóricos del practicante.• Desarrollar un desempeño eficaz a través de la aplicación de conocimientos y habilidades adquiridos durante

su formación académica de pre-grado.• Afianzar una actitud de ética profesional.. Relacionados con la disciplina y la profesión• Promover el desarrollo de potencialidades personales tales como creatividad, seguridad y destreza en el des-

empeño profesional.• Obtener comprensión de su quehacer profesional como un proceso dinámico de constante perfeccionamiento,

incentivando la contribución particular que él pueda hacer en su actividad práctica.• Desarrollar una aproximación científica a su quehacer profesional y de la disciplina.• Permitir la integración del Licenciado en equipos multidisciplinarios y promover su quehacer en ellos con

ética profesional.

IDENTIFICACIÓN DE LA EMPRESA

La Empresa Portuaria Arica, es una empresa autónoma del Estado, que inició sus actividades el 30 de Abril de 1998, de conformidad a la Ley N° 19.542 de Modernización del Sector Portuario Estatal, cuyo principal objetivo es promover la competencia en el sector, descentralizar la Empresa Portuaria de Chile y abrir los puertos estatales al sector privado. El objetivo de EPA es la administración, explotación, desarrollo y conservación del Puerto de Arica, así como también de los bienes que posee, incluidas las actividades inherentes al ámbito portuario.

Reseña Histórica

El 30 de abril de 1998 inicia sus actividades la nueva y autónoma Empresa Portuaria Arica, dando paso a una etapa de gestión caracterizada por la desburocratización, la incorporación privada en las operaciones portuarias y que aspira a obtener mayores niveles de eficiencia, fundamentales para la modernización del Puerto. El 1 de octubre del 2004 se inicia la Concesión del Frente de Atraque No. 1 del Puerto de Arica por 30 años al Consorcio denominado Terminal Puerto Arica S.A., el cual tiene como objetivo la explotación de las actividades portuarias mejorando la competitividad del Puerto de Arica.

Misión

Desarrollar el Puerto de Arica, garantizando su expansión de acuerdo a las necesidades de la demanda presente y futura, fortaleciendo los niveles de productividad, eficiencia y excelencia en el servicio, el cumplimiento del contrato por parte del concesionario, el trato no discriminatorio a los usuarios, velando por lograr un eficiente costo de la cadena logística, generando el menor impacto y mayor cercanía con la comunidad, logrando al mismo tiempo un adecuado retorno para sus accionistas.

Visión

Asumir el liderazgo del desarrollo portuario de la macro región, constituyéndose en un puerto de vanguardia y de excelencia en calidad de servicio, generando proyectos de negocios e innovación logística, alcanzando la auto sustentabilidad económica, protegiendo el medio ambiente y la comunidad.

Servicios

• Uso del Puerto (Frente de atraque)• Admisión de equipos• Admisión y permanencia de módulos transportables• Servicio de Parqueo Vehicular• Servicio de Permisos de Acceso• Servicios de Suministro y Arriendo

Ubicación

Empresa Portuaria Arica esta ubicada en Avenida Máximo Lira #389, Arica, Región de Arica y Parinacota.

Organización

Fig. 2 Personal de la Empresa.

Fig. 1 Organigrama

DESCRIPCIÓN DE LA PRÁCTICA

Antes de comenzar el periodo de Práctica Profesional, junto a mi supervisor definimos la planificación y plan de trabajo para afrontar este periodo definiendo ciertas actividades que serían desarrolladas exclusivamente dentro de esta pasantía laboral durante los plazos definidos por este. Es importante mencionar que como actual funcionario de esta empresa poseo un descriptor de cargo el cual está principalmente enfocado al trabajo de carácter informá-tico por lo que el plan de trabajo se enfocó a cubrir los aspectos competentes al ámbito del diseño y multimedia.

Dentro de las principales tareas definidas por mi supervisor para afrontar esta pasantía laboral son las siguientes:

• Diseño y diagramación de UI/UX (Interface de usuario y experiencia de usuario) de todos los sistemas infor-máticos que integran la intranet Institucional.

• Desarrollo de una aplicación para controlar el acceso vehicular del Antepuerto.• Diseño de los Banners institucionales utilizados en los principales medios de difusión regional.• Diseño y producción de credenciales de acceso para todo el personal de la Empresa.• Motion graphics para difundir la misión, visión y valores corporativos de la empresa.• Montaje 3D parada de bus acercamiento antepuerto.• Propuesta de rediseño Web de la Página institucional.

Además de lo anterior, también se realizaron actividades menores las cuales son de contingencia temporal las cuales son de aspecto gráfico y tiene como fin satisfacer ciertas necesidades de las distintas áreas de la empresa.

En las siguientes páginas se especificarán todas las actividades anteriormente mencionadas junto a las evidencias y resultados.

DISEÑO Y DIAGRAMACIÓN DE UI/UX (INTERFACE DE USUARIO Y EXPERIENCIA DE USUARIO) DE TODOS LOS SISTEMAS INFORMÁTICOS QUE INTEGRAN

LA INTRANET INSTITUCIONAL

La Empresa Portuaria Arica, en su rol de administración del Puerto de Arica, está en constante crecimiento y optimización de sus procesos. Para realizar tareas específicas tales como controles, gestión de correspondencia, gestión de procesos, etc. se han requerido asesorías de desarrollo de software para satisfacer cada una de las necesidades las cuales han aparecido durante la existencia de la compañía.

De acuerdo a lo anterior se ha desarrollado una situación la cual genera un problema considerable a los usuarios de la Empresa:

• Cada software posee una interface de usuario flujo de trabajo distinto.• La curva de aprendizaje es elevada y demanda mucho tiempo.• No existe una norma institucional para los desarrollos de software.• Poca accesibilidad y nula capacidad responsive.• Una cantidad considerable de combinaciones usuario/contraseña para cada sistema.

Como resultado, la Empresa requería urgentemente abordar este tema con el fin de:

• Crear un único flujo de trabajo para todos los sistemas.• Mejorar la curva de aprendizaje de los usuarios tanto como para los desarrollos actuales y futuros.• Aplicar una norma gráfica institucional a todos los desarrollos.• Aplicar un diseño responsive que permita adaptarse a la mayoría de los dispositivos móviles.• Centralizar el acceso a todas las aplicaciones a través de una única autentificación.

En función a los requerimientos de la Empresa, se elaboró una única librería de estilos en CSS y se definieron plantillas para todos los desarrollos de la Empresa con el fin de unificar el software utilizado.

Para desarrollar dicha librería se utilizó un preprocesador de estilos en lenguaje LESS y como base se utilizó Twitter Bootstrap como boilerplate.

Para centralizar el acceso a las aplicaciones, se desarrolló un acceso único utilizando PHP y almacenando la sesión en mysql, la cual es consultada por lo demás sistemas para generar la autentificación.

A continuación se presentan algunas de las plantillas desarrolladas.

Fig. 3 Acceso centralizado

Fig. 4 Panel de control

Fig. 5 Acceso a otros sistemas

Fig. 6 Software de gestión de contratos

Fig. 7 Listados

Fig. 8 Mantenedor

DESARROLLO DE UNA APLICACIÓN PARA CONTROLAR EL ACCESO VEHICULAR DEL ANTEPUERTO.

Hace algunos años, la Empresa Portuaria Arica con el fin de minimizar el impacto vial que producen sus opera-ciones a la ciudad de Arica, está desarrollando el proyecto “Antepuerto” el cual se materializa en un recinto de estacionamiento de camiones Bolivianos con carga de exportación que con destino al Puerto de Arica y así des-congestionar la ciudad y liberar las áreas de respaldo al interior del Terminal, todo esto a través de una inversión pública de US$ 3,0MM. Esta reciento está compuesto por 216 calzos día, que contribuyen a descongestionar las calles de la ciudad que se ven afectadas con la llegada masiva de los camiones y el estacionamiento en ellas por largas horas.

A través de este proyecto, comienzan a aparecer otros requerimientos, uno de ellos fue la necesidad de desarrollar una herramienta para el personal de seguridad que controle el acceso vehicular desde y hacia el recinto, permitien-do así mejorar la gestión de la administración, planificación de faenas y proveer una importante fuente de análisis para la toma de decisiones y futuros proyectos.

Mi trabajo fue desarrollar una aplicación que cumpla con las siguientes características:

• Acceso controlado.• Jerarquía de privilegios.• Procesamiento de ingreso y salida de camiones.• Impresión y reimpresión de comprobantes.• Consulta y gestión del inventario actual en tiempo real.• Consulta del registro de actividad en tiempo real.• Reportabilidad según métricas definidas por los usuarios según: - Ingreso de camiones - Salida de camiones - Camiones en inventario - Camiones según tipo de MIC - Camiones según tipo de bulto - Camiones según tipo de mercancía - Registro de Camiones

• Gestión de usuarios.• Log de auditoría.• Log de envío y recepción de datos.

Junto a las características anteriores se adiciona una versión móvil la cual permita a los guardias de seguridad poder controlar el acceso de forma remota.

Como producto de este requerimiento se desarrolló una aplicación que cumple con todas las características solici-tadas la cual está actualmente operativa en el recinto la cual ha tenido un fuerte impacto en el modo de operación del Antepuerto, siendo la principal fuente de información para la toma de desiciones y análisis de posibles alter-nativas de crecimiento.

La aplicación cliente de escritorio está construída en HTML5 utilizando Bootstrap y AngularJS. La aplicación móvil está construída en Ionic framework y cordova. La aplicación backend está construída en PHP + MySQL.

Fig. 9 Interface de la aplicación de escritorio.

Fig. 10 Interface de la aplicación móvil.

Fig. 11 Personal de seguridad utilizando la aplicación.

Fig. 12 Personal de seguridad utilizando la aplicación.

DISEÑO DE LOS BANNERS INSTITUCIONALES UTILIZADOS EN LOS PRINCIPALES MEDIOS DE DIFUSIÓN REGIONAL

Empresa Portuaria Arica, en su afán de conectar con la región, desea estar siempre presente en los medios de difusión más relevantes de la zona. Es por eso que surgió la necesidad de elaborar nuevos banners animados ins-titucionales que permitan a la empresa posicionarse a través dentro de dichos sitios web. Junto con lo anterior, se aprovecha la instancia para comunicar sobre el seminario a realizar a finales de este año.

Fig. 13 Banner “el ariqueño” 250x300px

Fig. 14 Banner “Arica al día” 300x250px

Fig. 15 Banner “El morrocotudo” 400x60px

Fig. 16 Banner “Chasquis” 158x153px

DISEÑO Y PRODUCCIÓN DE CREDENCIALES DE ACCESO PARA TODO EL PERSONAL DE LA EMPRESA

A finales del año 2014, Empresa Portuaria Arica realizó un cambio de imagen corporativa con lo cual se redefi-nió toda la gráfica utilizada por la Compañía. Durante este año, surgió la necesidad de confeccionar las nuevas credenciales de la Empresa que permitan a los funcionarios identificarse y individualizarse dentro de los dife-rentes puntos de control de las instalaciones del terminal portuario a través de un código de barras ubicado en la parte posterior al documento.

EMPRESA PORTUARIA ARICAMáximo Lira 389, Arica - ChileFonos: (+5658) 2 202080 - (+5658) 2 202092http://puertoarica.cl

TARJETA DE IDENTIFICACIÓN

7.139.426-3Gerente General

IVÁN SILVA FOCACCI

O - IV negativo

EMPRESA PORTUARIA ARICAMáximo Lira 389, Arica - ChileFonos: (+5658) 2 202080 - (+5658) 2 202092http://puertoarica.cl

TARJETA DE IDENTIFICACIÓN

12.833.061-5Asistente Legal

CLAUDIA CASTROPAYAUNA

O - IV Positivo

EMPRESA PORTUARIA ARICAMáximo Lira 389, Arica - ChileFonos: (+5658) 2 202080 - (+5658) 2 202092http://puertoarica.cl

TARJETA DE IDENTIFICACIÓN

7.398.951-5Gerente Desarrollo y Negocios

MARIO MOYAMONTENEGRO

O - IV Positivo

EMPRESA PORTUARIA ARICAMáximo Lira 389, Arica - ChileFonos: (+5658) 2 202080 - (+5658) 2 202092http://puertoarica.cl

TARJETA DE IDENTIFICACIÓN

8.845.501-0Gerente de Concesiones y

Sustentabilidad

RICARDO CÓRDOVA MARINAO

Fig. 17 Red de construcción de credencial

Fig. 19 Producto finalFig. 18 Diseños

MOTION GRAPHICS PARA DIFUNDIR LA MISIÓN, VISIÓN Y VALORES CORPORATIVOS DE LA EMPRESA

Empresa Portuaria Arica, como resultado del proceso de actualización de la gráfica institucional observó la necesidad de actualizar todos sus videos institucionales. Uno de los videos afectado fue la presentación de los valores corporativos, el cual se proyecta en las dependencias del Puerto de Arica y tiene como objetivo informar a las partes interesadas la Misión, Visión y Valores Corporativos de Empresa Portuaria Arica.

Para satisfacer la necesidad anterior, en una primeria instancia se elaboró un guión el cual fue validado por la Gerencia General de la Empresa, para luego proceder con la composición gráfica utilizando la técnica Motion Graphics sobre After Effects.

A continuación se adjuntan snapshots del material producido.

Fig. 20 Snapshots

MONTAJE 3D PARADA DE BUS ACERCAMIENTO ANTEPUERTO

Para la habilitación del Antepuerto, se implementó un bus de acercamiento gratuito para trasladar a los usuarios desde y hacia el extraportuario. Debido a eso, se requirió simular la parada de dicho transporte para graficar las distintas alternativas.

El montaje se realizó utilizando autodesk Maya.

Fig. 21 Primera alternativa.

Fig. 22 Segunda alternativa. Fig. 23 Tercera alternativa.

PROPUESTA DE REDISEÑO WEB DE LA PÁGINA INSTITUCIONAL

Empresa Portuaria Arica, como resultado del proceso de actualización de la gráfica institucional requiere actua-lizar el sitio web Institucional aplicando la nueva norma gráfica. Se solicito realizar el boceto de la nueva página web. Este montaje se realizó en Adobe Illustrator.

Fig. 24 Boceto landing page, header.

Fig. 25 Boceto landing page footer.

CONCLUSIONES

La práctica Profesional en ambiente laboral como proceso para la finalización de el plan de estudios de un di-señador Multimedia, corresponde al primer peldaño como futuro profesional al estar inserto en un ambiente en donde las situaciones y problemáticas nos exigen aplicar todo lo aprendido durante nuestra carrera. Este peque-ño paso tiene un aporte considerable para finalmente afrontar la vida laboral plenamente.

Durante mi estadía como pasante en Empresa Portuaria Arica observé que el rol de diseñador Multimedia a pe-sar que no está relacionado a la actividad comercial de la compañía, puede ser indirectamente influyente al éxito de ésta ya que las tareas que se realizan tienen un impacto en los proyectos de cualquier índole que requieran ser presentados multimedialmente. Esto quiere decir que el licenciado en Tecnología multimedia tiene un aporte multidiscilpinario lo cual opera de forma transversal a todas las áreas de una empresa en muchos ámbitos tales como la producción de gráficos, videos, presentaciones, montajes y un sin fín de otras aplicaciones.

Sin duda, este proceso nos adentra más en el rol de diseñador, y nos ayuda a tomar las riendas para frontar pro-yectos con todas nuestras competencias y capacidad de innovación.