Diferencia entre revisiones de «User Experience»
Ir a la navegación
Ir a la búsqueda
| Línea 1: | Línea 1: | ||
| + | == Color == | ||
| + | |||
| + | * http://demosthenes.info/blog/61/An-Easy-Guide-To-HSL-Color-In-CSS3 | ||
| + | * http://itpastorn.github.io/webbteknik/future-stuff/svg/color-wheel.html | ||
| + | |||
== HCI == | == HCI == | ||
| Línea 6: | Línea 11: | ||
* http://codepen.io/fbrz/full/bNdMwZ/ | * http://codepen.io/fbrz/full/bNdMwZ/ | ||
| − | |||
== Research == | == Research == | ||
| Línea 16: | Línea 20: | ||
* http://blog.hubspot.com/blog/tabid/6307/bid/30907/9-Questions-You-Need-to-Ask-When-Developing-Buyer-Personas.aspx | * http://blog.hubspot.com/blog/tabid/6307/bid/30907/9-Questions-You-Need-to-Ask-When-Developing-Buyer-Personas.aspx | ||
* http://www.smartinsights.com/marketplace-analysis/customer-analysis/web-design-personas/ | * http://www.smartinsights.com/marketplace-analysis/customer-analysis/web-design-personas/ | ||
| − | |||
=== Reports === | === Reports === | ||
* 2013: [https://www.dropbox.com/s/ay0q8b7sklv9y1g/2013_UserZoom_Ecommerce_Moda.pdf Estudio sobre ecommerces de Moda] #Usability | * 2013: [https://www.dropbox.com/s/ay0q8b7sklv9y1g/2013_UserZoom_Ecommerce_Moda.pdf Estudio sobre ecommerces de Moda] #Usability | ||
| − | |||
| − | |||
== UI / Visual == | == UI / Visual == | ||
* 7 Rules for Creating Gorgeous UI (Part 1) https://medium.com/@erikdkennedy/7-rules-for-creating-gorgeous-ui-part-1-559d4e805cda | * 7 Rules for Creating Gorgeous UI (Part 1) https://medium.com/@erikdkennedy/7-rules-for-creating-gorgeous-ui-part-1-559d4e805cda | ||
| − | |||
=== Patterns === | === Patterns === | ||
| Línea 64: | Línea 64: | ||
==== Icon Fonts ==== | ==== Icon Fonts ==== | ||
| + | * http://www.entypo.com/ | ||
* http://glyphsearch.com/ | * http://glyphsearch.com/ | ||
* http://symbolset.com/ | * http://symbolset.com/ | ||
| Línea 79: | Línea 80: | ||
* http://www.webresourcesdepot.com/30-awesome-and-free-flat-icon-sets/ | * http://www.webresourcesdepot.com/30-awesome-and-free-flat-icon-sets/ | ||
| − | ==== Fonts | + | ==== Fonts ==== |
| + | * http://www.fontsquirrel.com/ | ||
* http://webfontscorner.com/ | * http://webfontscorner.com/ | ||
Revisión del 07:54 23 feb 2015
Color
- http://demosthenes.info/blog/61/An-Easy-Guide-To-HSL-Color-In-CSS3
- http://itpastorn.github.io/webbteknik/future-stuff/svg/color-wheel.html
HCI
- Psych 101: The Psychological Basis for UI Design Rules http://www.slideshare.net/guest45d695/jeff-johnson-psych-101-the-psychological-basis-for-ui-design-rules-522929
Cool Interactions
Research
- Good Kickoff Meetings http://goodkickoffmeetings.com/
Personas Definition
- http://blog.hubspot.com/blog/tabid/6307/bid/30907/9-Questions-You-Need-to-Ask-When-Developing-Buyer-Personas.aspx
- http://www.smartinsights.com/marketplace-analysis/customer-analysis/web-design-personas/
Reports
- 2013: Estudio sobre ecommerces de Moda #Usability
UI / Visual
- 7 Rules for Creating Gorgeous UI (Part 1) https://medium.com/@erikdkennedy/7-rules-for-creating-gorgeous-ui-part-1-559d4e805cda
Patterns
Stock photos
- https://unsplash.com/
- https://medium.com/p/62ae4bcbe01b
- http://lifehacker.com/heres-a-list-of-more-than-30-free-image-sites-that-dont-1650481161
Technical documentation sites
- http://strava.github.io/
- http://docs.spark.io/#/
- https://www.mapbox.com/mapbox.js/api/v1.6.0/mapbox-layers/#featurelayer.getfilter
Style Guides
- Android https://developer.android.com/design/index.html
- Front end and UI style guides: http://sideproject.io/front-end-and-ui-style-guides/
Design tools / templates
WP Templates
Fonts / Icons
Icon Fonts
- http://www.entypo.com/
- http://glyphsearch.com/
- http://symbolset.com/
- http://sixrevisions.com/resources/free-icon-fonts/
- http://fortawesome.github.io/Font-Awesome/
- http://ui8.net/ui-font
Icons
- http://symbolicons.com/
- http://www.streamlineicons.com/
- https://picons.me/#thin
- Weather Icons: https://creativemarket.com/lilsquid/6687-Lil-Stories-Weather-Icons
- http://www.smashingmagazine.com/2013/06/17/foodie-icons/
- http://www.webresourcesdepot.com/30-awesome-and-free-flat-icon-sets/
Fonts
Cool Fonts
- "Avenir Next LT W01 Demi", "Avenir Next W10 Demi", "MuseoSans", 'Helvetica Neue', Arial
- ProximaNova, ProximaNovaBold
- source-sans-pro, sans-serif
- ClarendonFSLight,Georgia
- "fenwick-1","fenwick-2",sans-serif (http://www.brainpickings.org/index.php/2013/07/09/vi-hart-explains-stravinsky/)
- http://www.fonts.com/font/latinotype/trend?SortColumn=name_ascending&font-size=32&colorpicker-foreground=000000&colorpicker-background=ffffff&QueryFontType=Web&SortDirection=Ascending&page=1#product_1243408
Cool use of fonts
Forms
UI Examples
Configurators
Learning
- http://hackdesign.org/
- Required reading for product designers http://www.robertlenne.com/requiredreading/
Mobile
