Unidad 2 - Paso 3 - Diseño orientado a objetos y

componentes - Rúbrica de evaluación y envío de

actividades

JAIDER JAVIER JIMENEZ ROBLES

Universidad Nacional Abierta y a Distancia (UNAD)

Ingeniería de Las Telecomunicaciones
CEAD corozal sucre
 lOMoARcPSD|10815137

INTRODUCCION

Gracias a este trabajo encontramos maneras de hacer interfaces graficas

para luego poder empezar a programar nuestro programa en base de dichas
interfaces
 lOMoARcPSD|10815137

OBJETIVOS

 Realice el análisis y el contenido de la pantalla.

 Realizar patrones de diseñó de la interfaz de usuario
 Realice la interfaz de ayuda del sistema de información con funciones
multimedia.
 lOMoARcPSD|10815137

Análisis y el contenido de la pantalla

Aporte

 Login
 lOMoARcPSD|10815137

 Registro
 lOMoARcPSD|10815137

 Inicio
 lOMoARcPSD|10815137

 Curso
 lOMoARcPSD|10815137

 Correo
 lOMoARcPSD|10815137

 Datos

 Unidades
 lOMoARcPSD|10815137

 Evaluación

 Foro
 lOMoARcPSD|10815137

Aporte

Análisis y el contenido de la pantalla

• Ingresar

Página web

Icono Iniciar sección

Usuario

Clave Recordar datos

Ingresar

Si aún no estas inscrito regístrate es totalmente gratis.

Registrase

Ayuda
 lOMoARcPSD|10815137

• Registro

Página web

Registro
Icono

Tipo de identidad

Numero de identidad

Nombres
Apellidos

Fecha de nacimiento

Correo

Aceptar términos y condiciones

Registrar

Atrás Ayuda
 lOMoARcPSD|10815137

• Inicio

Página web

Bienvenidos a la Uni Foto

Icono
Jean Vizcaino
Página principalNoticiasAyuda PerfilSalir

Promedios de notas
Materia””””

Materia””””
Materia””””

Materia””””

Materia”””” Ingresar
Materia”””” Ingresar
Materia”””” Ingresar
Materia”””” Ingresar
 lOMoARcPSD|10815137

• Curso

Página web ”””” /foro/

Foto
Materia””””
Icono
Jean Vizcaino
Inicio NoticiasAyuda PerfilSalir

Materia””””
Foro
Materia”””” Calificaciones Aula
Foro “””” “””””” “””””””” “”””””” “”””””””
“”””””” “”””””””””””””””””””””
Guías de actividades Instructivo de
“””””””””·
aprendizaje Unidad 1 “””””””””””””””””””””””””””·
Unidad 2 Unidad 3 Debate Comenzado por Ultima
publicación
Desarrollo de Ana luz Jean
Vizcaino actividad
 lOMoARcPSD|10815137

APORTE

Sitio web
 lOMoARcPSD|10815137

Versión móvil
 lOMoARcPSD|10815137

 Inicio
 lOMoARcPSD|10815137

Versión móvil

 Inicio/Estudiantes

Sitio web
 lOMoARcPSD|10815137

Versión móvil
 lOMoARcPSD|10815137

Aporte
 lOMoARcPSD|10815137

INGRESO

REGISTRO
 lOMoARcPSD|10815137

PESTAÑA DE CALIFICACIONES

Patrones de diseño de la interfaz de usuario

 lOMoARcPSD|10815137

Nombre del
elemento:

Login_de_Usuario

Descripción:

Panel para iniciar

sesión en la plataforma

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 14, etiquetas
tipo de letra Arial 12,
letra botones Arial 12

Elementos de
navegación:
Botones “Acceder”,
“Registro”, “Ayuda”,
“Salir”

Nombre del
elemento:

Registro_de_Usuario

Descripción:

Panel para registrar a

usuarios nuevos

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 14, etiquetas
tipo de letra Arial 12,
letra botones Arial 12

Elementos de
navegación:
Botones “Volver”,
“Registro”, “Ayuda”
 lOMoARcPSD|10815137

Nombre del
elemento:

Inicio_Unad

Descripción:

Panel de inicio con

información del usuario

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 16, subtítulos
tipo letra Arial 14,
etiquetas tipo de letra
Arial 12, links tipo legra
arial 12

Elementos de
navegación:
Botones “Unad”,
“Noticias”, “Ayuda”,
“Foros”, “Cuenta”, “Salir”,
“Ingresar”.

Nombre del
elemento:

Usuario_Materia_****
*
Descripción:

Panel para de la
materia seleccionada

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 16, subtítulos
tipo letra Arial 14
etiquetas tipo de letra
Arial 12.

Elementos de
navegación:
Botones “Noticias”,
“Ayuda”, “Foros”,
“Cuenta”, “Salir”,
“Ingrese aquí”, “ingrese
para descargar”.
 lOMoARcPSD|10815137

Nombre del
elemento:

Unad_Panel_Ayuda

Descripción:

Panel de ayuda

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 16, etiquetas
tipo de letra Arial 12.

Elementos de
navegación:
Botones “Introduccion”,
“Problemas comunes”,
“Contactanos”,
“Consultas”

Nombre del
elemento:

Datos_de_Usuario

Descripción:

Panel para Ingresar

datos de los usuarios

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 14, etiquetas
tipo de letra Arial 12,
letra botones Arial 12

Elementos de
navegación:
Botones “Volver”,
“Guardar”, “Ayuda”
 lOMoARcPSD|10815137

Nombre del
elemento:

Materia_de_Unidad

Descripción:

Panel para seleccionar

la unidad requerida

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 14, etiquetas
tipo de letra Arial 12,
letra botones Arial 12

Elementos de
navegación:
Botones “Unad”,
“Noticias”, “Ayuda”,
“Foros”, “Cuenta”, “Salir”,
“Ingresar”.

Nombre del
elemento:

Materia_de_Evaluacion

Descripción:

Panel para entregar

documento

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 14, etiquetas
tipo de letra Arial 12,
letra botones Arial 12

Elementos de
navegación:
Botones “Unad”,
“Noticias”, “Ayuda”,
“Foros”, “Cuenta”, “Salir”,
“Ingresar”.
 lOMoARcPSD|10815137

Nombre del
elemento:

Foro_de_Materia

Descripción:

Panel para ingresar a

foros

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 14, etiquetas
tipo de letra Arial 12,
letra botones Arial 12

Elementos de
navegación:
Botones “Unad”,
“Noticias”, “Ayuda”,
“Foros”, “Cuenta”, “Salir”,
“Ingresar”.

Nombre del
elemento:

Correo_de_Usuario

Descripción:

Panel para ver correos

recibidos

Detalles:
Icono en la parte superior
izquierda, títulos Tipo de
letra Arial 14, etiquetas
tipo de letra Arial 12,
letra botones Arial 12

Elementos de
navegación:
Botones “Unad”,
“Noticias”, “Ayuda”,
“Foros”, “Cuenta”, “Salir”,
“Ingresar”.
 lOMoARcPSD|10815137

Patrones de diseño de la interfaz de usuario

Nombre del
elemento:
Registro

Descripción:

Panel para registrarse

y tener acceso a la
plataforma.
Detalles:
Icono en la parte
superior izquierda,
formulario de
registro en la parte
central, título tipo
de letra normal
tamaño 14.
 lOMoARcPSD|10815137

Elementos
de
navegación
: Botones
“eliminar”
“insertar”

Nombre del
elemento:
Inicio

Descripción:

Panel de inicio de
plataforma

Detalles:
Icono en la parte
superior izquierda,
título letra normal
tamaño 15, sub
titulo, icono de
fecha en la parte
superior derecha,
links de acceso en
la parte inferior
izquierda.
Elementos de
navegación:
Botones: “maestros”
“estudiantes”
“certificados”
“administrativos”
“registro y
admisiones”.
 lOMoARcPSD|10815137

Nombre del
elemento:
Inicio/estudiantes

Descripción:

Despues de iniciar
session se debe
escoger el tipo de
usuario para acceder
a los recursos de este,
como el caso del
ejemplo si ingresa el
estudiante, se
desplega su menu.
Detalles:
Icono en la superior
derecho de la
imagen del usuario,
titulo letra tamaño
18, botones de
navegacion en la
parte izquierda,
buzon de noticias en
la parte central,
ubicacion,
calendario y redes
sociales.
Elementos
 lOMoARcPSD|10815137

de
navegación
: Botones
“informaci
on”
“materias”
“calificacio
nes”

Patrones de diseño de la interfaz de usuario

INGRESO
 lOMoARcPSD|10815137

Nombre del elemento:

INGRESO

Descripción:
Esta es la ventana de ingreso de los estudiantes, se coloca el usuario y la contraseña, en
caso de no estar registrado se puede entrar a registrar o en caso de no acordarse de la
contraseña puede recuperarla.
Detalles:
Icono de la universidad en la parte superior izquierda, con dos caja de texto donde se
ingresan los datos del estudiante y tres botones.

Elementos de navegación: Botones “acceder” “olvidastes la contraseña”

“registro”
 lOMoARcPSD|10815137

REGISTRO

Nombre del elemento:

REGISTRO

Descripción:
Esta es la ventana de registro de los estudiantes que aún no lo estén tenemos caja de
texto donde se introduce el nombre, el apellido, nombre de usuario, contraseña y la
fecha de nacimiento del estudiante
Detalles:
Icono de la universidad en la parte superior izquierda, con 4 caja de texto para ingresar
la información del estudiante, 1 en formato fecha y un botón para terminar el registro.

Elementos de navegación: Boton “registrate”

 lOMoARcPSD|10815137

INICIO DEL CURSO

Nombre del elemento:

INICIO DEL CURSO

Descripción:
Esta es la ventana que despliega después de haber entrado al sistema, donde nos
aparecerá el contenido del curso
Detalles:
encontraremos un menú en la parte izquierda para movernos por todo el sistema,
además nos despliega el contenido del curso y en la parte derecha tenemos el
calendario y una parte de noticias, en la parte superior derecha encontramos el botón
para cerrar el login.

Elementos de navegación: Boton “cerrar sección”, “inicio”, “noticias”,

“foro”, “ayuda”, un menú desplegable, videos del curso, calendario y noticias.
 lOMoARcPSD|10815137

PESTAÑA DE MATERIAS

Nombre del elemento:

MATERIAS

Descripción:
Esta es la ventana que despliega cuando necesitamos ver las materias que tenemos
matriculadas en el curso.
Detalles:
encontraremos un menú en la parte izquierda para movernos por todo el sistema,
además se nos despliega el contenido sobre las materias del curso y en la parte derecha
tenemos el calendario y una parte de noticias, en la parte superior derecha
encontramos el botón para cerrar el login.
 lOMoARcPSD|10815137

Elementos de navegación: Boton “cerrar sección”, “inicio”, “noticias”,

“foro”, “ayuda”, un menú desplegable, videos del curso, calendario y noticias.

PESTAÑA DE CALIFICACIONES
 lOMoARcPSD|10815137

Nombre del elemento:

CALIFICACIONES

Descripción:
Esta es la ventana que despliega cuando necesitamos ver las calificaciones del curso.

Detalles:
encontraremos un menú en la parte izquierda para movernos por todo el sistema,
además se nos despliega el contenido sobre las calificaciones del curso y en la parte
derecha tenemos el calendario y una parte de noticias, en la parte superior derecha
encontramos el botón para cerrar el login.

Elementos de navegación: Boton “cerrar sección”, “inicio”, “noticias”,

“foro”, “ayuda”, un menú desplegable, videos del curso, calendario y noticias.
 lOMoARcPSD|10815137

interfaz de ayuda del sistema de información con funciones

multimedia.
 lOMoARcPSD|10815137

CONCLUCION

Se pudo aprender a crear interfases graficas de diferentes formas,

manteniendo modelos los cuales facilitaran a la hora de programar