Prototyping Responsive HTML5 Web Apps with Matt Kelly

About the Talk

Mobile traffic is already overtaking desktop traffic in some parts of the world, and soon it will in the U.S., but the barrier for some people to create sites that work across devices can seem too high. Building prototypes for web sites and web apps is getting harder, and the need to have a working prototype to use and get feedback on is more critical than ever.

In this talk, we'll focus on solutions for rapidly prototyping for all devices at once. We'll delve into Foundation, a new HTML5/CSS/JS framework, to quickly prototype sites and web apps that work on any kind of device, at any resolutions, with a variety of capabilities and constraints.

Through code examples, we'll look at creating complex layouts in minutes that let you easily try out different experiences and different interactions. The key to success in the new online world is rapid prototyping and iteration, so come hear about a slick new way to get things done.

About the Speaker

Matt is the Lead Software Engineer at ZURB - a 13 year old interaction design firm here in the Bay area. When he's not working on one of ZURB's awesome products (Notable,Verify, and Chop), he's bundling up functionality from those apps into jQuery plugins. He has a deep love for Rails, jQuery, and anything else that adds joy to coding web apps.

When he's not coding he's building 3D cameras out of iPods or soldering toy guitars from cereal boxes.

Schedule

6:30 pm: Meet, eat, and mingle

7:00 pm: Introductions/sponsors

7:10 pm: Matt's presentation begins

8:15 pm: Q&A and prize giveaways*

8:30 pm: Lightning Talks**

* You must be at the event in person to qualify for prizes.

** Please contact the organizers if you wish to do a lightning talk.

This event will be live streamed at http://www.ustream.tv/channel/cbsi-tech-talks. Use #sfhtml5 on Twitter to ask questions during the event. We will also record the event and post the recording link here and from @sfhtml5.

Join or login to comment.

  • Darren

    Thanks for putting the video up!

    December 6, 2011

  • Thomas Hong

    I just watched it and it looks great! Everything nicely edited.

    December 1, 2011

  • Vanessa Wang

    Recording is now available: http://goo.gl/iaV4e

    December 1, 2011

  • Rick H

    This was just what I needed. Gave insight, workflow and best practices for rapid prototyping. Answered, addressed and gave great tools for making responsive Web Apps for all mobile devices. Wonderful. Thank you! PS I just ran my first test of foundation on a small site I had to build- it's very easy to use and it is nice to be able to rapidly prototype this way and test it on different devices. In 8 hours I had a fully working prototype that works on everything I can get my hands on. Nice.

    December 1, 2011

  • Sufyan Adam

    Was expecting more code samples

    November 23, 2011

  • Marjan Panic

    up to date topic

    November 23, 2011

  • Anne Spalding

    Excellent and informative presentation

    November 23, 2011

  • Keith Silva

    Nice presentation. Great food! Thanks. The organizers of this Meetup are doing a very high quality job.

    November 23, 2011

  • Theo Cummings

    Very important topic for web development.

    November 23, 2011

  • Mark Pundsack

    Inspiring!

    November 23, 2011

  • Justin Killian

    Great Meetup! If anyone is interested in or knows someone who may be interested in a range of developer positions, Quipt is hiring. We'll be formally launching at CES, but to apply or learn more email me directly [masked].

    Thanks,
    Justin

    November 22, 2011

  • A former member
    A former member

    Touch vs click for better ux. cool.

    November 22, 2011

  • Vishal Dubey

    Voice is all garbled on the live stream. Picture is fine.

    November 22, 2011

  • Vanessa Wang

    Just sorting out a few last minute technical issues on the live stream. Thanks for your patience!

    November 22, 2011

  • Vanessa Wang

    @Suyash: Please see the comment from Peter Lubbers from Saturday. Thanks!

    November 21, 2011

  • Suyash Joshi

    Is this going to be the same talk that Matt did at Hacker Dojo last month?

    November 21, 2011

  • Andrew de Andrade

    Well.... doh! I changed my RSVP and lost my space based on my assumption.

    November 19, 2011

  • Jordan

    @Peter/Andrew, so will this focus on content for mobile, or on mobile web apps? For example my company has built a mobile web app to let you upgrade your seat during a live event, we aren't delivering lots of text/media to the user, just smooth "native-app-like" functionality.

    November 19, 2011

  • Peter Lubbers

    @Andrew: Actually, this won't be the exact same presentation (although large parts will be similar). We spent quite a bit of time reviewing the content and asked the presenter to make some modifications geared to our user group and to focus on those specific areas.

    1 · November 19, 2011

  • Andrew de Andrade

    I just realized that this is going to be the same Zurb Foundation talk that was given at the Javascript SF meet up and the UX Eye meet up. The presentation and Zurb Foundation framework is great, but to be fair it would be more accurate to describe the presentation as a presentation on the responsive prototyping of content sites than HTML5 Web Apps. "HTML5" and "web apps" are being used more as buzz words here.

    November 19, 2011

  • Vanessa Wang

    @Joe If a spot opens, the next person on the waiting list is bumped up. You should receive an email notification, as well as be able to view your status on this page.

    November 17, 2011

  • joe saunders

    How will waiting list people know they are getting a spot?

    November 17, 2011

  • Vanessa Wang

    There is metered street parking (you have to pay until 6p, then it's free), as well as a few paid lots in the area. The venue is a few blocks from the Montgomery BART station (see the map).

    November 17, 2011

  • David Dowdall

    Is there parking? Should I take Bart or Drive?

    November 17, 2011

  • Vanessa Wang

    @Jordan: Apparently 4. Doh.

    November 15, 2011

  • Vanessa Wang

    Apologies for the missing waiting list. It's enabled now.

    November 15, 2011

  • Jordan

    How many web developers does it take to request a feature?

    November 15, 2011

  • Ulysses

    Yea, where is the waiting list?

    November 15, 2011

  • Libby Baldwin

    Is this meetup really closed (no waiting list available)?

    November 15, 2011

Kaazing

Kaazing makes an HTML5 WebSocket Gateway that rocks!

Marakana

Marakana provides HTML5 training courses in SF and NYC.

Adobe Systems

Major sponsor and provides an awesome venue!

HTML5 Dev Conf

Major sponsor

Google I/O Extended

Major sponsor

Yelp

An awesome venue and refreshments!

Say Media

A great venue for our meetups!

FluentConf

Sponsoring the user group

DevCon5

Sponsors our meetups!

O'Reilly Media

Great books on HTML5, JavaScript, mobile, and related technologies.

Log in

Not registered with us yet?

Sign up

Meetup members, Log in

or
By clicking the "Sign up using Facebook" or "Sign up" buttons above, you agree to Meetup's Terms of Service