Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
¿Cómo iniciar en UX/UI?
Search
Gabriela Muñoz
August 10, 2020
Design
1
290
¿Cómo iniciar en UX/UI?
Gabriela Muñoz
August 10, 2020
Tweet
Share
More Decks by Gabriela Muñoz
See All by Gabriela Muñoz
Fundamentos de UX
supergabs
0
180
UX/UI #DescubreTech
supergabs
1
200
¿Y cómo hacemos UX en SaaS?
supergabs
0
680
Principios UX Design Hacksureste
supergabs
1
350
Principios UX Design
supergabs
0
260
Lo que debes saber de UI para mobile & desktop
supergabs
0
280
Other Decks in Design
See All in Design
「批評」を習慣にするための仕組みと場のデザイン/uxdesign202507
nikkei_engineer_recruiting
6
890
【MIXI MEETUP!ー TECH & DESIGN DAYー】新たなSNS「mixi2」の “0→1”開発の舞台裏:デザイナーが語るプロダクト誕生秘話
mixi_design
PRO
0
150
新卒の目から見たサイボウズのデザイン組織
ryota5884
0
210
Memory Man v3 (WIP)
storybychad
PRO
0
2.7k
AI駆動なデザイン開発 〜Figma Make でまるっとつくるか、 HTML でシンプルにつくるか〜
t_east
1
1.4k
デザイナーがはばたく未来の入り口『hatch』が描く、新しいデザイナー育成のカタチ
goodpatch
1
1.9k
【Designship 2025|10.11】デザイン組織と事業貢献、その挑戦と結果。
payatsusan213
1
650
デザインエンジニアの延長にデザインマネージャーとしての可能性を探る
takanorip
0
610
佐藤千晶|ポートフォリオ
chimi_chia
0
210
【MIXI MEETUP!ー TECH & DESIGN DAYー】【工数98%削減】Xでモンストを話題にせよ!生成AIの活用で日本トレンド6位を獲得した企画の設計&デザイン術
mixi_design
PRO
0
160
Designing User Experience through Interaction Design
lycorptech_jp
PRO
0
420
AIを身近に感じるために、デザイナー全員で一つのサービスを使ってみた
_psyc0_
0
320
Featured
See All Featured
Visualization
eitanlees
149
16k
The Art of Programming - Codeland 2020
erikaheidi
56
14k
How GitHub (no longer) Works
holman
315
140k
Build your cross-platform service in a week with App Engine
jlugia
232
18k
Optimising Largest Contentful Paint
csswizardry
37
3.5k
Documentation Writing (for coders)
carmenintech
75
5.1k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
How to Think Like a Performance Engineer
csswizardry
27
2.1k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
359
30k
Six Lessons from altMBA
skipperchong
29
4k
Writing Fast Ruby
sferik
629
62k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
9
920
Transcript
¿Cómo iniciar en UX/UI?
Agradecimientos 2 Esta presentación será compartida :-)
Agenda ◍ Conocimientos básicos ◍ Proceso de diseño ◍ Escenario
actual en la industria 3
1. Conocimientos básicos ¿Por dónde comenzamos? 4
Fundamentos • ¿Qué es diseño? • ¿Qué es diseño centrado
en el usuario? • ¿Qué es usabilidad? • ¿Qué es UX? + artefactos de UX • ¿Qué es UI? + herramientas de UI 5
¿Qué es diseño? Diseño es un proceso, se trata de
planear cómo va a ser o cómo va a funcionar algo. Siempre orientado a una necesidad. 6
Diseño centrado en usuario Es un enfoque de diseño cuyo
proceso está dirigido por información sobre las personas que van a hacer uso del producto. 7
Usabilidad 8
Usabilidad Es la facilidad con la que las personas utilizan
una herramienta u otro objeto para conseguir un objetivo específico. 9
Usabilidad 10
Heurísticas Nielsen 11 ◍ Visibilidad del estado del sistema ◍
Mismo lenguaje del usuario ◍ Consistencia en estándares ◍ Flexibilidad y eficiencia de uso ◍ Ayudar a los usuarios a identificar, diagnosticar y solucionar errores. ◍ Ayuda y documentación
¿UX no es UI? 12
¿Qué es UX? 13
¿Qué es UX? Es descubrir, investigar y mejorar la experiencia
de una persona con un producto o servicio. 14
Necesidades De usuarios Negocio ¿Qué es UX? Tecnología 15 UX
UX ◍ Investigación ◌ Cuantitativa ◌ Cualitativa ◍ Pruebas de
usabilidad ◍ Comunicación con marketing, comercial, desarrollo, negocio. 16
¿Qué es UI? 17
Interfaz de usuario Es aplicar lo que se descubrió de
a una interfaz de usuario, casi siempre es una interfaz gráfica. 18
Interfaz de usuario 19
UI Kits ◍ Material Design 20
UI Kits ◍ Human Interface 21
Herramientas ◍ XD Adobe ◍ Sketch ◍ Figma 22
Herramientas Prototipado ◍ Marvel ◍ Zeplin 23
2. Proceso de Diseño ¿Cómo resuelves problemas? 24
Proceso de Diseño 25
Design Thinking
Lean Startup
Design Sprint
¿Entregables? ¿Qué son y por qué importan? 29
30
User personas Una persona es una descripción ficticia, pero realista,
de un usuario típico o potencial de un producto. -Nielsen/Norman Group 31
User personas 32
Site map Es la lista de páginas que tendrá un
sitio web o una aplicación móvil 33
Historias de usuario Descripción de tareas a realizar, desde el
punto de vista del usuario ◍ Responden a las preguntas “Quién”, “Qué” y “Por qué” 34
User Flow Es la ruta que sigue un usuario en
un sitio web o aplicación para completar una tarea. 35
User Flow 36
Wireframes Es un boceto que tiene como objetivo definir el
contenido y la posición de bloques de un producto digital. Incluye menús de navegación, bloques de contenido. 37
Wireframes 38
Wireflows Combinan las metas del usuario, tareas e interacciones entre
pantallas. Aprende más: https:/ /uxdesign.cc/when-to-use-user-flows-guide-8b26ca9aa36a 39
Wireflows 40
Mockups 41
Prototipos interactivos 42
3. Escenario actual ¿UI Designer, UI/UX Designer, UX Designer? 43
Tipo de empresas • Agencia • Consultora • Producto -
Servicio 44
Roles • UI/UX Designer • UX Designer • UI Designer
• UI/UX Designer Developer 45
Tipo de vacantes 46 UX Designer UI /UX Designer
Tipo de vacantes 47 UI /UX Designer Developer UX Designer
¿Qué necesito para aplicar? • CV • Portafolio • Linkedin
actualizado Muchaaaaa confianza 48
4. Recomendaciones ¡Aprende más! 49
Recomendaciones 50 Don’t make me think - Steve Krug About
Face Jacob Nielsen Nielsen Norman Group UX Collective
RETO! ◍ Financiera ◍ Aerolínea ◍ Salud 51
◍ Identifica la funcionalidad que te enoja! ◍ ¿Cómo la
mejorarías? ◍ Describe tu solución ◍ Dibuja ◍ Comparte en Twitter :-) 52
Gracias 53 Más de mi: Medium - @gabrielaa.ayon SpeakerDeck- @supergabs
¿Preguntas? 54
Credits Special thanks to all the people who made and
released these awesome resources for free: ◍ Presentation template by SlidesCarnival ◍ Photographs by Unsplash 55