Portafolio

Revista Fan-Art – Diseño Web

Revista Fan-Art nace como un proyecto para la publicación de mangas escritos y dibujados por autores peruanos
profesionales y amateurs que buscaban una vitrina donde poder mostrar sus trabajos al público peruano. Para el sitio web se decidió agregar noticias y notas relacionadas al manga, anime, comic y animación

Los mangas tenían una sección dedicada a ellos donde podías escoger las historias y capítulos que querías leer. Cada historia se actualizaba página por página. Las ediciones de Revista Fan-Art que salieron entre el 2006 y el 2008 tambien fueron publicados en el sitio utilizando el servicio de Issuu para la visualizacion de las revistas.

También se incluiyó una sección de noticias y artículos relacionados al comic, manga, anime, videojuegos cine y televisión que fueran del interés de los lectores.

web-revistafanart-720px

Proceso de rediseño

Primero se realizó un benchmarking para ver como funcionaban algunas páginas, tomando como referencia 1Up para las noticias y Dark Horse para los mangas. Luego se trabajaron los mockups de las pantallas y el flujo para cada caso (Noticias, Mangas, Videos, Revistas) para construir la estructura del sitio y sus páginas. Sobre eso, se construye la gráfica final aplicando los formatos de las imágenes y colores de acuerdo a la marca.

Una vez terminado el sitio a nivel gráfico se empieza el trabajo de Front-End, usando JQuery y JavaScript para algunos elementos como sliders, menus desplegables o visores. Ya terminada todas las páginas base, comenzamos a hacer secciones o módulos por medio de PHP para poder reutilizar elementos (Como el Header o el Footer) y así no usar demasiadas líneas de código en el desarrollo. También se trabajó un archivo XML el cual contenía la información de cada entrada y mediante un script se accedía dinámicamente a esta información. Así se evitaba el tener que actualizar manualmente cada pantalla.

Producto: Revista Fan-Art

Trabajo: Rediseño de sitio web

Cliente/Empleador: Revista Fan-Art
Año: 2012
Herramientas: Adobe Fireworks, Adobe Photoshop, HTML5, PHP