This session was done by Erik Klimczak. I got into it late, and it was standing room only, so I had to jot notes down on my phone. Hopefully these still make sense and there’s not too many typos/autocorrects.
- James Webb Young quote about ideas
- Sketch out ideas
- Sketch early& often to identify edge cases quickly
- Define patterns, be consistent, reduce steps
- Storyboarding as a form sketching
- Drawing app in context of environment will help define usage
- Tools: sharpie, moleskine, non-photo pencil, neutral gray pen
- Wireframing to identify interactions, pattern layout, and get stake holder buy in early
- Good wireframe: content, interaction, layout, hierarchy, functionality
- Prototyping: whole point is to be wrong
- Paper prototyping give sense of relative size. Think about things like touch screens and apps.
- Prototyping is about taking it. Be clever, not complicated
- Colors: start with solids and add gradients if necessary
- Be aware of the psychology of colors
- Use tints of color to add more colors to your palette of 2-3 colors
- Shades of gray for the chrome of the app
- Typography: if done right, you don't see it.
- For print use serif body font with san-serif headers. Generally opposite for digital
- Pick a typography and stick with it.
- Rhythm & Scale calculator in Chrome app store
- Pick a single family with lots of variations to give variety.
- Visual Communication: telling the most with the least amount on a screen at a time.
- Basically logically organizing UI.
- If things look the same or are grouped together, the user expects them to behave the same.
- Consistent margins, spacing, type size...
- Reducing colors, and redundancy will greatly help.
- Grids actually help break up a UI to help with consistent layout
- Motion: easing should be between 250-350 milliseconds to always feel snappy
- Animations don't always have to be complete for a user's mind to fill in the blanks.
- Use motion for long running operations
- Artefact Animator for C#/XAML
- Interaction design: user flow is when the interface gets out of the way so the user feels productive
- Avoid modal states & pop ups
- Use color cues (red X)
- Don't block UI
- Read About Face 3
- Solicit feedback: if the user doesn't know they can do something or doesn't feel confident about an action, they won't perform the action
- Mouse adorners, touch/click states, audio, inline feedback (invalid input, password strength), wizards, refresh animations for long operations all are great forms of feedback
- UX patterns: don't reinvent the wheel
- Most every pattern you'd need is out there
- He has a forth-coming book: Design For Software
No comments:
Post a Comment