You're a designer
•
0 likes•537 views
Too many developers think they can never learn to design. While it may be true that you'll never be a master graphic artist, there are tons of tips and tricks to make sure your application or website looks professionally designed. In this talk, we'll cover the basics of good design, view examples of both good and bad design and discuss how to incorporate design thinking into your development process.
Recommended
More Related Content
Recently uploaded
Recently uploaded (20)
Featured
Featured (20)
You're a designer
- 1. Bryan Robinson bryanlrobinson.com DESIGNER Web Workers Presented Tuesday, May 12, 2015 I PROMISE You’re a
- 3. Bryan Robinson bryanlrobinson.com DESIGN Design is a funny word. Some people think design means how it looks. But of course, if you dig deeper, it’s really how it works. - Steve Jobs Defining Terms Source: http://www.impactinterview.com/2011/08/steve-jobs-on-product-design-2/
- 4. Bryan Robinson bryanlrobinson.com USABILITY 1. Learnability 2. Efficiency 3. Memorability 4. Errors 5. Satisfaction Defining Terms Source: Nielsen Norman Group
- 5. Bryan Robinson bryanlrobinson.com INFORMATION ARCHITECTURE Information architecture (IA) focuses on organizing, structuring, and labeling content in an effective and sustainable way. Defining Terms Source: usability.gov
- 6. Bryan Robinson bryanlrobinson.com WIREFRAME/SKETCH A way of solidifying a page’s layout utilizing placeholders in lieu of imagery and content in order to rapidly define information architecture for a page. Defining Terms Source: My Own Brain
- 7. Bryan Robinson bryanlrobinson.com INTERACTION DESIGN Interaction Designers strive to create meaningful relationships between people and the products and services that they use, from computers to mobile devices to appliances and beyond. Defining Terms Source: IxDA.org
- 8. Bryan Robinson bryanlrobinson.com INTERFACE DESIGN • Information architecture defines the structure of information. • Interaction design lets people manipulate and contribute to that information. • Visual design communicates these possibilities to people. The user interface is the sum of all these things. Defining Terms - Luke Wroblewski via http://www.freshtilledsoil.com/what-is-user-interface-design/
- 9. Bryan Robinson bryanlrobinson.com Let’s talk process
- 10. DESIGN THINKING Bryan Robinson bryanlrobinson.com Process Source: https://patwellconsulting.com/DevelopmentResources/DesignThinkingProcessWorkshop.aspx
- 11. Bryan Robinson bryanlrobinson.com Process Source: http://www.telono.com/en/services/usability/ucd-process/ USER CENTERED DESIGN
- 15. Bryan Robinson bryanlrobinson.com Design Guidelines Informational Layout | Aesthetic Judgement
- 17. Bryan Robinson bryanlrobinson.com WHITESPACE Whitespace doesn’t have to be white. It’s merely the space that does not contain content whether through padding, margins and gutters. Sometimes referred to as Negative Space. Information Layout
- 22. Bryan Robinson bryanlrobinson.com GROUPING Items grouped together on a page have either an implied or an inferred relationship to one another. Make sure you’re implying the relationship, don’t let your user make the inference. Information Layout
- 25. Grouping Bryan Robinson bryanlrobinson.com Source: Twitter for iOS Information Layout
- 26. Bryan Robinson bryanlrobinson.com VISUAL HEIRARCHY Using size, color, weight and layout to create a visual flow for a user through content. Information Layout
- 32. Bryan Robinson bryanlrobinson.com RULE OF THIRDS A theory of design that stems from art and photography stating that in a square format, placing the focal points of the composition at the axes of vertical and horizontal lines along the thirds of the piece. Information Layout
- 33. RULE OF THIRDS Bryan Robinson bryanlrobinson.com Source: http://webdesignledger.com/tools/rule-of-thirds-in-web-design Information Layout
- 34. RULE OF THIRDS Bryan Robinson bryanlrobinson.com Source: http://codropspz.tympanus.netdna-cdn.com/codrops/wp-content/uploads/2012/05/neve.jpg Information Layout
- 35. RULE OF THIRDS Bryan Robinson bryanlrobinson.com Source: http://www.webdesignerdepot.com/2014/01/design-to-the-nines-and-the-rule-of-thirds/ Information Layout
- 37. Bryan Robinson bryanlrobinson.com COLOR PSYCHOLOGY AND THEORY Colors influence users strongly, but often in subconscious ways. Designers don’t pick colors because they’re pretty, always have a plan. Aesthetic Judgement
- 38. COLOR PSYCHOLOGY/ COLOR THEORY Bryan Robinson bryanlrobinson.com Source: http://boutiquemc.co.uk/general/colour-pyschology-why-we-chose-our-brand-colours/ Aesthetic Judgement
- 39. COLOR PSYCHOLOGY/ COLOR THEORY Bryan Robinson bryanlrobinson.com Source: kuler.adobe.com Aesthetic Judgement
- 40. Bryan Robinson bryanlrobinson.com FONT CHOICES Start using non-standard fonts. Open Sans (san serif), Droid Sans (san serif), Roboto (san serif), Josefin Slab (slab), Prociono (serif). Rule of thumb: Use a slab or serif font for an “accent” font (headlines) and a sans-serif for body copy. Aesthetic Judgement
- 42. Bryan Robinson bryanlrobinson.com SHAPE AND SYMMETRY Just like colors and fonts, various shapes and layouts convey different meanings. Aesthetic Judgement
- 43. Bryan Robinson bryanlrobinson.com Aesthetic Judgement SHAPE AND SYMMETRY Source: http://www.zevendesign.com/mood-lines-giving-designs-attitude/#smooth
- 44. Bryan Robinson bryanlrobinson.com Aesthetic Judgement SHAPE AND SYMMETRY Source: http://speckyboy.com/2013/02/06/symmetry-in-web-design/
- 45. Bryan Robinson bryanlrobinson.com Aesthetic Judgement SHAPE AND SYMMETRY Source: http://speckyboy.com/2013/02/06/symmetry-in-web-design/
- 46. Bryan Robinson bryanlrobinson.com Squint Test - Look at a design. Squint your eyes. Can you tell the hierarchy of the page? Don’t Use Rotators - It’s been proven that rotators and carousels actually hurt conversion rates. Don’t use them. The Noun Project - Get a subscription to The Noun Project. Unlimited icons for $10/month. Totally worth it. Provide a next step - Direct the user. They want to know where to go next. Calls to Action are your friend. Subtle Patterns - Background patterns can be a great way of adding texture and class to your site, but they can be annoying to create even if you’re a designer. Subtle Patterns is an awesome reason for repeating patterns. Tips and Tricks
- 47. Bryan Robinson bryanlrobinson.com How do you get better?
- 48. Bryan Robinson bryanlrobinson.com Now’s the time… or… you know… later in one of these places: Twitter: @brob LinkedIn: http://linkedin.com/in/bryanlrobinson `