C # 1 Introduccin al Diseo.

Objetivo.
Conocer el propsito del diseo.
Encaminar principios bsicos hacia una
lgica de conocimientos que ayuden a
relacionar la teora con la prctica del
diseo, para los siguientes temas a
estudiar.
Saber interpretar las diferentes etapas de
procesos del diseo para poder hacer uso
de ellos.
Conocer el rol del diseador y las
herramientas conceptuales con las que
trabaja.

Contenido.

Introduccin al Diseo.
Diseo de Sistemas Informticos.
Diseo en la WEB.
Conclusiones.
Ejercicios/Estudio Independiente.
Orientacin para la Prctica a presentar
Orientacin para el Laboratorio.

Bibliografa.

Texto Diseo de Sistemas 2/2012.

Tema 1, Introduccin al Diseo.

Fondo de Tiempo.
Clase

Semana 1

Total

Conferencia

1- 2Hr

2Hr

CP

1- 1Hr

1Hr

Laboratorio

1- 2Hr

2Hr

5Hr

5Hr

Total

Introduccin al Diseo

Introduccin al Diseo.

El diseo, se puede catalogar como una ciencia proyectual.

(imaginar planes, planear).
El diseo entonces es la facultad creadora de proyectar.
Proyectar, es el propsito de hacer algo de forma planificada, pero
el diseo esta destinado a la configuracin de una obra de carcter
formal, a una forma visual, o audiovisual, bidimensional o
tridimensional.
Requiere consideraciones tanto funcionales como estticas. Por los
que se necesita de diferentes tareas, de investigacin, anlisis,
modelado, ajustes, adaptaciones previas a la produccin del objeto.
Comprende multitud de disciplinas y oficios en dependencia de lo
que se disea.
Integra requisitos tcnicos, sociales, econmicos, necesidades
biolgicas, con efectos psicolgicos, forma, color, volumen, espacio,
todo relacionado con el medio ambiente y el mundo en general. De
ah su responsabilidad tica.

Diseo.

El diseo no es slo un adorno.

El diseo es un proceso de creacin visual con un propsito.
El diseo es creativo, crea algo nuevo, da existencia a algo
nuevo, puede asumir, tres formas:

La innovacin.
El descubrimiento.
La intuicin.

Cubre exigencias prcticas.

Su objeto deber ser expuesto a los ojos de un pblico.
Debe transportar un mensaje prefijado.
Debe cubrir necesidades especificas de un consumidor.
Su creacin no es slo esttica, sino tambin funcional,
mientras refleja o gua el gusto de su poca.

Orgenes del Diseo.

Tiene si origen en el cambio social, que sufrieron los

pases industrializados a finales del siglo XIX y
principios del siglo XX.
Est ligado a la economa, mas que al arte y a la
expresin creativa. Surgi y se desarroll en
momentos de auge econmico e industrial.
Tambin naci como rechazo a las transformaciones
radicales que haba trado la revolucin industrial, fue
una ltima esperanza para las actividades ligadas al
artesanado, ya que el artesano realizaba toda la obra
en sus talleres, abarcando una forma mas humana y
simplista, se vio remplazado con la produccin en
serie, para un mercado vido de nuevas ofertas.

Diseo y Arte.

El diseo guarda relacin con el arte.

Ya que emplean un lenguaje familiar, pues utiliza una
sintaxis prestada de las artes plticas, pero su naturaleza
es ms compleja y enteramente vinculado a la actividad
productiva y al comercio.
Se diferencia pues el diseo est determinado a partir de
un proceso de creacin, con el objetivo de cumplir con una
funcin especial o varias, pero el arte es la realizacin de
visiones personales y extrasensoriales de un artista.
El diseador, proyecta el diseo en funcin de un encargo,
ha de pensar tanto en un cliente, en un usuario,
justificando sus propuestas, en cambio el artista es ms
espontneo, y pueden no estar justificadas sus acciones, la
nica semejanza entre diseador y artista es la creatividad.

Propsito del Diseo.

Crear objetos tiles, a las necesidades del

hombre en su hbitat.
En su entorno, tanto social y fsico.
Ya que el hombre, inserto en su medio
ambiente y condicionado por el mismo,
deber satisfacer sus necesidades ya sean
materiales o espirituales, que le plantea ese
mismo medio.

Actualidad del Diseo.

Actualmente se emplea errneamente el

trmino de diseo. Esto se debe a que es un
trmino relativamente nuevo.
Por otro lado a la frivolidad con que se trabaj
en los 80 en nombre del diseo,
superficialidad y falta de seriedad.
En la tv, prensa, discursos polticos, se ve
mucho diseo y poco contenido.

Un Buen Diseo.

Como distinguimos un acto creador?

Cmo establecemos si se logra el fin o no, el
propsito?
Comprendemos el diseo, y formamos nuestras
opiniones por pura intuicin.
En el diseo la comprensin intelectual, no llega muy
lejos, sin el apoyo del sentimiento.
No slo se puede hablar de las cosas, sino tambin
sentirlas.
Hablar de un buen diseo, significa jerarquizarlo
cualitativamente.
Se define como poseedor de determinadas cualidades
funcionales y formales.

Mtodo y Diseo.

Mtodo:
Buena metodologa:

Arma a sus practicantes de un juego de herramientas confiables y

repetibles, que se adecan particularmente bien a los problemas
que se quieren resolver.

Caractersticas de una buena metodologa:

Motivar la actividad pretendida: motivar la toma de decisiones

valuando alternativas.
Ser completa: Que cubra cada aspecto del proyecto a construir
Ser modificable en su correccin: debe ser verificable antes de la
construccin, discutiendo posibles soluciones.
Producir productos en los que se pueda medir su avance: El
producto a construir debe ser mesurable, estimando tiempos y
productos intermedios para poder hacer ajustes.
Ser fcilmente aprovechable en la fase subsiguiente: expresar usos
y resultados de forma muy cercana al resultado pretendido.

Mtodos para el Diseo.

Identificacin
Recopilacin
Sntesis
Gestacin
Iluminacin
Elaboracin
Verificacin.

Aparece

sin esfuerzo.
esclarece
el ende
Se la
Esta
Es
Indeterminado
el
acumulan
etapa
plasmacin
mecanismo
puede
ser
el

Es
un acto de
alegre,
de
objetivo.
informaciones
seleccin,
inconsciente,
concreta
tiempo.
eliminacin,
latener
idea
referentes
concentracin
caractersticas
visual.
y yde
plenitud.

Se la
formula
Es
autoconciencia
de
Se es alentado con la
especficas
depuracin
al
deen
acto
los
premonicin,
correctamente
el la
Construccin
la
adecuacin
de
conviccin
de que se ha
creativo.
elaborados.
datos
problema.de
Imgenes
trminos
propuesta
visuales
ideada al fin
alcanzado la meta

U
Se
traviesan
representacin
planteado.
otras
realiza
factibles
las
en capas
el
de
buscada.
Obliga
desde
el grfica.
brindar
inconciente
consciente
pautas
eejercicio
ode
previo
sobre
el

Baja
principio
altrabajo
de
Implica
un
el estado
ansiedad
tema
esfuerzo
inconsciente
a tratar.
del
en
formas
que
acompaa
a
todas
las
la imaginacin
intensivo,
meticuloso,
preconsciente.
desordenadas
actividades
creadora. precedentes.
constructivo
y al
La
principio
hasta
llegar a
creatividad
e ideas
representativo
aparecen
cuando menos lo
la solucin.
esperamos.

Diseo de Sistemas.
Planificar
Proceso

Sistema

Remplazar
Complementar

Mejor Forma

Conceptos Bsicos.
Diseo
Elementos a Disear
Importancia del Diseo

Elementos a Disear.

Interfaz.

Entradas al Sistema.

Salidas
Seguridad
Almacenes
Ayuda.
Mensajes
Iconos, Enlaces

Datos, Procedimientos, Clases,

Estructura del Sistema

Controles

Error!!
Escriba un
numero

Importancia del Diseo.

La importancia del diseo es que en

l se decide si el SOFTWARE tendr
o no ALTA CALIDAD.
En el diseo se sienta la calidad del
software.
Es la forma en que se puede expresar
los requerimientos del usuario en un
software o producto acabado y de
buena calidad.

Objetivos del Diseo.

Servir de apoyo a las Actividades de la Empresa.
Debe cumplir los requerimientos del Usuario.
Sistema Fcil de utilizar

Objetivos del Diseo.

Scenario
Scenario
Que
cumpla con
Diagrams
LosDiagrams
requisitos del
usuario

Use Case
Use Case
Servir
de Apoyo
Diagrams
A Diagrams
las actividades
De la empresa

Scenario
Scenario
Diagrams
Diagrams
Fcil
de utilizar
Objetivos
Scenario
Scenario
Diagrams
Diagrams
Especificar
Scenario
Scenarioa los
Ajustarse
Diagrams
Diagrams de
Estandares
Diseo

Variables del Diseo

Organizacin del Espacio Disponible
Sensaciones que se quieren transmitir
Color

Espacio Disponible.
Sensaciones.
De Comodidad.
Relajacin.
Felicidad y Alegra.
Motivacin.
Etc.

Espacio

Espacio.

Colores.

Qu es color?. Color es la sensacin

resultante de la estimulacin de la retina del
ojo por ondas lumnicas.
Estn presentes en la naturaleza, en las
formas, en los objetos.
Brindan volumen, profundidad y personalidad.
La forma de elegir un color, de mezclarlo, de
combinarlo o contrastarlo para conseguir el
mejor efecto influye sobre el resultado final.

Texturas.

La manera de coordinar las texturas y los

dibujos influyen directamente sobre el
resultado final.
Rugoso, liso, etc.

Formatos de Letras.

Actualmente para nuestros diseos,

disponemos de muchos tipos y tamaos de
letras.
Podemos decir, que algunas son con estilos
rectos y duros otras tiene estilos suaves y
ondulados.
Existiendo una gran variedad dentro de cada
uno de ellos.
La seleccin del tipo de letra y tamaos y
estilos, es parte tambin del diseo.

Objetos

Imgenes/Dibujos.
Marcos.
Textos.

Cuadros de Texto/Seleccin

Botones.
Barras.
Separadores.
Iconos.
Etc.

Nombre: Chary
Raza:

otro

Diseo Ergonmico.

Introduccin a Ergonoma.

Los usuarios pueden quedar satisfechos no con

un sistema.
Si el diseador no visualiz lo que sera sentarse
todo el da frente al sistema en la computadora
puede suceder que no estar satisfecho.
Por lo que la influencia de la estacin de trabajo, el
uso continuo, el confort, y la satisfaccin debe ser
analizada de forma integral al disear su Sistema.
Muchas veces el espacio de trabajo y sus cambios
no estn al alcance del diseador, pero an as
deber hacer lo posible por lograr cambios que
mejoren evidentemente la situacin del usuario.

Aspectos de ergonoma a considerar.

Color del espacio de trabajo.

Iluminacin.
Pantallas.
Teclado.
Escritorios de Computadora.
Asientos de los Usuarios.

Metodologa

Metodologa.
Son un conjunto de tcnicas, modelos,
herramientas que hacen posible el
desarrollo de un proceso, definiendo sus
fases y reglas.
En ella se establecen los pasos y las
actividades de cada uno de ellos.
Existen muchas metodologas que se
pueden utilizar en el desarrollo de software,
desde las que cubren el anlisis y diseo
estructurado, hasta las que utilizan la
metodologa orientada a objetos.

32

Ing. Rosa Almaraz

Enfoques Utilizados.
Estructurado
Orientado a Objetos

Estructurado.

Se enfoca en la obtencin de especificacin

del software, utilizando representaciones
grficas.
Es una tcnica especfica para el diseo de
programas, la herramienta fundamental
grafica utilizada es el Diagrama
Estructurado, que se enfoca a obtener
mdulos independientes y representan la
interaccin entre ellos.
Toda esta especificacin se da a los
programadores antes de que ellos
comiencen con la codificacin del sistema.

Orientado a Objetos.

El objetivo se enfoca al software de

aplicacin, para llevarlo a la
implementacin.
Utilizando como base la definicin de las
clases para la implementacin, la relacin
de estas clases y su agrupacin.

Estructurado vs OO.

El diseo Estructurado es utilizado bastante actualmente,

pero tambin se hace ms difcil en la medida que los
sistemas se hacen ms complejos.
Los nuevos avances de los lenguajes de programacin
orientados a objetos, facilitan que la metodologa
orientada a objetos sea cada vez ms demandada.
Otro de los aspectos que potencian el uso de tecnologas
orientadas a objetos es la aparicin de UML.
Las herramientas OO, son poderosos instrumentos para
pensar en sistemas complejos.
An siguen en vigencia las tcnicas estructuradas, por lo
que cada uno de ellos, ya sea estructurado u orientado a
objetos puede ser utilizado a la hora de realizar el Diseo
de un Sistema Informtico.

Herramientas Utilizadas
Las herramientas utilizadas en el diseo dependen en gran medida del
enfoque utilizado. Se pueden utilizar tanto herramientas estructuradas
como herramientas orientadas a objetos.

Herramientas Estructuradas.
Diagramas Estructurados de Procesos.
Los Grafos Conversacionales.
Tcnicas de verificacin del diseo.
Gua para el Diseo de Entradas y Salidas.

Herramientas OO.

Use Case
Use Case
Diagrams
Diagramas
Diagrams
de Secuencia

Scenario
Scenario
Diagrams
Diagramas
Diagrams de
Colaboracin

Scenario
Scenario de
Diagramas
Diagrams
Diagrams de
Transicin
Estados

Use Case
Use Case
Diagrams
Diagramas
Diagrams de
Casos de Uso

State
State
Diagrams
Diagramas
Diagrams de
Clase

State
State
Diagrams
Diagramas
Diagrams de
Componentes

Modelos

Component
Component
Diagrams
Diagramas
Diagrams

Diagramas
de Actividades

State
State
Diagrams
Diagramas
Diagrams
de Objeto

de
Implementacin

Repaso Visual Studio .NET

Interfaz de Visual Studio .NET
Uso de Controles en un Formulario

Interfaz de Visual Studio .NET

Creacin de una aplicacin en visual

studio .Net, utilizando visual basic.

Creacin de una Aplicacin Windows.

Cambio del Ttulo del Formulario.
Barra de Herramientas y Controles.
Creacin de un Men Bsico
Insercin de una Barra de herramientas.
Adicionar un nuevo formulario.
Cambiar el fondo del formulario e cono.
Redimensionar el Tamao del Formulario.
Ejecutar otro formulario.

Insercin de Controles en el Formulario.

Control GroupBox Este

muestra
un
Es control
Muestra
El
uncontrol,
control
control
un
datatimepicker,
texto
cuadro,
representa
permite
permite
que
informativo.
permite
donde
visualizar
definir
a un
se
cuadro
de
texto
ytexto.
una
agrupar
En
puede
varias
permite
botn
imgenes.
el caso
de
opciones
introducir
la
otros
pulsacin.
que
seleccin
controles.
compete,
delista
una
se
Control Label
oculta.
tienen
En
autoexcluyentes,
fecha.
Para
el el
caso
etiquetas
caso
deque
que
estudio
compete,
nos
para
es decir,
compete,
de
que
seel
solo
ejemplo
usuario
tienen
se
Para
puede
el varios
acaso
conozca
se
crear
mostrar
seleccionar
tienen
que
cuadros
varios
que
nos
una
dos
debe
compete,
botones
una
imagen.
de de las
Control TextBox vamos
dos
combobox,
groupbox,
escribir
texto,
opciones
vamos
para
trabajar
como
aen
crear
posible.
uno
cada
por
con
un
para
ejemplo,
caja
control
los
Para
datos
de
datos
el
texto,
de
uno
caso
de
uno
para
seleccionar
deCI,
una
personales
como
para
que
este
empleados.
nos
tipo,
escribir
CI,compete,
Apellidos,
para
y el
otro
seleccionar
usuario
para
vamos
Nombres,
a la
Control RadioButton
lista
lade
especialidad
del
agrupar
etc.
otro
introducir
fecha
para
los
ingreso
Apellidos,
como
datos
un
del
laborales.
dato
etc.
empleado
Control Combobox.aempleado
y otro
personal,
la empresa.
el
sexo,para
que solo
seleccionar
el turno o
de trabajo.
podr ser femenino
Control Fechas
masculino.
Botones
Imgenes.

Conclusiones

Conclusiones.
El diseo deja listo todos los elementos
para concretar fsicamente el sistema que
se quiere desarrollar.
Estn claros varios aspectos del diseo,
que estn estandarizados, aspectos que
sern estudiados durante esta asignatura
y que al aplicarlos se puede reconocer
un software de calidad de otro sin calidad.
Se puede afrontar utilizando tcnicas
estructuradas u orientadas a objetos.
Seguir los objetivos del diseo, en cada
uno de sus diseos le permitir crear
software de calidad.

Tarea o Estudio Independiente

Estudio Independiente.

Qu es el Diseo.
Cules son las tres actividades tcnicas para
el desarrollo de un software.
Cules son los Objetivos del Diseo?
Cules son las Variables del Diseo?
Cules son los objetos que Disean?

Preparacin para el laboratorio.

Actividad Prctica para Laboratorio

Tomando en cuenta que usted ya conoce Visual
Studio .NET y C Sharp:
Ponga un ejemplo prctico de cada uno de los
controles resumidos en esta conferencia e
interfaz de Visual Studio .NET (diapositivas 64
y 65).
Presentar en documento impreso y
computadora explicando.
Hgalo utilizando imgenes y explicando las
mismas
Se evaluar claridad de explicacin y
veracidad en los planteamientos y habilidad
49
Ing. Rosa
Almaraz
del uso de visual studio
.NET.

Actividad Prctica Tema 1.

Introduccin
.

Actividad Prctica.

Presentar un anlisis terico donde explique la

relacin entre el diseo y el arte, y sus diferencias.
Hgalo en dos planas como mnimo.
Puede utilizar cuadros comparativos, grficos,
etc., si as lo cree conveniente. Puede usar
imgenes y explicar cada una de ellas.
Se evaluar claridad de explicacin y veracidad
en los planteamientos.
Presentar el da Mircoles 28 de agosto hasta
horas 18:00. Los estudiantes que presenten en
clases es a las 11 de la maana el mircoles, en
formato digital y papel impreso. Los que enven
por internet solamente presentarn en formato
51
Ing. Rosa Almaraz
digital.