
Actividad diagnostica
Objetivo:Identificar los conocimientos previos de los estudiantes en HTML, CSS y lógica básica de diseño web.Instrucciones:Crea una página web simple con un archivo index.html.La página debe contener:Un título principal con tu nombre.Un párrafo donde describas qué entiendes por "aplicaciones web progresivas".Una lista (puede ser ordenada o no ordenada) con 3 aplicaciones web que uses en tu día a día.Una imagen (puede ser de internet o de tu computadora).Aplica algo de estilo con CSS interno o...

App móvil con CRUD conectado a servidor LAMP
Objetivo generalDesarrollar una app móvil en React Native (Expo) capaz de conectarse a una API PHP que realiza operaciones CRUD sobre una tabla en MySQL, todo dentro de una red local.Herramientas necesariasMySQ: Base de datosPHP (Apache o XAMPP): API en backendReact Native + ExpoApp: móvil frontendPostman (opcional): Prueba de endpoints APIVS Code: Editor de códigoExpo Go: Pruebas en el móvil (iOS/Android)Parte 1: Crear la base de datosEn phpMyAdmin o línea de comandos de MySQL:CREATE DATABAS...

La señal que nunca llegó
Lucas tenía una visión: crear una app que ayudara a pequeños productores locales a vender sus cosechas directamente a consumidores urbanos. Nada de intermediarios, solo conexión. La llamó Raíz. Desde su pequeño estudio en Oaxaca, con más corazón que presupuesto, construyó una app limpia, intuitiva y optimista. El diseño estaba listo. Las funciones estaban listas. Los productores estaban listos. Solo faltaba que el mundo se conectara con ella. El día del lanzamiento fue como un amanecer. Lucas...
<100 subscribers

Actividad diagnostica
Objetivo:Identificar los conocimientos previos de los estudiantes en HTML, CSS y lógica básica de diseño web.Instrucciones:Crea una página web simple con un archivo index.html.La página debe contener:Un título principal con tu nombre.Un párrafo donde describas qué entiendes por "aplicaciones web progresivas".Una lista (puede ser ordenada o no ordenada) con 3 aplicaciones web que uses en tu día a día.Una imagen (puede ser de internet o de tu computadora).Aplica algo de estilo con CSS interno o...

App móvil con CRUD conectado a servidor LAMP
Objetivo generalDesarrollar una app móvil en React Native (Expo) capaz de conectarse a una API PHP que realiza operaciones CRUD sobre una tabla en MySQL, todo dentro de una red local.Herramientas necesariasMySQ: Base de datosPHP (Apache o XAMPP): API en backendReact Native + ExpoApp: móvil frontendPostman (opcional): Prueba de endpoints APIVS Code: Editor de códigoExpo Go: Pruebas en el móvil (iOS/Android)Parte 1: Crear la base de datosEn phpMyAdmin o línea de comandos de MySQL:CREATE DATABAS...

La señal que nunca llegó
Lucas tenía una visión: crear una app que ayudara a pequeños productores locales a vender sus cosechas directamente a consumidores urbanos. Nada de intermediarios, solo conexión. La llamó Raíz. Desde su pequeño estudio en Oaxaca, con más corazón que presupuesto, construyó una app limpia, intuitiva y optimista. El diseño estaba listo. Las funciones estaban listas. Los productores estaban listos. Solo faltaba que el mundo se conectara con ella. El día del lanzamiento fue como un amanecer. Lucas...
Share Dialog
Share Dialog


El desarrollo de interfaces para dispositivos inteligentes es clave para garantizar experiencias intuitivas y funcionales. Con esta actividad práctica podrás aplicar los conceptos aprendidos y diseñar tu propia interfaz adaptativa para smartphones, tablets, wearables o dispositivos del hogar conectado.
Al terminar esta actividad práctica podrás:
Crear tu propio prototipo de interfaz para un dispositivo inteligente.
Aplicar conceptos de usabilidad, accesibilidad y diseño adaptativo.
Evaluar y mejorar tu interfaz mediante pruebas y retroalimentación.
Materiales y Herramientas:
Computadora con acceso a internet.
Herramientas de prototipado: Figma, Adobe XD o Sketch (gratuitas o versiones de prueba disponibles).
Smartphone o tablet para pruebas de visualización.
Papel y lápiz para bocetos iniciales.
Selecciona un dispositivo inteligente para tu interfaz: smartphone, tablet, reloj inteligente o pantalla de hogar conectado.
Define la función principal de tu aplicación o interfaz. Ejemplo: app de control de temperatura, app de seguimiento de actividad física, reproductor de música.
Anota 3-5 tareas principales que el usuario debe poder realizar en la interfaz.
Investiga interfaces existentes similares a la que deseas crear. Observa: disposición de botones, uso de colores, iconografía, navegación.
Define la estructura básica de tu interfaz: cuántas pantallas tendrá, menú principal, botones clave.
Realiza un boceto rápido en papel de la pantalla principal y las secundarias.
Abre tu herramienta de prototipado (Figma, Adobe XD o Sketch).
Crea un nuevo proyecto con las dimensiones del dispositivo elegido.
Añade elementos básicos:
Botones de acción
Menú de navegación
Imágenes o iconos representativos
Organiza los elementos pensando en usabilidad y accesibilidad:
Botones grandes y fáciles de tocar
Contraste de colores adecuado
Texto legible
Exporta tu prototipo a tu dispositivo o utiliza la vista previa en la herramienta.
Realiza una prueba rápida siguiendo las tareas que definiste en el paso 1.
Observa si la navegación es intuitiva, si los botones son claros y si el diseño es cómodo para el usuario.
Identifica mejoras posibles en la interfaz:
Cambios en la ubicación de botones
Ajustes de color o tipografía
Pantallas adicionales necesarias
Ajusta tu prototipo según estas observaciones.
Comparte tu prototipo con un compañero o grupo para obtener retroalimentación adicional.
Intenta adaptar tu interfaz a otro dispositivo (ej. smartwatch si diseñaste para tablet).
Crea versiones alternativas usando diferentes paletas de colores o estilos de navegación.
Evalúa la interfaz usando una lista de criterios de usabilidad para mejorar la experiencia del usuario.
Diseñar interfaces para dispositivos inteligentes no es solo cuestión de estética; se trata de crear experiencias que conecten con las personas, faciliten sus tareas y hagan que la tecnología se vuelva transparente en su vida diaria. Cada botón, cada pantalla y cada interacción cuentan, y ahora tienes las herramientas para empezar a crearlas tú mismo.
El desarrollo de interfaces para dispositivos inteligentes es clave para garantizar experiencias intuitivas y funcionales. Con esta actividad práctica podrás aplicar los conceptos aprendidos y diseñar tu propia interfaz adaptativa para smartphones, tablets, wearables o dispositivos del hogar conectado.
Al terminar esta actividad práctica podrás:
Crear tu propio prototipo de interfaz para un dispositivo inteligente.
Aplicar conceptos de usabilidad, accesibilidad y diseño adaptativo.
Evaluar y mejorar tu interfaz mediante pruebas y retroalimentación.
Materiales y Herramientas:
Computadora con acceso a internet.
Herramientas de prototipado: Figma, Adobe XD o Sketch (gratuitas o versiones de prueba disponibles).
Smartphone o tablet para pruebas de visualización.
Papel y lápiz para bocetos iniciales.
Selecciona un dispositivo inteligente para tu interfaz: smartphone, tablet, reloj inteligente o pantalla de hogar conectado.
Define la función principal de tu aplicación o interfaz. Ejemplo: app de control de temperatura, app de seguimiento de actividad física, reproductor de música.
Anota 3-5 tareas principales que el usuario debe poder realizar en la interfaz.
Investiga interfaces existentes similares a la que deseas crear. Observa: disposición de botones, uso de colores, iconografía, navegación.
Define la estructura básica de tu interfaz: cuántas pantallas tendrá, menú principal, botones clave.
Realiza un boceto rápido en papel de la pantalla principal y las secundarias.
Abre tu herramienta de prototipado (Figma, Adobe XD o Sketch).
Crea un nuevo proyecto con las dimensiones del dispositivo elegido.
Añade elementos básicos:
Botones de acción
Menú de navegación
Imágenes o iconos representativos
Organiza los elementos pensando en usabilidad y accesibilidad:
Botones grandes y fáciles de tocar
Contraste de colores adecuado
Texto legible
Exporta tu prototipo a tu dispositivo o utiliza la vista previa en la herramienta.
Realiza una prueba rápida siguiendo las tareas que definiste en el paso 1.
Observa si la navegación es intuitiva, si los botones son claros y si el diseño es cómodo para el usuario.
Identifica mejoras posibles en la interfaz:
Cambios en la ubicación de botones
Ajustes de color o tipografía
Pantallas adicionales necesarias
Ajusta tu prototipo según estas observaciones.
Comparte tu prototipo con un compañero o grupo para obtener retroalimentación adicional.
Intenta adaptar tu interfaz a otro dispositivo (ej. smartwatch si diseñaste para tablet).
Crea versiones alternativas usando diferentes paletas de colores o estilos de navegación.
Evalúa la interfaz usando una lista de criterios de usabilidad para mejorar la experiencia del usuario.
Diseñar interfaces para dispositivos inteligentes no es solo cuestión de estética; se trata de crear experiencias que conecten con las personas, faciliten sus tareas y hagan que la tecnología se vuelva transparente en su vida diaria. Cada botón, cada pantalla y cada interacción cuentan, y ahora tienes las herramientas para empezar a crearlas tú mismo.
No comments yet