OPEN 2019

Click para ampliar / INSCRIBITE ACA

Relevo final caso x caso. Finale.

Bien. Veamos lo que tenemos:
EN GENERAL. Ok.
Hay  detalles aùn, los detallo en un video alumno x alumno o grupal.
Video del cual les mandarè link... algo voy aprendiendo a pesar mio.

Recuerden que para rendir:
- tienen que presentar informe corregido
- carpeta capturas en jpg a tamaño real (TRES, 3) pantallas.
- folder con el sitio armado. TRES, (3) pàginas, funcionando.

Previo al examen coordinamos dia para consulta. (NO se presenten sin esa consulta para revisar dudas y màs que nada el pràctico)

Luego >>> Rinden el día acordado.

MATTOS:
Presentaciòn informe: Adecuado
Items requeridos: Falto folder con las capturas de pantalla a tamaño real, en jpg.. etc etc. (ver requerimientos de entrega en el blog.. aquí).
Falto ficha de análisis. Ver en el blog o te dejo link de ficha aqui.
Hay  detalles aùn, los detallo en un video .. etc etc.

estado REGULAR

PENSALFINE:
Presentaciòn informe: Adecuado, hay cosas que arreglar. (en el video) Tratá en los informes usar UN tamaño de tìtulo , UNO de subtìtulo y UN cuerpo en general para texto y en caso de bajaditas de texto o detalles UN estilo màs chico accesorio. Y la relaciòn entre los cuerpos tipogràficos tambièn cuidarlos.
Items requeridos: Falto folder con las capturas de pantalla a tamaño real, en jpg.. etc etc. (ver requerimientos de entrega en el blog.. aquí).
El  modelo persona debias dejar SOLO la ficha persona y no la pagina completa del INTI que explica cómo hacer persona
Hay  detalles aùn, los detallo en un video .. etc etc.

estado REGULAR

JUAIRE:

Presentaciòn informe: Adecuado
Items requeridos: Falto folder con las capturas de pantalla a tamaño real, en jpg.. etc etc. (ver requerimientos de entrega en el blog.. aquí).

UNA COSA ; en vez de productos, te pediria hagas una de las paginas de resultado de, por ejemplo, Pirelli. Hacè el wireframe y mockup de ESA pagina. (estas que planteaste dejalas en el infome, pero hace por favor eso que digo. La de productos en realidad deberia ser un listado lateral con la primer marca abierta en vez de una "pagina de logos" que no dice nada... Lo vemos en la consulta.

Hay  detalles aùn, pero los menos repito.

estado REGULAR

GUERRERO:
Presentaciòn informe: Adecuado, le daria un poquito mas de.. estilo. Al diseño
Items requeridos: Falto folder con las capturas de pantalla a tamaño real, en jpg.. etc etc. (ver requerimientos de entrega en el blog.. aquí).
Faltaron mockups de dos pantallas (habia solo una). Un poco desordenado el paginado, hay cosas mezcladas. El perfil persona lo ordenaria un poco más en base a alguno de los modelos que les pase.
Falto ficha de análisis y ordenar DOS ejemplos de competencia.. o no lo entendí. Ver en el blog o te dejo link de ficha aqui.
Hay  detalles aùn, los detallo en un video .. etc etc.

estado REGULAR

CASNATTI:
En espera de información. Igual .. creo se puede leer lo último dicho en la entrega anterior, mientras reviso lo ULTIMO que enviaste

estado :? (vacío hasta nuevo aviso).



Nada más Reviso a conciencia en un video, les mando, y nos vemos en la consulta.
Muchas gracias la paciencia. Disfruten de sus vacaciones y sigan con sus vidas.
Saludos M.

Varios + VIE14 Jun

Primero los files prometidos... tarde pero acá están.
Ficha análisis sitios multimedia BAJAR / editable


EJEMPLOS de informes 10 puntos!:
Informe Berardelli (it) VER
Informe Guidoboni (it) VER

CLASE VIERNES.14


Revisamos trabajos de:
Pensalfine (segunda revisión al 80% OK, los cambios ya los anotaste, corregir y seguir con la etapa que sigue)
Guerrero (segunda revisión al 87%, Muy bien, los cambios aplicalos y segui con la etapa siguiente).
Juaire: A REVISAR
González: A REVISAR
Casnatti: Problemas de máquina. Debe enviar aún lo del viernes. A REVISAR.

Empezamos a ver formularios, con 4 alumnos, luego quedaron 2, y Guerrero terminó usando y probando un formulario. También se explicó el uso de un servidor local virtual (que vino a guisa del uso de un script de PHP, tal vez si da el tiempo lo reveamos... si hay gente...):

Acá les pondré lo que hay que entregar el VIERNES 21 , sí o si pues ya estoy como ven evaluando lo hecho y presentado, considerando para regularizar la materia (bajada a libreta de regularidad). Aparte de los temas que veremos para ir cerrando el programa que deben completar y rendir a fin de año.

Saludos.

VIERNES 21. Cerrando filas...

Hoy siete

Retomando la posta del viernes pasado:

De práctica teoría veremos
 Carga de fuentes autoalojadas.Pseudo clases.(info)  Usar listas como menúes. Menúes verticales y horizontales. (info)Planificación y alternativas para tipos de navegación. Menúes desplegables con CSS. (un ejemplo)
Spritesheets (generar menus o items con UNA sola imagen). (ver herramienta)
Condicionales para diferentes navegadores: Hojas de estilo condicionales.(IE times.. asi se hacia) (enfoque moderno) iframes. Uso. Aplicación de contenidos de terceras partes. Embedding. (info)

El que llegue temprano le reviso el informe (que a esta altura debe estar entrando en la fase II, la semana que viene hasta el miércoles tienen para ir enviándome.

Alla vamos...

(and a while after...)

Acá les dejo el archivo de Thimble que estuvimos tocando:

DESCARGAR.

En el vimos:
menues horizontales verticales (listamatic)
incluir fuentes auto-hosteadas (del fontsquirrel)
trabajo con pseudo-clases (hover y first-child y esas yerbas..)
jugamos con un spritesheet generado con el sprite generator online, y el Fireworks.

Entrega Parte uno ESTADO A LA FECHA. Ausencia general.

Pensalfine: Muy bien encarado, hay detalles los vemos en clase.
Mattos: Excelente, muy cuidado el diseño , también hay detalles los vemos en clase.
Casnatti: Ok, tarde la entrega. Arreglá el tema del árbol de contenidos, usa una ficha de persona más elaborada (ver aquí), arreglá las capturas, enviá de nuevo en PDF.

Resto.
no he visto informes, ni avances, ni consulta.
PRIMER ENTREGA de material: FAIL.

Clase del 31/5____ Asistió Casnatti solamente. Esperé al resto del grupo de 1430 a 1630. por lo que doy por perdido el día. No hay problema, lo que debíamos ver hoy lo meto con calzador en las 3 (tres) clases que quedan.

Detalle de lo que resta entonces (en rojo lo que debíamos ver hoy):

UNIDAD 3. CSS Avanzado

Layout y navegación

Positioning tipos. Z-index y uso. Display opciones. Floats y modelo de columnas en CSS. Crear un layout en DW con XHTML y CSS, Partes y consideraciones básicas.
Carga de webfonts a través de GoogleFonts. Carga de fuentes autoalojadas.

Pseudo clases. Usar listas como menúes. Menúes verticales y horizontales.

Planificación y alternativas para tipos de navegación. Menúes desplegables con CSS.
Condicionales para diferentes navegadores: Hojas de estilo condicionales.

iframes. Uso. Aplicación de contenidos de terceras partes. Embedding.

UNIDAD 4: Forms

Interacción de entrada

Elemento Form. Uso y funcionamiento de un formulario. GET,  POST y action. Etiquetas de entrada datos (inputs), checkboxes, radio button Select, text tareas, botones envío.

Crear un formulario tipo: métodos. Aplicaciones de los formularios en sitios web e importancia en la estructura general.  Estilar un formulario. Dificultades emergentes con los controles de formulario y uso de JS para customización de campos.

UNIDAD 5: Js-Jquery / Intro a HTML5/CSS3

Comportamientos. Nuevas posibilidades.

El modelo de documento DOM (Document object model) y la estructura de una página. Javascript base y su relación con el DOM: sus posibilidades de interacción.

Colocación de scripts en una página y cuidados de uso. Incorporar un JS a un sitio para diferentes operaciones (slider de fotos, smooth scroll y otros ejemplos).

Trabajo con multimedia. Colocar sonido y video con las nuevas etiquetas.
Ejercicio con CANVAS básico. Aplicación de SVG files.

Responsive. Concepto y uso. Los tres componentes del diseño responsive (media queries, Grillas fluídas e imágenes flexibles) (fuente) Uso de un framework sencillo para hacer el layout (simple o boostrap). Consideraciones de prototipado.

Ok... bueno pasemos a las tareas:
En la semana que viene, más tardar MIERCOLES me envían la segunda parte del informe.

El informe (aparte del armado efectivo del HTML CSS) es parte de la práctica integral. Si faltan a entregar el mismo, piensen que hay tres etapas para entregar de bajada de regularidad, y ya han perdido (algunos) la primera de ellas. Quedan dos. Por eso les avisé por correo que se pongan a trabajar o consulten para no perder la regularidad.

Y les dejaré acá un ejercicio que deben traer resuelto (con fallas o no, no hay problema) para el viernes que viene. La idea es que lo realicen, como práctica, y aquellas cosas que les cuesten me las traen para ver en clase así las resolvemos y lo ven todos.

Nada más. Saludo, siendo las 4:55 me retiro. Nos vemos.
Mauro.

POSITION + Z INDEX+ FLOATS

Para los ejercicios de LAYOUT:

Pokemones (base) PSD
background base

EJEMPLO DE CABECERA en html (con Photoshop, tinypng, reset, y W3Schools)
Codigo en el Etherpad.

DESCARGAR

MIERCOLES:2357hs

Informes enviados = 0
Jueves, espero novedades.
Viernes, hago informe.
Saludo Mauro.

Inicio de informe. Datos UTILES...

Hola gente.
Aquí datos útiles para irse guiando con el informe.
El práctico/proyecto es, les recuerdo:
REDISEÑO DE SITIO WEB.

Tiene dos partes, informe (PDF) y sitio (rar, carpeta con archivos).

Parte INFORME: Aqui les coloco material para organizar la entrega:
Como ayuda va el diagrama.(click para ampliar el grafo) tienen los pasos y cosas a resolver en el informe:
Abajo tienen las referencias de algunas herramientas que pueden utilizar para hacer ciertas partes (las que tienen numerito).

SiteMaps diagrams: (1)https://writemaps.com/
https://creately.com/diagram-type/site-map

Recursos de wireframes: (2)
Mockups (https://moqups.com/)
Balsamic Mockups (https://balsamiq.com/products/mockups/)
MockingBird (https://gomockingbird.com)

Mockups: Photoshop / Illustrator / Fireworks/ Sketch (mac) (4)

Ver pantallas en tamaño real: https://www.previewdump.com/


Como referencia a lo de arriba, y para que organicen lo que tienen que hacer, recuerden usar esta referencia de abajo para presentar el PDF:

donde están representadas las etapas como
DISEÑO DE INFORMACIÓN, INTERACCIÓN y PRESENTACIÓN.

Hasta hoy (VIE 17 Mayo)... ya deberían tener listo la etapa en ROJO, e iniciada al menos la etapa en NARANJA.
En clase se explicaron ambas. Tal vez algunos faltaron pero en fin , hare un resumen si da el tiempo hoy al FINAL de clase, no antes.
Repito lo que le dije a González.

---

NO SE REQUIERE QUE HOY ESTE PERFECTO PERO SI COMENZADO.

---

Por las dudas... un video que explica lo de arriba. Explica TODO el proceso, pero de nuevo, con lo inicial en rojo ya me quedo conforme que están en ruta.

(veo que a algunos les quedaron dudas. En el olvido. puede que ayude)



ARMADO EJEMPLO:

Ayuda con sitios

Este sitio remplaza al directorio de sitios argentinos (mayormente feítos) donde pueden sacar el link.
Elijan a gusto o por tema. Esta catalogado para que encuentren su próxima víctima de lifting)
Saludos
https://www.sitiosargentina.com.ar/

Listados de temas para el práctico integrador

Pensalfine : http://morenanaturalsoap.freeservers.com

Guerrero: http://www.letoileescuela.com/

Casnati: https://liserarsa.com.ar
Juaire: http://www.neumaticosjose.com.ar
González: Thornford.com

Por favor los *** mandarme links ANTES del viernes graciasaaaaaaass..

Cumplido el plazo. Asignados los temas a todos los alumnos (les dí tiempo de sobra...)
Nos vemos mañana.

Resumen clase 2:

Acá resumen...

Iniciando

Comenzamos el camino. Por lo pronto, abrimos (una plataforma de votación y conocimos sus dudas acerca de la materia) .Y seguimos...

Un saludo y.. comenzamos. Espero les sirva (y guste, a lo mejor)
M.

UPDATE:
Ya le avisé a Josefina para ver este viernes si me dan aula para el "adelanting hours project".
Me dirán.

Intertanto....
ACA el resumen hablado de lo visto:

Y estoy esperando me manden los 3 sitios "no muy bonitos de ver", recuerden que no sea ni
-BLOG
-ECOMMERCE
-DIARIOS
-Sitios hechos con WordPress.

Para ver si esta hecho con WordPress: a veces dice en el Footer (en el pie del sitio) "hecho con WP o Powered by WP"... Sino tranquilos, me mandan los links y directamente les digo.
Lo de saber con que está hecho un sitio lo iremos viendo. Pero nada, es útil que lo sepan.

Saludos Mauro.

Mesa Marzo 2019

Hola estimados / hadas
Febrero pasó rápidamente, nos queda la mesa de Marzo, concretamente el LUN 11 a las 1630hs.
Para ello daré consulta, probablemente Viernes a la tarde.

Voy avisando y concreto este aviso durante lo que resta del día. Si van a rendir, los espero entonces por la UM, en la parte de laboratorios.
Saludos y gracias.
m a u r o