Breaking Development Conference
Nashville July 2014

Breaking Development Conference – Nashville – July 2014  #BDCONF
Gaylord Opryland Hotel and Convention Center Nashville TN, July 29-30, 2014

The Opryland Hotel and Convention Center is an immense hotel and conference center, with 40 acres of shops, gardens, and restaurants under roof. The hotel boasts 2,884 rooms. It’s fun just to find your way around the hotel and an awesome place for a web development conference. Over 152 meeting rooms; 600,000 sq. ft. of total meeting space. One ballroom alone has capacity for 7,050 people.

I really like the format of Breaking Development conferences: Best-of-class speakers, top sponsors, and all sessions in one room, one at a time, with everyone hearing the same thing at the same time.

Attendance is limited and not crowded. I estimate 175 were in attendance, plus speakers and the terrific conference folks from Unmatched Style. You didn’t have to scramble from one track and session to another and don’t miss one session in favor of another. Great way to run a conference, with plenty of time to meet with both other attendees and speakers.

#BDCONF used MailChimp’s Gather App to send txt updates to attendees throughout the conference. This was a great way to keep everyone in synch, especially about evening meetups, etc.

Emphasis was on mobile design and UX. I saw 2 main themes: (1) the state of mobile web and how we are struggling to move our design mindset from large screen to small, and (2) new approaches to managing web design/development projects and getting to done (#GTD) faster.

~~~  ~~~  ~~~  ~~~  ~~~   ~-~  ~~~  ~~~  ~~~  ~~~  ~~~  

Following are links to individual session notes from Breaking Development Nashville July 2014:

If you missed the conference in July, the next Breaking Development Conference is in Orlando November 3-5, 2014

Other Takeaways from Breaking Development Nashville – July 2014:

  • Expectations of device: location, context, voice, …
  • Lotsa bashing of the Hamburger Menu. It’s only intuitive to designers/developers.
  • Don’t use Carousels. They don’t convert to click-throughs.
  • Tip: Collaborate on a Google Doc to share note taking.

“If you want to go quickly, go alone. If you want to go far, go together.”
~African Proverb

Small Screen Navigation – Ben Callahan

Breaking Development Conference – Nashville – July 2014
Conference Session: Small Screen Navigation
Ben Callahan – SparkBox

A review of current mobile design patterns for navigation and interaction. Trigger Indicators and Interaction Patterns.

My Notes:

  • Don’t assume the big companies got it right. Don’t blindly copy patterns.
  • Vast differences in nav indicators and response across sites (e.g. “>” on some sites opens/closes a menu; on other sites it takes you to a page).
  • Content First – make sure we are building the right nav.
  • Give priority to high use cases.
  • Focus – overlay content with nav, e.g. content half hidden while overlay with menu.
  • Behavior – e.g. single top-to-bottom accordion menu JavaScript – strive for a single DOM.
  • Fallbacks aren’t worth it. Start with the lowest common denominator.
  • Usability – Web Designers understand Hamburger Menu, average user does not.
  • “Familiarity breeds usability” e.g. same nav on PC and Mobile.
  • “Design without testing is guesswork.”

Other conference notes on Ben Callahan at BDCONF can be found at: Ben Callahan notes on Speaker Deck

“You cannot do timeless work on your own. It takes a team. Collaborate!”
~Ben Callahan

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:

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

The Universal Power of Tablet PCs

While researching mobile strategy I came to realize the universal power of Tablet PCs. No other device can access both old and new web sites and run apps, with a screen size that accommodates complex interactions. Smartphones provide all the same access but fail when a larger screen is really needed. In the form-factor tug-of-war the Tablet PC fits all of your needs except the “fits in your pocket test”.

The Tablet PC

  • Can view both mobile and web properties: websites, mobile websites, and apps.
  • Has a screen large enough for complex, multi-page transactions.
  • Can have both Wi-Fi and cellular connectivity.
  • Has a modern browser that can take advantage of responsive designed web sites.
Tablet PCs Span both Mobile Web and Apps

Tablet PCs have the widest range of mobile and traditional web access.

-New iPad Air and iPad Mini: Techcrunch
-Nokia’s first Tablet PC: Wired
-Microsoft Updates Surface Tablet PC models USAToday

Decision Criteria for Mobile Development

Companies founded in the mobile age have an advantage. They’ve incorporated mobile from the start. Many companies are now working to incorporate mobile access into web applications and overall business strategy. Mobile can be a difference-maker and a budget-breaker. This post looks at two currently popular techniques to incorporate mobile access into websites and e-commerce: Responsive Web Design and Mobile App Development. Continue reading