Takeaways from Breaking Development Conference

December 30, 2013 | Matt Diehl

RWD whiteboard presentation

This past October, I was fortunate enough to attend the Breaking Development conference in Nashville, Tennessee. Breaking Development focuses on emerging techniques for doing web development and design for the wide array of devices people use today.

As TBG (The Berndt Group) and the rest of the web development community continue to shift their focus towards building responsive websites, we’re coming to realize all of the challenges associated with it. Attending the Breaking Development Conference provided a lot of insight into what other web development companies have been doing to cope with the challenges of responsive web design.

Perhaps one of the biggest challenges that has emerged from responsive web design is communicating to clients, and even internally, how everything will work and appear, without actually building everything up front (and then changing it all). It’s a lot quicker to make two design directions in PhotoShop than it is to do the same in HTML and CSS. Unfortunately, a PhotoShop mock can only show a tiny sliver of a responsive website. It’s like trying to describe a whole movie with a single frame; it’s just not very effective. Fortunately, this seems to be a common problem, and it emerged as a pattern from the talks at Breaking Development conference.

Ben Callahan, from Sparkbox, gave a talk called Prototyping Style. He discussed an approach called the “1 Deliverable” Workflow, which focuses on constant involvement from your team. Visualizing the workflow looks more like a spiral than a straight line.

"1 Deliverable" Workflow

In the “1 Deliverable” workflow, design should start by establishing an aesthetic, and should be done using a tool you’re comfortable with, that can also effectively help a client communicate their interests. Examples given included style comparisons, style tiles, and style prototypes, and even a pinterest board of different websites – all of these convey aesthetic and feeling without nailing anything down or spending too much time.

Another speaker, Brad Frost, talked about his concept of “Atomic Web Design.” He emphasized that the notion of web “pages” is a rather outdated concept. We should instead consider websites as a system of components, or “tiny bootstraps, for every client” (quoted from Dave Rupert, in reference to Twitter Bootstrap, the popular front end framework). This was particularly interesting, as he suggests actually starting a project with the style guide, treating it as a hub for the entire design process and sharing with all of the team members and the client. If clients and team members all understand the basic building blocks of a website, it could lead to more efficient communication.

Atoms, Molecules, Organisms, Templates, Pages

My main takeaway from the Breaking Development conference was that doing responsive web design successfully requires significant change from our traditional workflow. While there’s value in a linear approach to building a website, it can also lead to a serious lack of understanding between team members and clients. There may never be a perfect way for handling large responsive web design projects, but we’re starting to come up with some great solutions that could make communication and understanding significantly easier. Here at TBG, we say “bring on responsive in 2014!” and we’re looking forward to contributing our own great solutions to the responsive web design dialogue and coming up with solid solutions for our clients.

About the Author

Matt Diehl

When I'm not making websites at TBG as a Senior Front-end Developer, I'm often making sites at home, learning more about building them, or playing guitar in a dingy basement in Paul Newman and the Ride Home.

Leave A Reply

comments powered by Disqus