Real World Responsive Web Redesign – Jonathan Stark

Breaking Development Conference – Nashville – July 2014
Conference Session: Real World Responsive Web Redesign
Jonathan Stark

This session discussed the RWD/redesign of Entertainment Weekly. I took away more about about project management than RWD but I was more so looking for PM tips.

My Notes:

  • RWD Guiding Principles: speed is a feature; progressive enhancement from low device to high; assume low; easier to progressively add features than to degrade gracefully.
  • Design: No Big Reveal – Constant feedback during design. Final design is 1 week from last review.
  • Big Pieces From Client: we knew all photos, videos, etc. from current site, and challenges before we started design process.
  • Advertising is a big challenge for mobile.
  • Prioritize Design with typical sticky note voting. Allow 20 seconds for +/- reactions to similar sites or comps/mood boards.
  • Set Initial design decisions: e.g. no carousels, progressive content, etc. Now you have a roadmap.
  • Did not use Agile or Waterfall but a hybrid, with information architecture, visual, and development in parallel.
  • Weekly build and push to dev site. Weekly all hands review with client. Weekly freeze.
  • Throw out elements client doesn’t like (e.g. which callout do you not like). Thereby weekly not a sign off.
  • Always design and demo in the browser, not comps.
  • Emphasize phone view in weeklies.
  • Start with small scale elements for review (e.g. and build to footer, then pages).
  • JavaScript: “Every script has a cost”
  • Consider starting with a site that works without JavaScript.
  • Create your own JavaScript library is better for minimum footprint. Don’t go to extremes with JavaScript.
  • Help yourself out: Use a common/single bug tracker; lots of screen shots for bug documentation with re-creating; we used multiple trackers – should have learned GIT better; automate deployment.

“Communication Trumps Process!”
~Jonathan Stark

Mobile Design Now
Luke Wroblewski

Breaking Development Conference – Nashville – July 2014
Conference Session: Mobile Design Now
Luke Wroblewski

Luke Wroblewski is synonymous with Mobile First. He set the mobile design tone for the 2-day Breaking Development Conference.

My Notes:

  • Lots to learn but more to unlearn about mobile.
  • Above the fold: Scrolling is a continuation. Clicking is a decision.
  • We’re trying to fit large screen to small.
  • Hamburger Menu is a case of follow the leader imitation. The word menu, outlined to appear as a clickable object, was interpreted as a menu 21%+ more than the Hamburger Menu in A-B testing.
  • It takes big changes to go small.
  • Compared hotel sites with +/- 50% difference in process steps. [the difficulty of any extra field or step is magnified in mobile]
  • Startup: Release/Refine/Repeat; Learn Faster

Luke Wroblewski conference notes can be found at: http://www.lukew.com/ff/

[On Mobile] “It takes big changes to go small.”
~Luke Wroblewski

Assumed Strategy

Everything that I consider about web design and development comes with the assumption that you are operating from a well defined strategy. Whether you’re a freelancer or corporate web manager – if you don’t have a strategy, you’re just building web pages.
Continue reading