Este documento presenta una introducción a un taller de diseño de interfaz de usuario (UI). Explica conceptos como identidad visual, diseño de información, diseño de interfaz y resultados. Incluye ejemplos de una metodología de diseño, paletas de colores, tipografías, wireframes y prototipos. El objetivo es enseñar técnicas de diseño UI a través de la aplicación de estas a un caso real.
Curso de Ingeniería de Software II. 1ra. PARTE. OBJETIVO GENERAL DE LA ASIGNATURA: El alumno desarrollará un sistema de información empleando las técnicas, metodologías y herramientas de diseño, pruebas y liberación necesarias para garantizar la implementación, de acuerdo a los requerimientos del cliente.
Curso de Ingeniería de Software II. 1ra. PARTE. OBJETIVO GENERAL DE LA ASIGNATURA: El alumno desarrollará un sistema de información empleando las técnicas, metodologías y herramientas de diseño, pruebas y liberación necesarias para garantizar la implementación, de acuerdo a los requerimientos del cliente.
Las estrategias de marketing digital centradas en la UX coordinan las acciones para entregar la mejor experiencia posible a los usuarios. Al investigar a las personas y generar contenidos y campañas a su medida, las empresas pueden llegar al público objetivo de la mejor forma.
Presentación de apoyo para el foro "Análisis y gestión de contenidos en Internet" realizado en el Workshop de Procesamiento Automatizado de Texto y Corpus, Wopatec 2014.
Sustainable Land Use Funds – Althelia Ecosphere CIFOR-ICRAF
This presentation by Althelia Ecosphere was given at a session titled "Sustainable Land Use Funds" at the Global Landscapes Forum: The Investment Case on June 10, 2015. For more, please visit http://www.landscapes.org/london/
The Rietveld Academy's Studium Generale invited me to hold a lecture in the framework of a thematic series titled "Youth is an art".
I chose to present several lives burdened by serious limitations, either mental or physical. The protagonists are not able to function normally, but somehow are able to lescape or neutralize the bubble that limits their life.
Basically it is creativity and gusto that make them to go beyond their limitations.
Las estrategias de marketing digital centradas en la UX coordinan las acciones para entregar la mejor experiencia posible a los usuarios. Al investigar a las personas y generar contenidos y campañas a su medida, las empresas pueden llegar al público objetivo de la mejor forma.
Presentación de apoyo para el foro "Análisis y gestión de contenidos en Internet" realizado en el Workshop de Procesamiento Automatizado de Texto y Corpus, Wopatec 2014.
Sustainable Land Use Funds – Althelia Ecosphere CIFOR-ICRAF
This presentation by Althelia Ecosphere was given at a session titled "Sustainable Land Use Funds" at the Global Landscapes Forum: The Investment Case on June 10, 2015. For more, please visit http://www.landscapes.org/london/
The Rietveld Academy's Studium Generale invited me to hold a lecture in the framework of a thematic series titled "Youth is an art".
I chose to present several lives burdened by serious limitations, either mental or physical. The protagonists are not able to function normally, but somehow are able to lescape or neutralize the bubble that limits their life.
Basically it is creativity and gusto that make them to go beyond their limitations.
Si hay una pregunta que entre la comunidad de diseño se plantea es: y tú ¿con qué programa diseñas las aplicaciones? Repaso por las distintas herramientas de diseño de aplicaciones y análisis de las ventajas e inconvenientes de cada una.
Arquitectura Ecléctica e Historicista en Latinoaméricaimariagsg
La arquitectura ecléctica e historicista en Latinoamérica tuvo un impacto significativo y dejó un legado duradero en la región. Surgida entre finales del siglo XIX y principios del XX, esta corriente arquitectónica se caracteriza por la combinación de diversos estilos históricos europeos, adaptados a los contextos locales.
El movimiento moderno en la arquitectura venezolana tuvo sus inicios a mediados del siglo XX, influenciado por la corriente internacional del modernismo. Aunque inicialmente fue resistido por la sociedad conservadora y los arquitectos tradicionalistas, poco a poco se fue abriendo camino y dejando una huella importante en el país.
Uno de los arquitectos más destacados de la época fue Carlos Raúl Villanueva, quien dejó un legado significativo en la arquitectura venezolana con obras como la Ciudad Universitaria de Caracas, considerada Patrimonio de la Humanidad por la UNESCO. Su enfoque en la integración de la arquitectura con el entorno natural y la creación de espacios que favorecen la interacción social, marcaron un punto de inflexión en la arquitectura venezolana.
Otro arquitecto importante en la evolución del movimiento moderno en Venezuela fue Tomás Sanabria, quien también abogó por la integración de la arquitectura con el paisaje y la creación de espacios abiertos y funcionales. Su obra más conocida es el Parque Central, un complejo urbanístico que se convirtió en un ícono de la modernidad en Caracas.
En la actualidad, el movimiento moderno sigue teniendo influencia en la arquitectura venezolana, aunque se ha visto enriquecido por nuevas corrientes y enfoques que buscan combinar la modernidad con la identidad cultural del país. Proyectos como el Centro Simón Bolívar, diseñado por el arquitecto Fruto Vivas, son ejemplos de cómo la arquitectura contemporánea en Venezuela sigue evolucionando y adaptándose a las necesidades actuales.
DIA DE LA BANDERA PERUANA EL 7 DE JUNIO DE 182062946377
Diseño del dia de la bandera. El 7 de junio se celebra en todo el Perú el Día de la Bandera, una fecha que conmemora el aniversario de la Batalla de Arica de 1880, un enfrentamiento histórico en el que las tropas peruanas se enfrentaron valientemente a las fuerzas chilenas durante la Guerra del Pacífico.
Porfolio de diseños de Comedores de Carlotta Designpaulacoux1
calidad en el porfolio capturan la atención al detalle, la calidad de los materiales y la armonía de colores y texturas en cada diseño. El cuidadoso equilibrio entre muebles, iluminación y elementos decorativos se destaca en cada espacio, creando ambientes acogedores y sofisticados.
En resumen, la sección de porfolio de comedores de Carlotta Design es un reflejo del compromiso del equipo con la excelencia en el diseño de interiores, mostrando su habilidad para crear ambientes únicos y personalizados que sobresalen por su belleza y funcionalidad
2. WORKSHOP UI
Esta presentación fue realizada por IDA | Ideas Digitales Aplicadas para el WORKSHOP UI.
Fue preparada y desarrollada por:
Presentación de expositores
Fernanda Zúñiga
Encargada de Diseño
Jaime Pérez
Diseñador Web
Valentina Reyes
Diseñadora Web
valentina@ida.cljaime@ida.clfernanda@ida.cl
Puedes encontrar artículos de interés en www.ida.cl/blog
3. WORKSHOP UI
Metodología DCU
Rueda metodológica de trabajo
MÉTRICAS
IMPLE
MENTACIÓN
CONTENIDOSYCONVERSIÓN
AI-ARQUITECTURA
DIA
GNÓSTICO Y PROPUESTA
UX
METODOLOGÍA
INVESTIGACIÓN Y ESTRATEGIA
ARQUITECTURAYD
ISEÑOFRO
NTYDESARROLLO
INVESTIGACIÓN CON USUARIOS
ESTRATEGIA
PRODUC
CIÓN
UI-INTERFAZDEUSUARIOS
2
3
4
1
A
5
B
C
4. 1. Identidad Visual
2. Diseño de Información
3. Diseño de Interfaz
4. Resultados
5. Actividades
Índice
5. 1. Tipografías web e iconografía.
2. Paleta cromática.
3. Tratamiento de la imagen.
Identidad Visual
INTERPRETACIÓN
01
6. WORKSHOP UI
๏ Usuario enfrentado a un gran volumen de
contenidos técnicos.
๏ Paradigma: contenido “para expertos” a uno
accesible “para todos”.
Identidad Visual
Centro de Despacho Económico de Carga del Sistema Interconectado Central
7. WORKSHOP UI
Tipografía web e iconografía
Tipografías e iconografía CDECSIC
01 Capítulo /
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean
commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
Aenean commodo ligula eget dolor. Aenean m
HEADING H2
HEADING H3 SIDEBAR
HEADING H1
H3.title.featured
H3.title.simple
Encabezados Iconografía
Párrafos
Navegación .MAIN-NAVIGATION UL LI
HELP-NAVIGATION UL LI
13. WORKSHOP UI
Identificación de Jerarquías
Wireframe del sitio Dulce Receta
Cuando hablamos de jerarquías y
funciones nos referimos a las
cabeceras, títulos, listas, imágenes,
formularios y las tipografías indican el
orden y la relevancia de cada elemento.
02 Capítulo /
14. WORKSHOP UI
Reconocimiento de la unidad discreta
Unidad discreta en el sitio Dulce Receta
La unidad discreta, es una
estructura modular, la cual debe
ser capaz de adaptarse a
diferentes elementos sin verse
afectada por el contexto.
02 Capítulo /
16. 1. Entendimiento del layout.
2. Diseño de interacciones.
3. Definición de proporciones.
4. Prototipos navegables.
Diseño de Interfaz
ADAPTACIÓN
03
17. WORKSHOP UI
Diseño de interfaz CDECSIC
¿Qué es el diseño de interfaz?03 Capítulo /
Aplicación e integración de
elementos según soportes
considerados (web, móviles, etc.).
18. WORKSHOP UI
๏ Diseño líquido
๏ Diseño adaptativo
๏ Diseño responsivo
La importancia del layout03 Capítulo /
Ver video explicativo en http://www.ida.cl/blog/diseno/diseno-web-fluido-adaptativo-responsivo/
19. WORKSHOP UI
El comportamiento del
sistema, los errores y las
instancias SE DISEÑAN.
Diseño de interacciones03 Capítulo /
Siguiente ∠
Razón social
Minería Forestal Acuícola SanitarioEnergía
Otros Separados por coma
Nombre fantasía
Rubro(s)
Giro
Dirección comercial*
*Campo obligatorio
Código postal
País Región
Ciudad
Teléfono
Comuna
Todos los datos son obligatorios
DATOS DE LA EMPRESA
DATOS DE LA CUENTA1. CONFIRMACIÓN3.DATOS DE LA EMPRESA2.
Subir logotipo
IMAGEN DE LA EMPRESA
Examinarimagen.jpg
Es necesario llenar este campo
Instancia
Error
¿Cómo se ve
desplegado?
¿Cómo se ve cuando ya
subí una imagen?
Formulario de registro empresa bolsa de trabajo EDITEC
20. WORKSHOP UI
¡ Ojo con las proporciones!03 Capítulo /
๏ Medida base
๏ Mantener consistencia de jerarquía en diferentes dispositivos
∠Siguiente
RUT
-
E-mail
Contraseña
Repetir contraseña
Todos los datos son obligatorios
DATOS DE LA CUENTA
Formulario de registro empresa bolsa de trabajo EDITEC
21. WORKSHOP UI
¡ Ojo con las proporciones!03 Capítulo /
๏ Medida base
๏ Mantener consistencia de jerarquía en diferentes dispositivos
∠Siguiente
RUT
-
E-mail
Contraseña
Repetir contraseña
Todos los datos son obligatorios
DATOS DE LA CUENTA
∠Siguiente
RUT
-
E-mail
Contraseña
Repetir contraseña
Todos los datos son obligatorios
DATOS DE LA CUENTA
28px
28px
28px
28px
28px
28px
28px
14px
14px
14px
14px
16px
28px 28px
14px
14px
Formulario de registro empresa bolsa de trabajo EDITEC
32. 1. Presentación de la entidad y selección de material.
2. Diseño landing page simple.
3. Diseño de formulario.
ACTIVIDADES
33. WORKSHOP UI
Introducción04 Capítulo /
¿Qué es Cordillera?
La productora nacional Streetmachine nos trae el
primer festival de música electrónica Cordillera,
made in Chile, que se realizará en La Parva,
oportunidad perfecta para aprovechar un gran
paisaje y dos jornadas de música electrónica
imperdible.
¿En qué consistirá?
Serán dos jornadas que constarán con espectáculos y
subgéneros diferentes. El evento comienza el día
viernes a las 12:00, de la mano de DJ Guti.
Público objetivo
Hombres y mujeres de 25 - 35 años, que les guste la
música electrónica.
35. WORKSHOP UI
Introducción - Elección tipografía04 Capítulo /
Droid Sans Google fonts (1)
abcdefghijklmñnopqrstuvwxyz
ABCDEFGHIJKLMÑNOPQRSTUVWXYZ
01234567
Merriweather Google fonts (2)
abcdefghijklmñnopqrstuvwxyz
ABCDEFGHIJKLMÑNOPQRSTUVWXYZ
01234567
3. Caviar dreams Dafont (3)
abcdefghijklmñnopqrstuvwxyz
ABCDEFGHIJKLMÑNOPQRSTUVWXYZ
01234567
Fuentes descargadas de Google Fonts y Dafont.
36. WORKSHOP UI
Introducción - Elección iconos04 Capítulo /
Familia iconográfica 1 Familia iconográfica 2
i
Iconos descargados de Flaticon y Sketchappsources