HOW Interactive Conference 2013: Tools & Resources

When I first set out to write about what I learned over 3 fabulous days at the HOW Interactive Design Conference in Chicago, I realized (as I sifted through pages and pages of notes) that what’s needed here isn’t another recap of sound bites from the event. What I usually hear from design conference attendees is “it was good but I was expecting more” or “I had a great time but it only reinforced what I already knew.” If you’ve scoured hundreds of articles, blogs, and books about how to be a better designer then you don’t need to learn more, you need to do more. So, with this article, I figured you’d want tools to get the job done.

I’ve put together the tools and resources that the speakers shared at HOW, some of which are free.

PROTOTYPING & WIREFRAME TOOLS

sketches

Axure.com
Make interactive wireframe and prototypes without writing code.

UIStencils.com
Get the tools you need to sketch any type of prototype with pen and paper. Check out this iPhone Stencil Kit!

Protosketch
Build fully-interactive prototypes from your UI Stencil Sketches.

FluidUI.com
Design working mockups for mobile and tablet apps in the browser to share instantly.

Invision
Quickly share a mockup or demo a mobile app with this prototyping and collaboration tool for designers.

Flinto
Make your designs interactive. Create iOS prototypes with your rough sketches or final mock-ups. This tool adds interactivity by linking screens so you can quickly share with your client.

Skala preview
Send pixel perfect previews from your Mac to as many devices as you like. And if you’re working in Photoshop CS5 or higher, you can preview as you edit.

Codiga
A cloud-based drag-and-drop mobile interface builder. Import your own code or choose from their JQuery powered library of components.

Wirify.com
Convert any web page into a wireframe. The PRO version lets you export and edit the wireframes into a variety of formats.

Sketch
A vector graphics app (Mac only) for web and UI design. Render text, create artboards, and use its adjustable 960 grid for wireframes. Using Sketch Mirror, you can preview your work on your iPhone and tablet over Wi-Fi.

USABILITY TESTING

Silverback
Usability testing software for designers and developers. Screen capture, record live video & audio of your users testing your website.

Optimizely
Website Optimization and A/B Testing

UXrecorder
Mobile Website Testing for iOS

DESIGNING & BUILDING

Chris Butler

Macaw
Tired of designing in Photoshop and Illustrator? This web design tool writes code as you draw it.

Codrops
A web design and development blog that publishes articles and tutorials on the latest trends and techniques.

Hammer.js
Javascript library for multi-touch gestures.

Adobe Generator for Photoshop CC
Create image assets in real time.

Adobe Edge Reflow
Design responsive CSS layouts for all screen sizes and export to an HTML code editor with Adobe Edge Reflow CC.

Communication is Key

BOOKS, BLOGS, AND MORE…

Want to know more? Here are some books from the HOW speakers themselves. If I hadn’t brought all carry-on luggage, I might have bought every one of these. Thank goodness for the internet.

Patrick McNeal Twitter
Creator of designmeltodown.com
Session:  What You Need to Know To Be An Effective Web Designer
Books: The Mobile Web Designer’s Idea Book, The Web Designer’s Idea Book

Chris Converse – Twitter
Codify Design Studio
Session: How to Turn Your PSD Documents into Web Pages
Some Great Resources and Templates can be found here

James Victore – Twitter | YouTube
Keynote Speaker
Book: Victore or, Who Died and Made You Boss?

James Pannafino
Associate Professor, Millersville University
Session: Interdisciplinary Approach to Interactive Design
Book: Interdisciplinary Interaction Design

Chris Butler – Twitter | Blog
COO, Newfangled
Session: Master (minding) the Process: Presentation Slides
Book: The Strategic Web Designer

Margot Bloomstein – Twitter
Principal, Appropriate, Inc.
Session:  Making Meaning in Content and Design – Presentation Slides
Book: Content Strategy at Work

Todd Zaki Warfel
Co-Founder, Nimbly App
Session: Interactive Prototyping & Exploration of Standard Prototyping Tools
Book:  Prototyping A Practitioner’s Guide

Terry White, Sr.
Worldwide Evangelist, Adobe
Session: Create HTML Websites, iPad Apps and eBooks Without Writing Code
Tutorials

Cameron Moll
Founder, Authentic Jobs
Session: Visual Execution of Branding Across Platforms
Books: CSS Mastery , Mobile Web Design

Christopher Cannon
Senior Designer, Bloomberg
Session: Designing Data: How to Create Meaningful Visualizations – Presentation Slides

Brian Wood
Co-Owner, AskBrianWood.com
Session: Bridging the Designer/Developer Divide

David Sherwin – Blog
Principal Designer, frog
Session: Using Storytelling Techniques to Create Better Interactive Experiences
Book: Success By Design: The Essential Business Reference for Designers

Dan Rhatigan
Type Director, Monotype
Session: Tailored Type for Screens – Website

Want a play by play of the event? Here’s a beautiful summary of the social media from the conference as it happened.

Have you used some of these? Do you have something to add? We want to hear about them!

Jennifer Marin is the co-president of AIGA Baltimore and she clearly loves resources.

By Jennifer Marin
Published January 10, 2014