Get a Peek at Our Front-end Workflow at CSS Dev Conf

Emily Lewis

It's been just over a year since the vast majority of our projects required some type of responsive work. And more responsive work, means more responsive deliverables during all phases of our projects.

Coincidentally, that same 12 months saw the business grow when Lea joined the team. And moving from a individual freelance business to a team-based organization means new workflows.

It's Over, But We've Got You Covered!

My Starter Files presentation was a success! Get my slides for more information about frameworks and front-end workflows.

To evolve with these business changes, I made a number of major changes to my front-end development workflow and approach. While it quite literally is an evolution that will never be “done,” I'm sharing what I've devised for Bright Umbrella's front-end process at the upcoming CSS Dev Conf!

Starter Files

I dubbed my new approach “starter files,” based on a term Allison Wagner mentioned on a recent CTRL+CLICK episode. Before talking with her, I called them “base files.” And now, several months since submitting my talk proposal, my process has evolved even further and I really am not yet sure what is a good name for it.

All that aside, it started as a way to address my dislike of frameworks. As much as I really dig the idea of a pre-built system, I’m a control-freak when it comes to source code. I like semantics. I have preferences for naming conventions. I have a preferred way of commenting and organizing. So I never could find a framework that suited me. I also didn't want to accept a framework just for rapid prototyping and end up with code that I wouldn't use in production.

But I need rapid prototyping as much as I need code that is up to my own standards. And I need more web-based project deliverables. With more responsive projects, I need web wireframes. With more clients who wanted robust resources, I need style guides. And, of course, I still need my front-end templates.

Long story short(ish), I came up with an approach that supports every single web-based deliverable involved in our projects:

  • Web-based wireframes
  • Element collages / style tiles
  • Front-end templates
  • Style guides

Basically, I created our own “framework” or “starter files” that reflect our naming conventions, our preferred organization and our approach to writing HTML, CSS and JS. These core files also feature efficiencies for both rapid prototyping and production-level development (not to mention maintenance).

The approach relies on techniques inspired by the things I like from different frameworks, adds Sass, uses modular HTML for common content, and reduces redundant code.

And I'll be breaking it all down at CSS Dev Conf.

Join Me (and Lea!) in New Orleans

Tickets are still available, and I can think of nothing better than three days of CSS in New Orleans in autumn. So grab a ticket and join me (and Lea, who’s attending because it’s a great conference)!

Subscribe to the Forecast

Resources for smart business and smart websites

Ready to See Results?

We've got some bright ideas — let's talk!