S&E Takes on GenerateNYC

Being a young designer—I’ve been in the professional field just under two years—I was thoroughly excited to be heading to the Big City for the GenerateNYC conference. Like, beyond excited. I had never been to a design conference; heck, I had never even been to New York.

Times Square in New York City
Published: 6.2.2015

I had the opportunity to attend the GenerateNYC conference this spring. I'll be doing a series of posts on the amazing design insight I took away. Read my previous posts below:

The Total User Experience
Play With Your Designs
Maintaining Sanity
Hard Work Up-Front Pays Off in the End

I was even more excited to absorb all that I could about web design from my colleagues: At Sanger & Eby, we’re always learning, always adapting, and always seeking new ideas that can help our clients achieve their goals. It’s what we do; it’s who we are.

On top of how entertaining all the speakers were, we realized we’re already doing a lot of the things touched on, and we learned a few things to improve upon along the way—so cheers to that! In the next few weeks, I’ll be talking about some of the key ideas and best practices from the conference, as well as how we bring them to life for our clients.

First, I want to talk about…

Atomic Design Illustration from Brad Frost

Biology + Design = Magic

When you get the parts right, the whole will follow suit; it’s a natural fact. Brad Frost, the keynote speaker, spoke about the concept of Atomic Design. In a nutshell, it’s about designing the content and not the container. 

“Web is not a platform. It’s a continuum.” — Jeremy Keith

In today’s world, there’s a new device released hourly, it seems, and none of them house a standard screen size—so how on Earth are we suppose to design a layout for all of them?! We don’t. That’s the beauty of atomic design. We design what’s going on the page and not the actual page, at least not initially.

We’ve seen it work for our clients. Take Clark State Community College. A college website is delivering a vast array of content to a number of audiences, and needs to be able to reach them wherever they are. When we began the redesign, after sitemap and wireframe approval, we began by looking at content types. The information that needed to be communicated called for tables, statistics, buttons, text fields, content callouts, contact information, photo callouts—the list goes on and on…

Design Concept from Clark State Community College Website Redesign

So that’s how we started. How does each of those pieces look? How do they fit together? We created a system specific to Clark State Community College that would fit any screen size, as well as their growing content needs.

When you start with the content, the container doesn’t matter. Once we’ve created a component library full of buttons and charts and photo galleries and drop-downs and … (you get the point), we start figuring out how each piece will fit together to create a system—a responsive system—that will work in any situation: mobile, tablet, desktop and everything in between. Atomic Design leads to Responsive Design, and the result is magical.

Keep reading.
Load All
View More