Analisis sitio web UPLA

De Casiopea


TítuloAnalisis y rediseño sitio web UPLA
Tipo de ProyectoProyecto de Curso
Palabras Clavesitio web universidad
Período2014-2014
AsignaturaConstrucción de Diseño Gráfico 4
Del CursoConstrucción 4º DG 2014
CarrerasDiseño Gráfico
Alumno(s)Javiera Escudero, Mauro Villena
ProfesorKatherine Exss
URLhttp://www.upla.cl/inicio/

La Universidad de Playa Ancha

La Universidad de Playa Ancha es una corporación de derecho público, autónoma, laica, con personalidad jurídica y patrimonio propio, ubicada en la ciudad de Valparaíso, desarrollando actividades en esta ciudad y San Felipe. Realiza su misión en los ámbitos propios de su competencia de conformidad con su Plan de Desarrollo Estratégico Institucional, en formación de postgrado, profesionales y técnicos de nivel universitario, la investigación y vinculación con el medio, comprometida con el desarrollo social, económico y cultural de la región de Valparaíso y el país.


Mapa de Navegacion

Archivo:Mapa de navegación UPLA1.pdf

Card Sorting

El objetivo principal de la técnica del Card Sorting (Ordenación de tarjetas) es generar un árbol de categorías del sitio web que estamos analisando. Se le pide a los usuarios que las ordenen en grupos que tengan algún sentido para ellos y etiqueten o pongan nombre a estos grupos.



Para poder ver de mejor manera el proceso del Card Sorting quisimos hacer un video que muestra la interaccion de las personas con los contenidos que se fueron mostrando


Observacion

1. Se observo que a ratos resultaba confuso el orden de los contenidos ya que algunos se desconocia su significado ademas de la gran cantidad de contenidos que debian ordenar.

2. Gran parte de los conceptos fuerone eliminados por los participantes ya que consideraban que no aportaban en nada al sitio web.

3. Se solia confundir conceptos como "Acreditacion" con los beneficios o modalidades de pago que pueda entregar la Universidad a sus alumnos.

4. Al finalizar la Actividad nos dimos cuenta que en los grupos que habian propuesto habia una mezcla de conceptos y en algunos no existia una buena jerarquizacion.

Resultado del Card Sorting

De 131 trajetas, 25 fueron no agrupadas

  • Home
    • Acreditación
    • Admisión
    • Rectoría
    • Nuestra universidad
      • Vías de admisión
      • Nosotros
      • Video promocional
      • Programa
      • Nuestra misión
      • Universidad y transparencia
      • Conócenos
    • Estados financieros
    • Contacto
    • Carreras
  • Postulaciones online
    • Calendario académico 2014
    • Admisión especial
    • Acceso a convenio UPLA
    • Principales oficinas
  • Egresados
    • Nuevo egresado
    • Ceremonias
    • Unidad de mejoramiento docente
  • Vínculos e intercambios
    • Portal de acceso
    • Acciones
    • Relaciones internacionales
    • Acreditación de carreras
    • Convenios
    • Aranceles y créditos
    • Acreditación institucional
  • Becas y créditos
    • Beneficios
    • Becas Concursos Pasantías
  • Recursos en línea
    • Adquisición bibliográfica
    • Calendario académico
    • Biblioteca
    • Verificación de certificados
    • E - Aula
    • Portal del estudiante
    • Activar cuenta
    • Correo del estudiante
    • Correo institucional
    • Educación virtual
    • Biblioteca virtual
  • Pregrado
    • Pregrado campus Valparaíso
    • Posgrado primer semestre
    • Vice rectoría administración
    • Coordinadores de pregrado
    • Programa Postgrado
    • Investgación y postgrado
    • Carreras profesionales
    • Escuela postgrado
    • Carreras vespertinas
    • Programa postgrado
    • Facultades y departamentos
    • Cursos y carreras
    • Equipo
    • Titulación y graduación
    • Carreras técnicas
    • Campus San Felipe
    • Dirección general de postgrado
    • Docencia de pregrado
    • Directorio Campus San Felipe
    • Doctorado
    • El Campus
    • Centro de estudios avanzados
    • Estudios innovación curricular y desarrollo docente
    • Postgrado primer semestre
    • Diplomados y post-título
    • Magister
    • Pregrado campus San Felipe
    • Títulos y grados
  • Extras
    • Actas del consejo
    • Emplazamiento
    • Servicios
    • Gestión institucional
    • Organigrama
    • Filosofía corporativa
    • Objetivos
    • Espacios universitarios
    • Experiencia
    • Junta directiva
    • Coordinadores docentes
    • Vice rectoría académica
    • Personal
    • Planificación, desarrollo y calidad
    • Reseña histórica
    • Vice rectoría de investigación

Nuevo Mapa de Navegacion

Al ver el resultado y la observacion del Card Sorting se penso en la nueva propuesta de navegacion del sitio web con una reduccion considerable del contenido y una nueva propuesta de jerarquisacion.


Maurovillena191008201401.jpg


Rediseño sitio web UPLA

Arquitectura de la informacion

La Arquitectura de la Informacion la utilizamos para organizar, disponer, estructurar y jerarquizar la información. Es un proceso transversal, que se da a lo largo de todo el diseño del sitio para asegurarse de que los objetivos de su producción y del desarrollo de la interfaz se cumplan de manera efectiva.

Para poder rediseñar la interfaz del sitio web de la UPLA fue necesario realizar el suguiente Mapa que permitiera a los Usuarios poder encontrar mejor los contenidos.

Archivo:Mapa de navegación finale66666666.jpg
Orden y jerarquizacion de contenidos para le rediseño del sitio web

Wireframes

Los wireframes son guias visuales que representa la estructura de un sitio web. El wireframe esquematiza el diseño de página y ordenamiento del contenido, incluyendo elementos de la interfaz y sistemas de navegación pa ver en relacion y saber como funcionan en conjunto.

A continuacion se presentan las distintas propuestas de Wireframes de las secciones que se escogieron para rediseñar, estas son.

  • Home
  • Admision
  • Biblioteca
  • Carreras pagina de Inicio
  • Carreras pagina Interior

Home


Admision


Carreras pagina Inicio


Carreras pagina Interior

Biblioteca

Rediseño de Interfaz

Datos Tecnicos

El rediseño de interfaz del sitio web es la ultima etapa de este proceso, es el diseño visual de una reorganizacion de contenidos y la propuesta grafica a esta nueva disposicion de los contenidos. En el caso del sitio de la Universidad de Playa Ancha se modifico gran parte de los elementos graficos, ya sea, paleta de colores, tipografica, titulos, imagenes, etc.

Paleta de colores

La Paleta de colores se escogio segun los colores del logotipo de la Universidad, en base a esto se escogieron los demas colores.

Logo upla color.jpg

Los colores usados fueron 5 los cuales se repiten en la Home tanto como en las demas paginas rediseñadas.

  • Blanco: #FFFFFF
  • Gris: #DDDDDD
  • Azul claro: #0099CC
  • Azul oscuro: #0079A2
  • Negro: #000000
Paleta de colores para el rediseño del sitio web UPLA.

Tipografia

Proponemos tambien una nueva Familia tipografica para el sitio web, la utilizada para el rediseño es Titillium

Familia tipografica Titillium

En sus expresiones Regular, Book y Semi Bold

Book BOOK.png Regular REGULAR.png

Semi bold Semibold.png


Jerarquias de Titulo y texto

Dentro de las pasginas escogidas se puede apreciar los distintos tips de Titulos que existen y los distintos textos

Tamaños de titulos y texto utilizados

Titulos h1: 40 pt

Titulos h2: 24 pt

Titulos h3: 20 pt

Titulos h4: 16 pt

Texto 1: 15 pt

Texto 2: 14 pt

Texto 3: 13 pt

Iconografia

Para poder mostrar la categoria de Servicios en Linea decidimos hacer iconos para representar cada seccion, estas son Biblioteca, E-Aula, Portal de Estudiante y Portal del Egresado.


Diseño de Interfaz

Despues de la eleccion de la paleta de colore y de Tipografia, la interfaz de la Home y del resto de las paginas empezaron a tomar forma y caracter grafico para terminar su estapa visual.


Home


Admision

Biblioteca


Carreras Inicio


Carreras Interior