Gelb Michael - Como Pensar como Leonardo Davinci (reseña).PDF
Chico-UI en escuela DaVinci
-
Upload
natan-santolo -
Category
Design
-
view
1.409 -
download
1
Transcript of Chico-UI en escuela DaVinci
![Page 1: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/1.jpg)
![Page 2: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/2.jpg)
Agenda
•Proyecto
•Instalación y uso
•Familias y componentes
•Diseño
•Citas
•Preguntas?
![Page 4: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/4.jpg)
![Page 5: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/5.jpg)
“son un montón de ninjas chiquitos que te parten la cabeza”
![Page 6: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/6.jpg)
![Page 7: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/7.jpg)
Brief
•Herramienta para desarrollo de Frontend
•Desarrollado en HTML, CSS, JS y PHP
•Componentes reutilizables y configurables
•Código abierto
![Page 8: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/8.jpg)
Proyecto
![Page 9: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/9.jpg)
Objetivos
•Proveer una solución de Frontend para agilizar y unificar la producción
•Normalizar la identidad y la interacción de los componentes
•A largo plazo, lograr consistencia en los productos de MercadoLibre
![Page 10: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/10.jpg)
![Page 11: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/11.jpg)
Equipo
•Tres recursos fulltime
•Entregables todas las semanas
•Filosofía ágil
•Open sourced
![Page 12: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/12.jpg)
![Page 13: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/13.jpg)
Diseño
![Page 14: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/14.jpg)
Máximas para tomar desiciones
•Simplicidad (sintaxis js)
•Re-utilización (snippets, css)
•Estandarización (json, {argumentos})
•Automatización (tests, packer)
•Código funcionando (todos los viernes)
•Escalar después (validator)
![Page 15: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/15.jpg)
Buenas prácticas
• JavaScript no obstrusivo
•Pruebas unitarias (casi TDD)
•Progressive Enhancement & Gracefull Degradation
•Optimización de sprites (con data URI)
•Minificación y compresión de recursos
![Page 16: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/16.jpg)
Patrones y herramientas
• Namespaces (window.ui, ui.foo)
• Closures and Callbacks
• Instances Map (en el DOM)
• Parasitic Inheritance
• Power Constructor (by Douglas Crockford)
• Public Objects: Exponen métodos y propiedades
• Packer-o-matic
![Page 17: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/17.jpg)
Packer-o-matic
•Unifica en un archivo cada tipo de recurso
•Componentes a demanda ?get=
•Minifica el código vs Modo debug
•Próximamente:• Ofuscación de código
![Page 18: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/18.jpg)
Estructura
![Page 19: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/19.jpg)
jQueryjQuery
Core JSCore JS Core CSSCore CSS
ComponentesComponentes
![Page 20: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/20.jpg)
jQueryjQuery
Core JSCore JS Core CSSCore CSS
ComponentesComponentes
Oye Oye Chico!Chico!
![Page 21: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/21.jpg)
Core CSS
• Reset
• Layout general
• Sprite general
• Tipografías
• Próximamente:
• Sistema de grillas
• Skinning (ML, MP, MS, ...)
![Page 22: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/22.jpg)
Core JS•Inicia el SDK
•Crea componentes
•Obtiene recursos necesarios
•Provee herramientas internas (ui.utils)
•Sintaxis jQuery ;)
•Ej: $( query ).component( config );
![Page 23: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/23.jpg)
Componentes
•Unidad funcional y visual mínima empaquetada
•Constan de 3 partes:• Estructura: esqueleto de contenido (HTML) !Important
• Presentación: estilos visuales (CSS)
• Funcionalidad: comportamiento (JS)
•Son configurables ;)
![Page 24: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/24.jpg)
Instalación y uso
![Page 25: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/25.jpg)
Dependencias
•jQuery
•Browser sniffing (IE conditional classes on <html>)
•Script para PNGs transparentes
![Page 26: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/26.jpg)
Instalación
•Incluir dependencias (jQuery, Browser sniffing, PNGfix)
•Incluir los recursos de Chico-UI (JS y CSS)
•HTML snippets
•Configurar componentes
![Page 27: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/27.jpg)
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
![Page 28: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/28.jpg)
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
![Page 29: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/29.jpg)
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
![Page 30: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/30.jpg)
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
![Page 31: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/31.jpg)
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
![Page 32: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/32.jpg)
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
<!doctype html><!--[if IE]><![endif]--><!--[if lt IE 7 ]> <html lang="es" class="no-js ie6"> <![endif]--><!--[if IE 7 ]> <html lang="es" class="no-js ie7"> <![endif]--><!--[if IE 8 ]> <html lang="es" class="no-js ie8"> <![endif]--><!--[if IE 9 ]> <html lang="es" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--> <html lang="es" class="no-js"> <!--<![endif]-->
<head><meta charset="utf-8"><title>Chico UI</title><link rel="stylesheet" type="text/css" href="chico.css"><script src="libs/js/jquery-1.4.4.js"></script><script src="chico.js"></script></head>
![Page 33: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/33.jpg)
![Page 34: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/34.jpg)
Paso a paso
•Incluir dependencias (jQuery, Browser sniffing, PNGfix)
•Incluir los recursos de Chico-UI (JS y CSS)
•HTML snippets
•Configurar componentes
![Page 35: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/35.jpg)
$(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
$(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
![Page 36: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/36.jpg)
$(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
$(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
![Page 37: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/37.jpg)
$(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
$(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
![Page 38: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/38.jpg)
var layer = $(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
var layer = $(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
![Page 39: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/39.jpg)
var layer = $(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
var layer = $(“.rep”).layer({
content: {
type: “param”,
data: “<h2>Reputación</h2>”
},
callbacks: {
show: function(){ // El layer esta prendido }
}
});
{{uid: 0,uid: 0,type: “ui.layer”,type: “ui.layer”,element: HTMLElement,element: HTMLElement,show(),show(),hide()hide()
}}
layer.show()layer.show()
{{uid: 0,uid: 0,type: “ui.layer”,type: “ui.layer”,element: HTMLElement,element: HTMLElement,show(),show(),hide()hide()
}}
layer.show()layer.show()
![Page 40: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/40.jpg)
Familias
![Page 41: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/41.jpg)
![Page 42: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/42.jpg)
Familias
•Controllers
•Floats
•Navs
•Slider
![Page 43: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/43.jpg)
Controllers
•Tab Navigator
•Validator
![Page 44: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/44.jpg)
Floats•Tooltip
•Helper
•Contextual Layer
•Modal Window
![Page 45: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/45.jpg)
Modal config
•content
•type: param | DOM | ajax
•[ data ] : string
•[ callbacks ]
•[ show ] : function
•[ hide ] : function
![Page 46: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/46.jpg)
Layer config• [ event ] : “click”
• content
• type: param | DOM | ajax
•data: string
• [ callbacks ]
• [ show ] : function
• [ hide ] : function
![Page 47: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/47.jpg)
Navs
•Dropdown
•Tab
![Page 48: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/48.jpg)
Slider
•Carousel
![Page 49: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/49.jpg)
Citas
![Page 50: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/50.jpg)
“es una luz en el fondo del tunel, en la busqueda de consistencia entre las UI`s
de Meli”- Tato
![Page 51: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/51.jpg)
“agiliza muchísimo los tiempos de implementación, optimizando los tiempos
de diseñadores y programadores, ahorrando tambien tiempo con
definiciones que ya están resueltas en chico”- Diego
![Page 52: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/52.jpg)
“Con Chico Ui pude dedicarle más tiempo al diseño del los productos y no tener que
preocuparme por el funcionamiento e interacción de componentes ya
estandarizados y que sabemos que funcionan”
- Fer
![Page 53: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/53.jpg)
“Chico UI es un proyecto opensource que agrupa los componentes que se utilizan
dentro en ML.”- Guille
![Page 54: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/54.jpg)
“es una herramienta que simplifica el proceso de implementacion de una interfaz, agregando funcionalidad”
- Lean
![Page 55: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/55.jpg)
“paquetito de codigo que me deja implementar componentes con solo un
par de lineas en mi html”
- Nati
![Page 56: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/56.jpg)
“unos hiper nionios haciendo algo copado para ml”
- Jess
![Page 57: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/57.jpg)
Gracias!!!
•Chico-UI Team: Guille, Lean y Naty!
•GMP Team!
•User Experience Team!
•Damian y Michel...
•A mi mamá y a mi papá, obvio...
![Page 58: Chico-UI en escuela DaVinci](https://reader035.fdocumento.com/reader035/viewer/2022062300/55c275b2bb61eb0f388b4576/html5/thumbnails/58.jpg)