Obvious Always Wins – Luke Wroblewski
my favorite talk. Luke uses data to tell great stories. Luke pointed out how “obvious” design changes involve tons of thinking, planning and work.
Design is obvious in retrospect. Lots of work goes into making a design obvious.
More companies are moving to a bottom bar layout on mobile for three reasons:
- you can focus on core features
- grow critical engagement
- ergonomics
Quantitative research tells you what happened and qualitative tells you why.
With hamburgers – you are presented with a mega menu list of choices. Overwhelming. With the rise of phablets, ergonomically a bottom menu is easier to use.
Below the fold isn’t the problem – the problem is that people don’t scroll when they think that the site ends. A problem with blocky boxy layouts.
Change makes ppl uncomfortable and the key to failure is to try and please everyone.
Products needs to have a point pf view – don’t blindly copy one or another.
Motion in Design Systems: Animation, Style Guides, and the Design Process – Val Head
Better animation communication
- shared vocabulary
- established animation values
- documentation and repeatability.
Storyboards and Sketches
- Where is the potentiual for animation in this flow?
- How can motion make this easier to understand.
- How do we animate between views logically?
- Quick iternations
- Anyone can make one – just need paper and pencil!
What to draw
Trigger —> Action —-> Quality (how does it happen)
Motion comps – Exactly how does this show how the animation works? Which item should move and when. Does the animation quality match our brand? Tools: Tumult Hype, AfterEffects, Adobe Animate.
Explore the details -> used to test out ideas and communicate deliverables
- Duration and delay values
- Details of the easing
- Repeat values, iterations
- Deliver the above variables.
Interactive Prototypes
- What will this interaction feel like?
- Does animation feel right in this context?
- How will animations interact with real data?
Define and Document – saving future you time and effort
Design Beyond our Devices – Ethan Marcotte
No more designing for pages or for patterns, design for principles.
Conversations about responsive web design lead to the same place: “Well, where are we going?”
In sum:
- Mobile is still exploding
- Ride of tablets and phablets
- Post desktop investment – watches, fridges, whatever?!??!
Moving from page to patterns. A network of patterns that can be rearranged and moved.
Web’s inherent variability needs to lead to device agnostic content. In addition, 605 of mobile connection is less than 3g.
Desvice agnostic helps users with: hostile, crap browsers, tiny screens, slow networks, touch inputs.
Design for nonideal areas of use. Document your patterns.
- Visual hierarchy
- Pattern naming and conventions
- Translate inventory into HTML and CSS
Team style guide – language meaningful to your team.
