fmotrel web

Desarrollo Tecnologías FrontEnd

Portafolio En Cliente

Telefónica

Griffin 3
Descripción del Proyecto

Maquetación de "Griffin 3", herramienta financiera para la gestión contable de Telefónica, basada en guia de estilos aprobada y suministrada por la empresa en diferentes PowerPoint.

Implementación de la estructura con HTML5 y Bootstrap. Capa de presentación con CSS3 y Flexbox. Funcionalidad elementos de la Interface con JavaScript y Jquery. Cross browser multinavegador.

Optimización de código con SonarQube y W3C.

Entorno de maquetación java - jsp - spring con Spring Tool Suite (STS) ó Intellij. Ocasionalmente prueba en entorno .Net con Visual Studio con datos existentes de Griffin 2.

Diseñado únicamente para Portatiles y Dispositivos de Mesa por petición expresa del Cliente con resoluciones superiores a 1180px.

Git y GitKraken para el Control de Versiones. Gitlab como repositorio y Trello para resolución de incidencias.

Tecnologías Usadas
  • Git, GitKraken, SonarQube, Trello, Skype, Team.
  • HTML5, CSS3, Responsive Web Design, Bootstrap, Flexbox, Cross Browser.
  • JavaScript, Jquery.
  • Photoshop, Guía Estilos, PowerPoint.
  • Editor de Texto: Atom, Notepad ++.
  • IDE: Spring Tool Suite (STS), IntelliJ, Visual Studio.
  • Entornos Maquetación: Java - Jsp - Spring (principal) y .Net (ocasional).
  • Sistema Operativo: Windows 10.
Año 2019 - 2021

Prisa

Radios Habladas Latam
Descripción del Proyecto

Maquetación de "Radios Habladas" del Grupo Prisa para Latinoamérica (Caracol Radio, WRadio México y Colombia, ADNRadio, RadioPanamá ...) con sus respectivos Players Permanentes implementando diseños en Sketch a traves de Zeplin e Invision.

Implementación de la estructura con HTML5 y capa de presentación con CSS3 y Flexbox. Funcionalidad de los elementos de la interface con Jquery y JavaScript. Sliders, Modals y Datepicker con Jquery UI.

Menú de navegación y Aside publicitarios con Efecto Sticky. Nomenclatura con prefijo (rh-) distintivo de las clases Css utilizadas.

Extracción de imágenes y posterior optimización de las mismas. Creación de Iconos Svg.

Maquetación multidispositivo (Responsive Web Design) y multinavegador (Cross Browser).

Tecnologías Usadas
  • Git, Jira, Bitbucket, Atlassian.
  • HTML5, CSS3, Responsive Web Design, Sass, Flexbox, Cross Browser.
  • Php, JavaScript, Jquery, Jquery UI.
  • Zeplin (Sketch), Invision, Gimp.
  • Editor de Texto: Atom.
  • IDE: Xampp.
  • Sistema Operativo: Ubuntu.
Año 2018
Migración de Mediateca
Descripción del Proyecto

Maquetación de contenidos en la "Migración de Mediateca" del Grupo Prisa de Bootstrap Template Material Design a Metronic Bootstrap Admin Theme en entorno con motor de plantillas Twig.

Implementación de la estructura con HTML5 y Bootstrap. Capa de presentación con CSS3 y Flexbox.

Maquetación multidispositivo (Responsive Web Design) y multinavegador (Cross Browser).

Tecnologías Usadas
  • Git, Jira, Atlassian.
  • HTML5, CSS3, Responsive Web Design, Bootstrap, Sass, Flexbox, Cross Browser.
  • Metronic Bootstrap Admin Theme.
  • Php, JavaScript, Jquery.
  • Guía Estilos, PowerPoint.
  • Editor de Texto: Atom, Notepad ++.
  • Tareas Automatizadas: Node (npm), Webpack.
  • Entornos Maquetación: Twig.
  • Sistema Operativo: Windows 10, Ubuntu.
2018
Los40
Descripción del Proyecto

Maquetación, testeo y optimización de "Los40", web de la cadena de radio musical de habla hispana de PRISA Radio. Testeo y optimización web según PageSpeed Insights Google.

Implementación de la estructura con HTML5. Capa de presentación con CSS3, Home y Portadillas con Flexbox. Funcionalidad de los elementos de la interface con Jquery y JavaScript.

Menú de navegación y Aside publicitarios con Efecto Sticky. Nomenclatura con prefijo (los40-) distintivo de las clases Css utilizadas. Limpieza, optimización y reutilización de código Html y Css ya existente.

Extracción de imágenes y posterior optimización de las mismas.

Maquetación multidispositivo (Responsive Web Design) y multinavegador (Cross Browser).

Tecnologías Usadas
  • Jira, Atlassian, PageSpeed Insights Google, Filezilla, VPN.
  • HTML5, CSS3, Responsive Web Design, Flexbox, Cross Browser.
  • Php, JavaScript, Jquery.
  • Photoshop, Archivos Psd.
  • Editor de Texto: Atom.
  • Sistema Operativo: Windows 10.
Año 2017 - 2018
Mediateca
Descripción del Proyecto

Maquetación de "Mediateca", web para la consulta de archivos Multimedia del Grupo Prisa implementando Bootstrap Template Material Design.

Implementación de la estructura con HTML5 y Bootstrap. Capa de presentación con CSS3 y Flexbox.

Maquetación multidispositivo (Responsive Web Design) y multinavegador (Cross Browser).

Tecnologías Usadas
  • Git, Jira, Atlassian.
  • HTML5, CSS3, Responsive Web Design, Bootstrap, Sass, Flexbox, Cross Browser.
  • Bootstrap Template Material Design.
  • Php, JavaScript, Jquery.
  • Guía Estilos, PowerPoint.
  • Editor de Texto: Atom.
  • Sistema Operativo: Windows 10.
Año 2017
Home del proyecto DNI de Google y El País HD
Descripción del Proyecto

Maquetación optimizada de la Home demostrativa del proyecto Digital News Initiative (DNI) de Google y El País HD.

Implementación de la estructura con HTML5 y Bootstrap. Capa de presentación con CSS3.

Maquetación multidispositivo (Responsive Web Design) y multinavegador (Cross Browser).

Tecnologías Usadas
  • HTML5, CSS3, Responsive Web Design, Bootstrap, Flexbox, Cross Browser.
  • Guía Estilos.
  • Editor de Texto: Atom.
  • Sistema Operativo: Windows 10.
Año 2017

Vocento

Regional "El Correo"
Descripción del Proyecto

Maquetación según guía de estilos, en el Departamento de Maquetación de Vocento, de su regional "El Correo".

Implementación de la estructura con HTML5 y Bootstrap. Capa de presentación con CSS3, Flexbox y Sass. Funcionalidad elementos de la interface con JavaScript y Jquery. Maquetación multidispositivo (Responsive Web Design) y multinavegador (Cross Browser).

Nomenclatura con prefijo (voc-) distintivo de las clases Css utilizadas y ordenadas sus propiedades por orden alfabético.

Git para el Control de Versiones, tareas e incidencias con Jira y Bitbucket. Scrum como metodología agil.

Maquetación para la prensa con CMS Méthode en base a mockups en formato Xml y hojas de estilo CSS.

Tecnologías Usadas
  • Scrum, Jira, Git, Bitbucket, Atlassian.
  • HTML5, CSS3, Responsive Web Design, Bootstrap, Sass, Flexbox, Cross Browser.
  • JavaScript, Jquery, Xml, Swiper.
  • Editor de Texto: Atom.
  • Tareas Automatizadas: Node (npm), Webpack.
  • Entornos Maquetación: Handlebars.
  • CMS: Methode.
  • Sistema Operativo: Windows 10.
Año 2017

Wunderman

Microsite StarRessa Cepsa
Descripción del Proyecto

Refuerzo vacacional para la agencia Wunderman, lider en marketing y publicidad, para la maquetación de diferentes Home con sus correspondientes Vistas del Microsite de "StarRessa Cepsa" basada en los estilos y diseños de diferentes Psd aprobados y suministrados por la empresa.

Implementación de la estructura con HTML5. Capa de presentación con CSS3. Funcionalidad elementos de la Interface con JavaScript y Jquery. Cross browser multinavegador

Tecnologías Usadas
  • Microsite, HTML5, CSS3, Cross Browser.
  • JavaScript, Jquery.
  • Photoshop, Dreamweaver, Archivos Psd.
  • Sistema Operativo: Windows 7.
Año 2016

Bankia

Operativas transaccionales (Posición Global, Recibos e Impuestos, Seguros) y Libro Rojo de la Empresa
Descripción del Proyecto

Colaboración en "Bankia" como maquetador web de GFT Group para la nueva etapa tecnológica de la entidad bancaria con Arquetipo Web basado en un estudio de los frameworks más potentes del mercado.

Maquetación de varias Operativas transaccionales y Libro Rojo de la Empresa (Guía de Estilos) en base a los estilos de Bootstrap adaptándolos a la Guía de Diseño suministrada por la Empresa teniendo en cuenta la experiencia de usuario (UX).

Estructura basada en HTML5 y Bootstrap, tareas automatizadas con Gulp y dependencias con Bower, código reutilizable y escalable con Jade, Sass y la tecnología BEM. Maquetación de Componentes (HTML5 y CSS3). Multidispositivo (Responsive Web Design), multinavegador (Cross Browser) y Multilenguaje (literales Json).

Git para el Control de Versiones y Github como repositorio para la operatividad de los diferentes grupos de trabajo asignados al proyecto.

Tecnologías Usadas
  • Scrum, Jira, Atlassian, Git, Github.
  • HTML5, CSS3, Responsive Web Design, Bootstrap, Sass, Jade, Tecnología BEM, Cross Browser.
  • Json, Font Awesome Icons, Guía de Estilos.
  • Editor de Texto: Atom.
  • Tareas Automatizadas: Node (npm), Gulp, Bower.
  • Entornos Maquetación: AngularJs.
  • Sistema Operativo: Windows 8.1.
Año 2016

Últimos Trabajos

Usamos cookies propias y de terceros para ayudarte en tu navegación. Si continuas navegando consideramos que aceptas el uso de cookies. OK
Más información
www.000webhost.com