With the big success of the Austin event, we decided to bring ARTIFACT to the East Coast and chose Providence, RI for its great tech scene, design schools, fabulous restaurants, convenience, and affordability. Turns out, it was a great decision! We filled the aptly-named Grand Ballroom at the historic Biltmore Hotel and presented our program to an enthusiastic crowd, this time with Ethan Marcotte in the keynote slot.

Thank you Providence for being the perfect host, and thanks to our Speakers, Sponsors, and Attendees for making the first ARTIFACT EAST fantastic.

What People are Saying

And Other Good Stuff

Photos

Flickr Set (by Chris Casciano)

Opening Party Photos

Closing Party Photos

Program

Day One / November 4, 2013

9:45 AM – 11:15 AM

Yesenia Perez-Cruz
Ben Callahan

Get Your (Visual) Style On

Our speakers present alternative approaches to web page mockups that separate the visual design language (the “look and feel”) from they layout of specific pages.

SLIDES: Get Your (Visual) Style On" (PDF)

11:30 AM – 12:30 PM

Andrew Pratt

Evolving the Digital Style Guide

Many digital style guides are ancient relics, created for the designer as a way to properly dictate the use of visual elements. However, we live in a world where our digital products and services are judged not just how they look, but by what they do and how they behave. So a relevant style guide needs to speak to a larger audience, including the UX designer and developer, to create the attribute that all brands should strive for: consistency.

We will explore:
• The problems with current style guides
• What other companies are doing
• The essential components
• Where to go next

SLIDES: Evolving the Digital Style Guide (PDF)

Lunch (12:30 PM - 1:30 PM)

1:30 PM – 2:45 PM

Jared Ponchot

How to Prototype Using Responsive Frameworks

It’s becoming clear that it’s preferable to transfer your designs into code as early in the process as possible, and using a grid or a framework can give you a head start. But how do you use them? Jared introduces the best options and translates a sketch to an HTML prototype before your eyes!

SLIDES: Getting Real with Responsive Wireframes (PDF)

4:15 PM – 5:30 PM

Test
Test
Test
Test

How to Set Client Expectations

We designers aren’t the only ones needing to adapt to a changing web ecosystem. Our clients and bosses also need to change their expectations around what a “site design” entails today and what deliverables will be provided during the design and development process. Every member of our panel has experience selling responsive design to clients and adjusting deliverables and payment schedules in an appropriate way. They’ll share their experiences and welcome questions from you and your fellow attendees.

SLIDES: How to Set Client Expectations (PDF)

Day Two / November 5, 2013

8:30 AM – 9:30 AM

Ethan Marcotte

The Map and the Territory

When we create for the web, we participate in a kind of public art. We code, we design, we build for an audience, shaping digital experiences that provide a service, or that create joy, or that simply connect readers with words written half a world away. But in this session we’ll look at some ways in which our audience reshapes the way we think about responsive web design, and see where they might be leading us—and the web—next.

9:45 AM – 11:15 AM

Jen Simmons

Responsive Layouts Beyond the Sidebar

When approaching the design of a responsive website, old habits might focus you on sidebars and footer regions for placing content. It's natural to assume the best responsive solutions are to be found in moving those regions around the page as whole units. But that way of thinking could lead you miss the best stuff about responsive design. Let go of the old habits, and discover how focusing on content can drive far superior responsive layouts.

SLIDES: Responsive Layouts Beyond the Sidebar

11:30 AM – 12:30 PM

Christopher Schmitt

GitHub for People Who Don't Code

As code becomes an integral part of the designer's toolbox, it becomes increasingly important for designers to “play well with others.” Git is the most popular version tracking system in the web development world and you’ll learn how to use it! This session gives you basic GIt training including what Git is, how it looks on the command line, how to find your way around GitHub, and services that provide a friendly front-end interface.

SLIDES: GitHub for People Who Don't Code (PDF)

Lunch (12:30 PM - 1:30 PM)

1:30 PM – 2:30 PM

Dan Rose

Photoshop’s New Groove

Not too long ago, being the best web designer around was synonymous with having serious Photoshop skills. But having to design for a bajillion devices, you've likely been told “you can't use Photoshop anymore.” In a HTML5 and CSS3 world, is there any room for our old friend? Absolutely. This session is chock-full of ideas, including an in-depth look at some great tools for repurposing Photoshop in your Responsive Web Design workflow.

SLIDES: Photoshop’s New Groove (PDF)

2:30 PM – 3:30 PM

Jason Pamental

How to Design with Web Fonts

You can't design ‘content first’ without good typography, but there’s more to it than just dropping in a line of Javascript or linking to some CSS. We'll cover things like:

• Font services vs. self-hosting (smackdown-style)
• Where they work (and where they don't)
• Performance (and how to get more of it)
• Icon fonts (even MORE resolution independence)
• Mobile use (benefits and bear traps)
• Fallbacks, FOUT & Freakouts (don't present to clients without this)
• Super Fancy (ff)eatures (ligatures & other Open Type goodness)

Don't get me wrong—I love web fonts and good typography—but it is still a bit ‘Wild West’ out there, so it pays to be prepared.

SLIDES: Designing with Web Fonts: Type, Responsively (PDF)

DEMO: Google Web Font Demo

Social Break (3:30 PM - 4:30 PM)

4:00 PM – 5:00 PM

Sophie Shepherd
Kevin Sharon

A New Toolbox: Secrets from Happy Cog

Kevin and Sophie reveal Happy Cog’s design process through their experience building a responsive site from beginning to end, including: kicking off the project, the collaborative design process, and the tools they tweaked along the way. Find out what worked and what they learned. In the end, it should be clear that this is a time for experimentation and finding new approaches for new tasks.

SLIDES: A New Toolbox (PDF)

5:00 PM – 5:30 PM

Brad Frost

Closing Words:

Brad wraps up the first ever ARTIFACT Conference by reminding us that the web is about people.

SLIDES: PEOPLE (PDF)

Workshops

Day Three / November 6, 2013

10:00 AM &ndash 5:00 PM

Ben Callahan

Build Responsively Workshop (Full Day)

at

Build Responsively introduces workshoppers to the mindset and techniques necessary for embracing the fluid nature of the web. The full-day workshop provides a broad sweep across the major topics involved in building responsive websites, including:

  • Responsive Web Design 101
  • Web Design Process for Responsive Sites
  • Project Deliverables
  • Techniques for Structuring Code
  • Flexible Content Considerations
  • Shifting Interaction Models
  • Navigation on Responsive Sites
  • Performance Considerations
  • Responsive Thinking

Across each topic, Ben Callahan from Sparkbox will provide a good starting point of best practices, relevant examples, recent industry developments, and challenging hurdles. Throughout the day, workshoppers will have opportunity to dig into code examples and exercises, but content will also be accessible for non-developers.

We ask that all workshoppers bring at least a basic understanding of HTML/CSS, a laptop, and an opinion.

10:00 AM &ndash 5:00 PM

Brad Frost

Everything You Wanted to Know about Responsive Design…And Less! (Full Day)

at

Everything You Wanted to Know About Responsive Design...And Less! is a full-day workshop that takes a deep dive into the world of responsivewebdesign, covering everything including broad concepts, strategy, how responsivedesign affects process, responsivedesign patterns and principles, and development best practices and considerations.

Oh, and the "...And Less" part? Responsive design is a huge topic so unfortunately it's impossible to pack everything about it into a single day. But that doesn't mean we can't try, right? Here's what will be covered:

  • The ever-shifting landscape – The web landscape is getting more diverse every single day, and this section will address why responsivewebdesign is becoming increasingly essential
  • Approach – There's more than one way to skin this mobile web cat. We'll look at the various strategies being used to address the zombie apocalypse of devices
  • Foundations of Responsive Design – Responsive web design 101. Fluid grids, flexible media andmedia queries make up the core of responsive web design
  • Principles of Adaptive Design – What beyond layout do we need to concern ourselves with when creating great multi-device web experiences? We'll cover how ubiquity, flexibility, performance, enhancement and future-friendliness are powerful principles for making great adaptive web experiences.
  • Atomic Design – Atomic design is a methodology to help you create robust design systems. We'll go over how to break an interface down into its atomic elements, and why that matters for designing for the multi-device Web
  • Strategy and Workflow – Our new reality means that we need to adapt our process and workflow to match. This section will tackle thorny areas like convincing your clients, changing the behavior of your colleagues and designing in the Post-PSD Era.
  • Responsive Patterns – Creating adaptive interfaces is challenging, but thankfully the web community is hard at work creating flexible, downright innovative design patterns. We'll look at how to tackle layout, navigation, images, tables and more.
  • Development Best Practices – The way we build websites has changed. This section will discuss mobile-first development, conditional loading and more to help you develop future-friendly web experience

Evening Events

Sunday, November 3, 2013 / 5:30 – 7:30 PM

Check-in and Welcome Reception

at Biltmore Mezzanine Balcony

Come by and meet your fellow conference-goers while you enjoy a drink in the gorgeous Biltmore lobby balcony! Pick up your conference gear and badge, too.

Monday, November 4, 2013 / 7:00 PM – 10:00 PM

Opening Night Party

at AS220

Tuesday, November 5, 2013 / 6:30 PM   9:30 PM

Closing Party

at The Salon