Institución: I.S.F.T.

nº 12, La Plata
Carrera: Tecnicatura Superior en Desarrollo de Software
Asignatura: Diseño Web
Curso: 2º, ciclo lectivo 2022
Profesor: Lic. Emilio Riviere (emichix@gmail.com)

Diseño Web
Proyecto de Cátedra

Fundamentación

Considerando la educación técnica como pieza fundamental para el desarrollo de los

sujetos en el plano cultural, político y pedagógico; como medio de inclusión social tanto
personal como profesionalmente, se comprende el énfasis en la innovación de los
contenidos multimedia en las tecnicaturas de nivel superior de la Rca. Argentina. La
importancia de dichas implementaciones se aprecia no sólo en la producción de medios
y tecnologías sino en una amplia gama de actividades económicas y culturales, de
alcance nacional e internacional.

Es por este motivo que la Tecnicatura Superior en Desarrollo de Software cumple un rol
central en la enseñanza de categorías y metodologías en el área de tecnologías de la
información, y se vincula estrechamente tanto con la producción económica-cultural,
como la investigación científica de nuestro país; promoviendo la autosustentabilidad y la
inserción de los estudiantes en un entorno profesional de vanguardia.

Atendiendo a que la producción de contenidos digitales en la actualidad se genera y

distribuye principalmente a través de internet, y que las funcionalidades de dichos
contenidos se ven aumentadas por la interconexión de dispositivos electrónicos, este
1
proyecto considera que la materia Diseño Web debe proporcionar a las y los
estudiantes, una formación teórico-práctica integradora que les permita comprender,
diseñar y desarrollar una gama completa de elementos web enteramente funcionales.

Esta concepción pedagógica implica abordar la materia de forma gradual, situada en las
realidades socioculturales de los estudiantes, para llegar a objetivos concretables, a
través de un seguimiento de los trabajos prácticos, la participación en clase, las
presentaciones, y las instancias evaluativas.

Es en base a estas consideraciones, que el presente proyecto pedagógico se centra en la

enseñanza de prácticas y concepciones pertinentes al área de estudio, organizadas a
través de actividades participativas, interdisciplinarias y aplicativas; entendidas como un
proceso dialéctico de co-creación y descubrimiento del conocimiento en el espacio
áulico.

Competencias educativas y expectativas de logro

Este proyecto considera como principales objetivos, crear un espacio áulico de

interacción y crecimiento educativo grupal, proporcionar herramientas de aprendizaje de
contenidos inherentes al desarrollo de sitios web, y alcanzar las siguientes competencias
educativas específicas de la materia:

 Capacidad de uso de software y hardware aplicado a la creación y mantenimiento

de sitios web escalables en plataformas de pc y móviles.
 Análisis e implementación de teorías y convenciones de Diseño y Usabilidad, para
una interacción efectiva y centrada en el usuario.
 Versatilidad en la comprensión y uso de diversos lenguajes de programación
vinculados a aplicaciones web.
 Reconocimiento de necesidades principales del producto a desarrollar.
 Capacidad de llevar a cabo las etapas de planeamiento, diseño, producción y
testeo de sitios web sus aplicaciones integradas.
 Competencia en la manipulación y edición de contenidos multimedia embebibles
en la web: imágenes, video, sonido y 3D.

2
Bloques Temáticos

Bloque 1 - Planeamientos, Maquetación y Configuraciones iniciales

Contenidos: Planteos iniciales para el diseño web. Hojas de ruta. Identificación de
objetivos y armado de cronogramas. Estilos de Diseño. Conceptos de usabilidad,
funcionalidad y experiencia del usuario.

Bloque 2 - Prototipado de sitios y Estructuras de información

Contenidos: Introducción al Software de diseño Web. Características de los Programas.
Herramientas y funcionalidades. Creación de prototipos implementando conceptos de
Diseño. Estructura de árbol de un sitio web. Vínculos. Navegación. Marcadores.

Bloque 3 - Instancia de Desarrollo primario

Contenidos: Hojas de estilo CSS. Diseño por capas. Lenguaje HTML. Encabezados,
tablas y divs. Formularios, etiquetas y controles HTML. Adición de contenido multimedia
a las páginas (Imágenes, Video, Sonido y 3D). Vista previa de la página en un navegador
y escalabilidad a dispositivos móviles.

Bloque 4 - Instancia de Desarrollo avanzado y Scripting

Contenidos: JavaScript y TypeScript. Frameworks y Librerías. Cuadros de diálogo y
menus. Método de acceso a datos y bases de datos. Elementos de programación:
variables, arreglos, objetos, funciones. Modelo de Objetos del Documento (DOM).
Nodos: manipulación, recorrido y eventos. Intercambio de datos: formato JSON y
lenguaje XML.

Bloque 5 - Servidores, Testing y Publicación

Contenidos: Servidores gratuitos y pagos. Esquemas de sustentabilidad y rentabilidad
de sitios. Configuración de servidores web y hardware físico. Almacenamiento en la
nube. Certificados de conexión de capa segura (SSL). Instalación y configuración de
servidores. Publicación de sitios.
Organización del tiempo
3
Se prevén 13 clases de 2 módulos para el primer cuatrimestre y 16 clases de 2 módulos
para el segundo, con un 10% de contingencias. El siguiente esquema se plantea en base
a los diferentes niveles de complejidad y tiempos de desarrollo de cada bloque temático.

 1 Clase: Introducción a la materia. Presentación del cronograma general.

 2 Clases: Bloque temático 1
 3 Clases: Bloque temático 2
 5 Clases: Bloque temático 3
 2 Clases: Evaluaciones parciales e instancias recuperatorias

 9 Clases: Bloque temático 4

 4 Clases: Bloque temático 5
 2 Clases: Evaluaciones parciales e instancias recuperatorias
 1 Clase: Cierre de la materia. Devolución y consideraciones finales.

Intervención Didáctica (Actividades del docente)

En base al carácter predominantemente práctico de la materia, pero atendiendo

asimismo al marco de categorías teóricas que enriquecen las estrategias de diseño, la
intervención docente consistirá en:

 Presentación de la cátedra a los y las estudiantes, con claridad y desde una

perspectiva de crecimiento compartido.
 Exposición de categorías y procedimientos principales, acompañados por material
videográfico e interactivo.
 Desarrollo y revisión de los conceptos que puedan generar especial complejidad
en la comprensión de los y las estudiantes.
 Presentación de material bibliográfico, visual, audiovisual pertinente.
 Confección de guías de lectura, síntesis y esquemas conceptuales.
 Formulación de las consignas de trabajo situadas en el contexto cultural
actualizado y que presenten contacto con los contenidos transversales.
 Diálogo con los y las estudiantes y retroalimentación de propuestas.
 Coordinación de las actividades en el espacio áulico, incentivando relaciones de
respeto, cooperación y integración tolerante.
4
  Orientación sobre las bibliografías y el material de estudio.
 Identificación de potenciales dificultades en cada temática y revisión conjunta de
dichos problemas.
 Suministrar el acceso al software o lenguajes de programación web necesarios
para llevar a cabo las actividades.
 Seguimiento del progreso de aprendizaje de los y las estudiantes.
 Evaluación de los procesos y saberes adquiridos, a través de herramientas de
diagnóstico dinámicas.

Actividades de los y las estudiantes

Las siguientes actividades se llevarán a cabo por parte de los alumnos en cada uno de
los ejes temáticos, según la organización de la clase dispuesta por el docente:

 Lectura y visualización del material bibliográfico, audiovisual e interactivo,

vinculado a la temática de la clase.
 Intercambio de ideas y retroalimentación con el docente y el grupo para generar
propuestas, plantear dudas y puntos de vista.
 Conformación de equipos de trabajo y definición de roles.
 Realización de los trabajos prácticos propuestos.
 Participación en el aula con aportes, acotaciones o dudas.
 Búsqueda y análisis de producciones digitales web preexistentes en la red.
 Aplicación práctica en ejercicios de los saberes adquiridos para la
creación/análisis/modificación de contenidos digitales visuales.
 Planeamiento, desarrollo y publicación del trabajo práctico integrador (sitio web
en servidor)

Instrumentos de evaluación

Para la evaluación de los procesos de aprendizaje se llevarán a cabo métodos e

instrumentos que permitan dar cuenta de los avances y logros alcanzados por cada

5
estudiante y grupalmente, así como también de los aspectos que aún necesiten ser
desarrollados. Los mismos se detallan a continuación:

 Presentaciones orales de diferentes temáticas de la materia

 Trabajos prácticos de desarrollo digital: ejercicios de Maquetación y Prototipado,
ejercicios de Implementación de Código, y ejercicios de Publicación en red
 Tests de implementación de código en soporte digital
 Realización de cuestionarios teóricos sobre categorías centrales
 Autoevaluaciones individuales analíticas de cada estudiante
 Coevaluaciones grupales de ejercicios y trabajos prácticos realizados

Criterios de evaluación

Los criterios del docente tendrán en cuenta aspectos técnicos (prácticos y teóricos) y
vinculares a nivel individual y de grupos. Se destaca el carácter gradual (como proceso
de aprendizaje) de las instancias e instrumentos evaluativos.

 Participación y dinámica activa en clase

 Claridad en los conceptos principales aplicados
 Uso de las metodologías de desarrollo estudiadas
 Capacidad de trabajo en equipo
 Utilización de las herramientas de software y lenguajes
 Innovación en las propuestas de trabajo
 Presentación en plazos y formatos acordados
 Atención al detalle y presentación

Bibiliografía del docente

Selección realizada en base al triple rol de docente-comunicador-diseñador.

 Mendez, Sanchez y Ronald, Enrique. Ux Una Metodologia De Diseño Eficiente.

978-956-401, 2020
 Aguirre, Erwin Estrategias de Comunicacion Visual Para El Diseno Web. Eae
Editorial Academia Espanola, 2012
6
  Goto Kelly y Cotler, Emily. Web ReDesign 2.0 Workflow that Works, Editorial
Pearson, 2002

Bibliografía para el alumno

Selección realizada en base al carácter procesual del aprendizaje, y a modo de vínculo
entre los ejes temáticos.

 Krug, Steve. No me hagas pensar (edición actualizada). Anaya multimedia,

2015
 Lupton, Ellen. El diseño como storytelling. Editorial Gilli, 2019
 Kaushik, Avinash. Analíticas web 2.0: El arte de analizar resultados y la ciencia
de centrarse en el cliente. Trama equipo editorial, 2011
 Sanchez Asenjo, Jorge Desarrollo Web En Entorno Cliente Con Javascript,
Ibergarceta Publicaciones, 2019
 Aubry, Chistophe HTML5 y CSS3 para sitios con diseño web responsive. Eni
ediciones, 2014
 Gutierrez González, Desarrollo y programación en entornos web, Alfaomega
Grupo Editor, 2017
 Córcoles Tendero, José y Montero. Diseño de interfaces. Grado superior.
Editorial Ra-Ma, 2012
 Altadill Izura, Pelloo. Desarrollo web con React. Anaya multimedia, 2019

Bibliografía de referencia para el alumno

Selección realizada en base a posibilidades de ampliación, en temáticas y ejes
tangenciales.

 Harris, Ray. Murach’s Javascript and DOM Scripting. Mike Murach & Associates
Inc., 2009
 Manovich, Lev. El lenguaje en los nuevos medios de comunicación: la imagen
en la era digital. Paidós, 2006
 Equipo Vértice. Técnicas avanzadas de diseño web. Editorial Vértice, 2009