Diseño de Iconos
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Diseño de Iconos

on

  • 1,925 views

Bases a considerar para el diseño de iconos para interfaces gráficas de usuario.

Bases a considerar para el diseño de iconos para interfaces gráficas de usuario.

Statistics

Views

Total Views
1,925
Views on SlideShare
1,925
Embed Views
0

Actions

Likes
0
Downloads
51
Comments
0

0 Embeds 0

No embeds

Accessibility

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Diseño de Iconos Presentation Transcript

  • 1. Diseño deInterfacesBases para el diseño de iconos.Mtro. Omar Sosa Tzec.http://www.tzek-design.com/blog@tzek
  • 2. Introducción
  • 3. http://upload.wikimedia.org/wikipedia/commons/2/21/Newspaper_rock.jpg
  • 4. http://farm2.static.flickr.com/1028/554042494_01c855d8ee.jpg
  • 5. http://www.artesdellibro.com/images/mafu021.jpg
  • 6. Signo
  • 7. interpretanterepresentamen objeto
  • 8. ÍconoÍndiceSímbolo http://www.slideshare.net/Tzek/semi
  • 9. http://upload.wikimedia.org/wikipedia/http://infinitiguadagni.com/images/Mail- http://fc01.deviantart.net/fs70/f/2010/224/7/0/ commons/thumb/e/eb/icon.png FingerPrint_jpg_Icon_by_DontStealMyInfo.jpg Handicapped_Accessible_sign.svg/451px- Handicapped_Accessible_sign.svg.png
  • 10. Gestalt
  • 11. La Gestalt es una teoría psicológica la cual indica,en términos de la percepción visual, que elentendimiento es alcanzado a través de reconocerel juego interno entre los elementos de diseño y laconcurrente lectura de la composición como untodo. Los puntos más importantes para el estudiodel diseño de información son• el principio de la proximidad,• el principio de la similaridad,• el principio de la «pregnancia», y• el principio de cierre. The Information Design Handbook. Visocky, 2008.
  • 12. Proximidad.
  • 13. Similaridad.
  • 14. Ley de la Praegnanz.
  • 15. Cierre.
  • 16. Bertin
  • 17. Fuente: http://www.infovis-wiki.net/index.php?title=Visual_Variables
  • 18. Iconicidad
  • 19. Representación gráficade ideas en el diseñode iconos
  • 20. mostrar el sujeto directamente• El sujeto mismo.• La acción a ser desempeñada.• El rostro humano y expresión corporal. The Icon Book. Horton, 1994.
  • 21. El sujeto mismo. http://aux.iconpedia.net/uploads/1437041524.png
  • 22. La acción a ser desempeñada. http://calgaryisawesome.com/wp-content/uploads/2009/10/pushbutton.png
  • 23. La acción a ser desempeñada. http://www.resourcesgraphics.com/vector-graphic/vector-icon-vector-graphic/business-person-of-the-icon-image-of-the-vector-material.html
  • 24. analogías lógicas en relación o asociación con el objeto• Conexión causal.• Analogía funcional.• Resultados.• Analogía estructural. The Icon Book. Horton, 1994.
  • 25. Conexión causal. http://www.internet4classrooms.com/images/07_word_symbol.gif
  • 26. Analogía funcional. http://cdn1.iconfinder.com/data/icons/DarkGlass_Reworked/128x128/apps/kruler.png
  • 27. Resultados. http://www.homeandlearn.co.uk/excel2007/images/alignment2.gif
  • 28. Analogía estructural. http://1.bp.blogspot.com/_ozQS_2m2GAM/S-unFSg-hJI/AAAAAAAAAMU/g4YInPOuTZo/s1600/m0324.jpg
  • 29. figuras de la imagen• Sinécdoque.• Litote.• Hipérbole. The Icon Book. Horton, 1994.
  • 30. Sinécdoque.http://www.wired.com/images_blogs/gadgetlab/2010/09/iTunes10.png
  • 31. Litote. http://png.findicons.com/files/icons/719/crystal_clear_actions/128/agt_action_fail_256.png
  • 32. Hipérbole. http://www.123rf.com/photo_472859_full-trash-can--3d-render.html
  • 33. Ideación, bocetos ysu relación con el diseñode iconos
  • 34. Recursos en línearelacionados con eldiseño de iconos modernos
  • 35. http://turbomilk.com/blog/cookbook/icon_design/10_mistakes_in_icon_design/http://developer.apple.com/library/mac/#documentation/UserExperience/Conceptual/AppleHIGuidelines/XHIGIcons/XHIGIcons.html#//apple_ref/doc/uid/20000967-TP6http://www.rw-designer.com/shadow-iconshttp://psd.tutsplus.com/articles/theory/know-your-icons-part-1-a-brief-history-of-computer-icons/http://psd.tutsplus.com/articles/theory/know-your-icons-part-2-modern-icon-design/http://www.noupe.com/tutorial/55-adobe-illustrator-icon-design-tutorials-2.htmlhttp://mustified.com/2011/05/08/rules-modern-icon-design/
  • 36. Gracias.* Presentación con fines didácticos sin lucro. Imágenesy textos son propiedad de sus autores.